{"id":562,"date":"2012-03-10T20:28:50","date_gmt":"2012-03-10T19:28:50","guid":{"rendered":"http:\/\/www.b3rt.nl\/weblog\/?p=562"},"modified":"2024-04-15T09:48:15","modified_gmt":"2024-04-15T07:48:15","slug":"web-yoobi","status":"publish","type":"post","link":"https:\/\/b3rt.nl\/weblog\/portfolio\/web-yoobi.html","title":{"rendered":"Web: Yoobi"},"content":{"rendered":"\n

Voor mijn werk ben ik al ruim een jaar bezig met een groots project. Namelijk de nieuwbouw van de webapplicatie mijnuren.nl<\/a>. Deze uit zijn voegen gegroeide webapplicatie voor o.a. urenregistratie, verlof en verzuimregistartie, planning en facturatie zou het uitgangspunt worden voor een heel nieuwe applicatie. Deze nieuwbouw maakte het mogelijk om alles opnieuw te bekijken en te beoordelen: op het gebied van techniek, maar vooral op het vlak van vormgeving en interactieontwerp. De nieuwe applicatie kreeg ook een nieuwe naam: Yoobi\u00ae met als slogan ‘Helder, flexibel en altijd actueel’.En bij een nieuw product hoort ook een website: www.yoobi.nl<\/a><\/p>\n\n\n\n

\n<\/picture>\n
De homepage van Yoobi.<\/figcaption>\n<\/figure>\n\n\n\n

Concept en vormgeving<\/h2>\n\n\n\n

De website moest natuurlijk goed aansluiten bij de nieuwe applicatie, daarom is gekozen voor een open maar direct communicatie met de bezoeker. De website moest goed duidelijk maken wat de bezoeker kon verwachten van de applicatie \u00e9n bovendien aangezet worden tot het bestellen van een licentie of aanvragen van informatie of een demonstratie.<\/p>\n\n\n\n

De website heeft als secundaire functie het bieden van support informatie. Zo wordt een deel van de website gebruikt als kennisbank met veelgestelde vragen en als help-sectie voor de applicatie zelf. Zo kun je in de applicatie op elke gewenste plek op de help-knop klikken om vervolgens een artikel over dat onderdeel op de website te vinden.<\/p>\n\n\n\n

Net als in de applicatie draait alles om de inhoud. De content voor de website is kort en direct, zonder veel poespas of opsmuk. De artikelen zijn zo gepresenteerd en geschreven zodat scannend lezen wordt aangespoord.<\/p>\n\n\n\n

Bouw en onderhoud<\/h2>\n\n\n\n

Omdat de nieuwbouw van de applicatie gewoon door ging, was er niet bijzonder veel tijd beschikbaar voor de ontwikkeling van de productwebsite. Daarom was het vanzelfsprekend dat de website op basis van het Mura CMS ontwikkeld zou worden. Ikzelf en mijn collega’s zijn daar goed mee bekend wat een snelle bouw periode garandeert. En bovendien onderhoud eenvoudig maakt.<\/p>\n\n\n\n

Om het vullen en onderhouden van de website in goede banen te leiden heb ik een contentplan geschreven waarin eerder gemaakte afspraken en handreikingen staan. Zo is het voor alle redacteuren duidelijk waar een artikel of pagina aan moet voldoen.<\/p>\n\n\n\n

\n<\/picture>\n
Een knooppunt pagina voor (bijna) alle mogelijkheden in Yoobi. Deze pagina geeft een goed beeld van wat er kan in de applicatie.<\/figcaption>\n<\/figure>\n\n\n\n
\n<\/picture>\n
Een van de artikelen.<\/figcaption>\n<\/figure>\n\n\n\n
\n<\/picture>\n
Een vergelijkingstabel voor de drie licenties die Yoobi kent.<\/figcaption>\n<\/figure>\n\n\n\n
\n<\/picture>\n
Het bestelformulier voor de ‘basic’ variant.<\/figcaption>\n<\/figure>\n\n\n\n
\n<\/picture>\n
Een van de help-artikelen die benaderbaar zijn vanuit de applicatie.<\/figcaption>\n<\/figure>\n\n\n\n

Update 2015<\/h2>\n\n\n\n

Als toegift in mijn laatste dagen bij E-dynamics\/Yoobi heb ik een nieuw design gemaakt voor de website voor Yoobi. Het ontwerp uit 2011 had zijn beste tijd gehad en was ook niet geschikt voor verschillende schermgroottes. Ik maakte een nieuw ontwerp dat meer aansloot bij de huidige trends en staat van de applicatie. Uitgangspunt was hierin “meer beeld, minder tekst”. Om de design templates gemakkelijk over te nemen heb ik ook de HTML\/CSS aangeleverd als thema voor het onderliggende Mura CMS.<\/p>\n\n\n\n

\n<\/picture>\n
De nieuwe 2015 homepage met meer beeld content.<\/figcaption>\n<\/figure>\n\n\n\n
\n<\/picture>\n
Een product-content pagina waarbij je kunt zien wat je kunt krijgen.<\/figcaption>\n<\/figure>\n","protected":false},"excerpt":{"rendered":"

Ter ondersteuning van de nieuwe webapplicatie suite Yoobi heb ik een nieuwe marketing website ontwikkeld. <\/p>\n","protected":false},"author":2,"featured_media":1290,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"class_list":["post-562","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-portfolio"],"_links":{"self":[{"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/posts\/562","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/comments?post=562"}],"version-history":[{"count":19,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/posts\/562\/revisions"}],"predecessor-version":[{"id":1308,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/posts\/562\/revisions\/1308"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/media\/1290"}],"wp:attachment":[{"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/media?parent=562"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/categories?post=562"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/b3rt.nl\/weblog\/wp-json\/wp\/v2\/tags?post=562"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}