Usability in- en rondom het huis

Usability is nog steeds één van de "hot items" bij de ontwikkeling van websites en online software. En terecht! Hoe makkelijker / prettiger de gebruiker bij zijn doel geraakt, hoe beter.

Usability wordt vaak gebruikt in de context van "het web", terwijl het natuurlijk voor iedere applicatie, iedere winkel, ieder gebruiksvoorwerp zou moeten gelden.

Maar wat dacht van je usability in je eigen werk- of leefomgeving? Laatst was ik in een verbouwde keuken en daar hingen de oven en de vaatwasser 50cm hoger dan "normaal". Even dacht ik dat het een ontwerpfout was, tot de trotse eigenaar van de keuken beide apparaten demonstreerde... De oven op "borsthoogte", de vaatwasser op "heuphoogte", het leidde vooral tot tig keer minder bukken om bij de schone borden, bestek, ovenschaal en worstenbroodjes te kunnen. Het werd bijna leuk om de apparaten te gebruiken!

Zat daaronder dan geen ruimte of geen functie meer? Oh jawel hoor, die ruimtes waren netjes ingenomen door minder belangrijke, minder frequent gebruikte zaken.

Voor mij persoonlijk was het zo'n moment om thuis weer eens door (vooral) de keuken te struinen: Waarom moet ik altijd 3 meter lopen van de vaatwasser naar de "glazenkast" - terwijl ik die dingen dagelijks gebruik? Waarom liggen die super sjieke borden hier - terwijl ik ze 2 keer per jaar gebruik en ze wel dit hele keukenkastje vullen?

Het zijn van die vragen die vaak pas in je opkomen als je (vaak door iemand anders) getriggerd wordt erover na te denken. Waarom? Omdat het met veel van die zaken "zo is, omdat het altijd zo geweest is"...

Net als voor het web geldt voor thuis (of voor op het werk) dus dat het geen kwaad kan om af en toe de nieuwe standaarden eens te bekijken. En nu snel de browser afsluiten en de keukenla gaan ordenen!

Meer dan een mooi plaatje

Een website is meer dan een mooi plaatje of goede techniek. Natuurlijk zijn die eigenschappen wel belangrijk. Een mooie website komt betrouwbaar over. Een website met goede techniek is snel en makkelijk in onderhoud. Maar een goede website is veel meer dan dat.

Helder. Een goede website is helder. Het moet een nieuwe bezoeker meteen duidelijk zijn waar hij terrecht is gekomen. Is het een winkel? Wat voor informatie kan ik hier vinden? Heb ik iets aan deze website? Zulke vragen moeten direct beantwoord worden. Een design wat de antwoorden verstopt is niet helder genoeg. Helder zijn is belangrijk.

Maar ook het pakketje mooi, technisch goed en helder is niet voldoende. Als je weet wat je op een website kunt doen moet je het ook nog makkelijk kunnen doen. Bruikbaarheid is een andere belangrijke pijler. Is het duidelijk op welke onderdelen ik kan klikken? Is de informatie structuur logisch? Als ik ergens ben gekomen, kan ik dan makkelijk terug? Hopelijk zijn de antwoorden op zulke vragen positief. Bruikbaarheid (of usability) is omvangrijk en enorm belangrijk.

De bovenstaande onderdelen bepalen voor een groot deel de gebruikerservaring die iemand heeft met een website. Waarschijnlijk is dit de belangrijkste eigenschap van een website. Iemand die een goede ervaring heeft gehad komt misschien terug. Iemand die een slechte ervaring heeft gehad komt zeker niet terug.

Webwinkels zijn deels groot geworden door het assortiment, maar de strijd tussen winkels met een vergelijkbaar assortiment wordt altijd gewonnen door de winkel met de beste gebruikerservaring.

Klap op de vuurpijl?

Op de laatste dag van het jaar nog even de 'finishing touch' van ons kantoor:

Case study: PictureThis

Afgelopen week hebben we weer een nieuwe website gelanceerd waar we ontzettend trots op zijn: PictureThis. Naast dat de website technisch goed in elkaar steekt zijn we van mening dat de website PictureThis goed presenteert en mee helpt aan het bereiken van de doelen.

Doelen bereiken

PictureThis is een evenementenbureau wat zich richt op het top segment in de markt. Ze willen fotowaardige momenten creëren die blijven hangen bij de bezoekers. Fotografie is dus heel belangrijk op de website, net als de sfeer die PictureThis verzorgt.

Aan fotografie is dus veel ruimte besteed. Veel fotografie wordt over de gehele breedte van de website getoond. De foto's bepalen samen met de achtergrond ook de sfeer op de website.



De structuur van de website is bewust simpel gehouden. Een goed voorbeeld is de cases pagina. In plaats van iedere case zijn eigen pagina te geven hebben we alle cases op één pagina geplaatst. Het is dan simpelweg een kwestie van scrollen waardoor je snel een goede indruk krijgt van wat PictureThis voor je kan betekenen.

Tekstueel gezien is de inhoud ook zo minimaal mogelijk gehouden. Paragrafen zijn kort en worden nooit breder dan 2/3de van de pagina. Hierdoor is de tekst, en dus de informatie, makkelijk tot je te nemen.

Op iedere pagina worden duidelijk de contactmogelijkheden aangegeven. Een van de opties (alleen tijdens kantooruren) is het chatten met een van de medewerkers. Deze functie hebben we speciaal voor PictureThis gebouwd. Deze functie geeft, naast direct bellen of het contactformulier invullen, iedereen makkelijk de mogelijkheid om met PictureThis contact op te nemen.

Techniek

PictureThis is opgemaakt in HTML5 en gebruikt CSS3 voor een aantal kleine visuele verbeteringen mocht je een browser hebben die de opties benut.

De carrousel en tekstanimatie op de homepage is volledig gemaakt met jQuery. Hierdoor is deze ook op apparaten zonder Flash (zoals een iPad) te zien.

HTML5 kunnen we nog niet volledig benutten, maar we hebben al wel de nieuwe opmaak tags gebruikt. Dankzij deze nieuwe technieken is het contactformulier makkelijker in te vullen op slimme touchscreen apparaten. Probeer maar eens met je iPhone of iPad het formulier in te vullen. Op het moment dat om je e-mailadres gevraagd wordt verandert het onscreen keyboard.



Op dezelfde apparaten kun je overigens ook de website als icoontje toevoegen aan je "Beginscherm". Daarvoor hebben we een mooi icoon op hoge resolutie verzorgd.

Op de teampagina staan de contactgegevens van alle teamleden opgemaakt als vCard. Dat betekent dat bezoekers in de toekomst makkelijk de contactgegevens van een medewerker in hun adresboek kunnen plaatsen. Op dit moment kan dat al via browser plug-ins, maar ook zoekmachines maken gebruik van deze techniek.

Content Management

Wat we ook zeker niet mogen vergeten is dat PictureThis.nl als een van de eerste websites draait op ons nieuwe Content Management Systeem. Hierdoor is het werken met afbeeldingen veel makkelijker, omdat je geen rekening meer hoeft te houden met resoluties.

Ook gaat het nieuwe CMS veel flexibeler met pagina indelingen om. Daardoor is het makkelijker voor ons als ontwikkelaars om afwijkende pagina layouts te maken zodat de layout de inhoud beter kan ondersteunen.

Het nieuwe CMS zorgt er ook voor dat de website beter wordt opgenomen in zoekmachines. Automatisch worden er mooie pagina URL's aangemaakt, net als een sitemap.xml bestand. Per pagina zijn de omschrijving en keywords in te stellen.


Om in herhaling te vallen; We zijn zelf super tevreden over deze website!

VSV: het eerste seizoen zit er op!

Vorig jaar rond deze tijd waren we nog volop bezig met de ontwikkeling van de VSVmanager, ofwel ons online registratiesysteem voor de VMBO / MBO scholen in de regio Den Bosch om voortijdig schoolverlaten te voorkomen.

Inmiddels hebben we de eerste groep leerlingen gevolgd tijdens hun overgang van VMBO naar MBO en het systeem heeft fantastische resultaten geboekt.

Uiteraard klopt er iets niet in deze laatste zin: het systeem heeft geen resultaten geboekt, de velen medewerkers van de VMBO / MBO scholen en de speciaal in het leven geroepen Poortwachters hebben meer dan 1200 leerlingen nauwkeurig kunnen volgen, via het systeem.

Belangrijkste toegevoegde waarde van het systeem is de match tussen school- en leerlinggegevens gebleken: de VMBO school geeft aan dat ik naar De Leijgraag in Veghel ga, terwijl ik zelf in mijn VSV profiel heb aangegeven naar het Koning Willem I College in Den Bosch te gaan.

"Vroeger" waren de schoolgegevens leidend, vooral omdat er vaak geen andere gegevens waren. In de oude situatie zou ik in bovenstaand scenario dus "kwijt" zijn en potentieel een VSV'er worden. Met alle gevolgen van dien: iedereen moet actief naar mij op zoek, hetgeen doorgaans ontzettend veel tijd en energie van iedereen vraagt.

De VSVmanager heeft in haar eerste seizoen tientallen van dit soort gevallen inzichtelijk gemaakt of zelfs voorkomen. Een resultaat waar we zeker trots op zijn.

Begin december is er een evaluatie met alle scholen, om ons langzaam maar zeker weer voor te gaan bereiden op het tweede seizoen!