Webrichtlijnen

Als lid van de normcommissie Drempelvrij.nl, die de normering en toetsbaarheid van de Webrichtlijnen bewaakt, ben ik nauw betrokken bij het vaststellen van de succescriteria waarmee vastgesteld kan worden of een website wel of niet aan een richtlijn voldoet. Gelukkig zijn de meeste van de 125 Webrichtlijnen goed meetbaar en is de set voor een groot deel opgebouwd uit reeds breed geaccepteerde (W3C) richtlijnen zoals XHTML en WCAG (toegankelijkheid). Natuurlijk zitten er ook richtlijnen tussen die wel op te brengen zijn voor de overheid - omdat zij de maatschappelijke verantwoordelijkheid hebben iedere burger te bedienen - maar waar een groot deel van het bedrijfsleven te weinig ‘return on investment’ (ROI) op haalt. Dit gaat dan niet zozeer om bouwrichtlijnen, maar vooral om redactionele en multimedia richtlijnen. Desondanks zijn veel mensen het erover eens dat de bestaande Webrichtlijnen op zich een goede checklist vormen voor een technisch kwalitatief hoogwaardige website.

Usability

Terug naar het voornemen om een set richtlijnen op te stellen om de gebruikersvriendelijkheid van overheidswebsites op een hoger peil te brengen. Op www.begrijpelijkewebsites.nl is de overheid een wiki gestart om tot een verzameling te komen van “concrete toetsbare standaarden waaraan overheidssites zouden moeten voldoen” en die “eventueel als formele Webrichtlijnen worden ingevoerd”. En het is vooral dit laatste voornemen dat mij zorgen baart. Op zich is het streven naar meer bruikbare overheidssites toe te juichen, maar als usability engineer zet ik grote vraagtekens bij het plan een usability meetlat te ontwikkelen en al zeker niet eentje met wettelijke status. Blijkbaar schuilt er achter het plan een grote politieke druk om gebruiksvriendelijkheid te vangen in beleid, misschien in de hoop negatieve media-aandacht en kritische Kamervragen te voorkomen. Maar persoonlijk denk ik dat dit project zijn doel voorbij schiet.

Volgens mij is usability niet in harde scores uit te drukken. Usability is contextgevoelig. Wat bruikbaar is, hangt af van doelgroep, doel, gebruiksfrequentie en meer. Niet voor niets is het favoriete antwoord van usability engineers wereldwijd “It depends“. Jakob Nielsen is beroemd geworden met usability regels. Enkele voorbeelden daarvan zijn:

• “Groepeer alle corporate informatie in één duidelijke sectie.”
• “Benadruk op de homepage wat de site biedt aan waarde voor gebruikers en waarin dat verschilt van de concurrentie.”
• “Link op de homepage naar de belangrijkste taken.”
• “Neem een zoekbox op, bij voorkeur in de rechterbovenhoek. Plaats er geen label voor, maar label de zoekknop ‘zoek(en)’.”
• “Zet in hyperlinks de belangrijkste trefwoorden vooraan.”
• “Presenteer op de homepage geen actieve link naar homepage.”

Maar deze regels dekken slechts een deel van usability. Ik kan al deze regels volgen en toch een onbruikbare site opleveren. Of andersom: als ik bepaalde regels niet volg, kan ik toch een bruikbare site maken.

Ikzelf hanteer ook enkele vuistregels, zoals:

• “Organiseer informatie op thema of taak in plaats van doelgroep of vanuit een organisatieperspectief.”
• “Beperk het aantal parallelle navigatie-items op de hoogste niveaus tot 7.”
• “Orden informatie niet alfabetisch als er een meer betekenisvolle ordening mogelijk is (bv. populariteit). Alfabetisch staat in veel gevallen gelijk aan willekeurig.”
• “Niet het aantal keer klikken, maar het gemak waarmee de gebruiker zijn weg naar de doelinformatie vindt, is leidend voor de informatiestructuur.”
• “Stel in hyperlinkteksten niet de bestemming van de link centraal, maar het onderwerp of de actie die de gebruiker op die bestemming vindt. Voorbeeld: Niet ‘Neem contact op via het contactformulier’, maar ‘Neem contact op’.”
• “Verwerk opsommingen niet in lopende tekst, maar in een opsomminglijst.”
• “Schrijf getallen in cijfers.”

Maar belangrijk is te beseffen dat dit soort vuistregels geen waarheid op zich vormen. Ze zijn grotendeels gebaseerd op psychologische en ergonomische inzichten. Bijvoorbeeld: George Miller toonde in 1956 aan dat het kortetermijngeheugen of werkgeheugen gemiddeld 5 tot 9 chunks kan vasthouden om mee te werken. Daaruit leiden we de ‘maximaal 7 navigatie-items’ vuistregel af, maar het is best mogelijk dat het kortetermijngeheugen van ouderen gemiddeld minder kan bevatten dan dat van kinderen.

Bruikbaar resultaat?

Als de overheid streeft naar een te formaliseren set Usability Webrichtlijnen, moet zij richtlijnen vinden die toetsbaar zijn en die altijd en overal van toepassing zijn. Zo’n lijstje is waarschijnlijk best te maken, maar ik denk niet dat resultaat niet bruikbaar is voor het beoogde doel. De enige usability richtlijnen die aan de voorwaarden voldoen, zijn hele specifieke, zoals:

• “Presenteer op de homepage geen actieve link naar homepage.”
• “Verwerk opsommingen niet in lopende tekst, maar in een opsomminglijst.”
• “Schrijf getallen in cijfers.”

En enkele design patterns als:

• Broodkruimelpad
• Zoekveld en -resultaat
• Paginanummering (o.a. bij zoekresultaat)

Maar ook daar kan soms prima van afgeweken worden zonder aan bruikbaarheid te hoeven inboeten. Denk bijvoorbeeld aan het broodkruimelpad van Delicious, of een zoekresultaat in Google Maps.

Oftewel: de selectie richtlijnen die aan de voorwaarden voldoet, zal te beperkt zijn om een betrouwbare uitspraak te kunnen doen over de gebruikersvriendelijkheid van een website. Dit dilemma blijkt ook wel uit de ‘Final draft Usability Webrichtlijnen’ die gisteren werd rondgemaild aan verschillende usability professionals in Nederland. Veel kandidaatrichtlijnen die in deze draft zijn opgenomen, voldoen niet aan de vereisten die ik hierboven opsomde. Bijvoorbeeld:

• “Voer al in een vroeg stadium gebruiksonderzoeken uit. Gebruik daarvoor minimaal drie testrondes.” Minimaal drie? Ook voor kleine campagnesites?
• “Toon alle noodzakelijke informatie op de homepage — en niet meer dan dat.” Wat is noodzakelijk? Snelkoppelingen naar populairste downloads zijn niet noodzakelijk, maar soms wel heel nuttig.
• “Bied altijd meerdere navigatiemogelijkheden aan.” Altijd?
• “Verdeel veel informatie over meerdere pagina’s (in plaats van scrollen op één pagina).” Achterhaald idee. Scrollen is niet eng. Echt niet.
• “Zorg ervoor dat de inhoud van de homepage op één pagina past.” Mensen scrollen ook op homepages.
• “Hou ontwerpen helder en simpel.” Niet meetbaar.
• “Voorzie de website van voldoende nuttige informatie.” Niet meetbaar.

Daarnaast bevat de draft richtlijnen die al lang en breed in de originele Webrichtlijnen zijn opgenomen, op het gebied van toegankelijkheid en W3C-richtlijnen. En in de wiki staat zelfs nog de lang achterhaalde 3-kliks-regel.

Hoe usability waarborgen?

Goed, als een set ‘output centered’ richtlijnen gericht niet de juiste weg is, wat dan wel? Waarborg usability in het (ontwerp)proces. Bijvoorbeeld:

• “Voor aanvang van een redesign van een website, voer gebruikersonderzoeken, bijvoorbeeld een usability test, interviews of enquête, uit om zeker te weten welke aspecten van de huidige website voor verbetering vatbaar zijn of juist erg gewaardeerd worden.”
• “Identificeer doelgroepen. Creëer doelgroepbeschrijvingen of persona’s. Stel per doelgroep use cases op. Baseer alles zoveel mogelijk op onderzoeksdata.”
• “Betrek de doelgroep(en) bij het creëren van complexe navigatiestructuren, bijvoorbeeld door middel van cardsorting.”
• “Test een prototype van het ontwerp op usability alvorens het ontwerp definitief goed te keuren.”
• Enzovoorts.

Voor de (oorspronkelijke) Webrichtlijnen wordt zoiets al gedaan. De Adviesgroep Webrichtlijnen werkt momenteel hard aan een stappenplan dat “overheden, organisaties en bedrijven helpt om het proces rondom de realisatie van een nieuwe website zodanig in te richten, dat het eindproduct in zo hoog mogelijke mate voldoet aan het kwaliteitsmodel Webrichtlijnen”.

Een dergelijke aanpak verdient veruit mijn voorkeur boven de thans ingeslagen weg van de usability Webrichtlijnen.

Jullie mening?

Graag hoor ik het standpunt van andere usability professionals in Nederland over deze ontwikkeling. Goede kans dat de overheid vasthoudt aan het voornemen usability in haar beleid op te nemen. Daarom denk ik dat het belangrijk is om als usability-veld een geluid te laten horen, zodat we ons straks als opdrachtnemers niet geconfronteerd zien worden met een beleid waar we niet achter kunnen staan.

2 dimensies

Mulder’s model ging uit van 2 dimensies, die hij tegen elkaar uitzette op een x- en y-as:

• Houding (wat men zegt) vs Gedrag (wat men doet)
• Kwalitatief vs Kwantitatief

In mijn artikel Data driven design lichtte ik deze dimensies toe en vertaalde ik zijn model tot onderstaande figuur:

3e dimensie: Context

Rohrer voegt hier een dimensie aan toe, namelijk de context waarin onderzoek wordt uitgevoerd. Hij onderscheidt onderzoeksvormen waarbij de respondent een website/product:

• op natuurlijke wijze gebruikt, dus met zo min mogelijk interferentie door de onderzoeker;
• aan de hand van een script gebruikt, dus waar de onderzoeker het gebruik stuurt;
• niet gebruikt, dus interviews en dergelijke;
• [combinatie van bovenstaande].

Dit resulteert in het volgende model:

4e dimensie: Tijd

Rohrer voegt ook nog de vierde dimensie - tijd - toe aan het model. De fase binnen het ontwikkelproces beïnvloedt tenslotte ook de keuze voor een bepaalde methodiek. Rhorer associeert ontwikkelfasen met doelstellingen:

• Strategize: Het genereren van nieuwe ideeën en concepten in de beginfase;
• Optimize: Het continu verbeteren van het ontwerp nadat de ontwerprichting is gekozen;
• Assess: Het evalueren van het ontwerp nadat het in gebruik is genomen.

Wat is nu de waarde van deze modellen van Rohrer en Mulder? Onderzoek kost toch altijd tijd en geld. Om zo efficiënt mogelijk te onderzoeken, is het handig meteen de onderzoeksmethoden te kiezen die het beste passen bij de projectfase en de onderzoeksdoelstelling.

Ever since I published a Visio template for SharePoint 2003 solutions two years ago, one question in particular kept coming back: “Do you also have a Visio template for designing SharePoint (MOSS) 2007 sites?” Truth is, I hadn’t, because (a) I stopped designing SharePoint portals and (b) I switched to Axure for prototyping. But thanks to Casey, Dan, Michelle and everyone else asking, I spent some time updating the template and stencil to accommodate SharePoint 2007. And here it is.

The conditions for use are the same as before: The template and stencil are free to use, just don’t re-sell them or distribute them under your own name. Please refer to this article.

Software Requirements

These tools were created for use with Microsoft Office Visio Professional 2003 and 2007. You can publish your wireframes in HTML (’save as web page’).

Download the Visio template and stencil for designing SharePoint (MOSS) 2007 sites (ZIP-file). Store the files in ‘My Documents\My Shapes’.

Using the template

If you open the template in Visio, you will see that there are several pages already there:

• Doc Info: Speaks for itself;
• Site Structure: Empty page to draw a site map or something similar (shapes not included, sorry);
• Home: Here you design your MOSS home page;
• Default: Default foreground page for you MOSS pages;
• BG home: Background for home page
• BG navigation: Background for most other pages.

You can build up the global navigation on the background page ‘BG navigation’. To indicate an active menu item, simply drop an extra tab on the active foreground page and set its status to “Foreground Tab”.

To create wireframes, insert a new page, and make sure the page properties (menu ‘Page Setup’) are set to:

• Type = ‘Foreground’
• Background = ‘BG SPS homepage’.

The result is an empty page, but with the background and some rulers that help you positioning webparts on the background.

You will notice that the drawing page size is bigger than the standard paper formats A4 or letter. I created a larger drawing space (A3 landscape) to be able to design 1024×768 wireframes and still have room for annotations on the side. Printing of the page won’t be a problem, because the page is set up to automatically scale to your printer size (landscape).

Using the stencil

The stencil offers some of the basic SharePoint webparts. Simply drag & drop them and customize the list or library. I have included an empty webpart, document library, links list, calendar and some custom list views. To customize a component, you have to ungroup it first. It will lose its connection to the master shape, but that is okay.

Good luck and enjoy!

PS. This is my last Visio template for SharePoint.

• is een subjectieve gebeurtenis, die alleen gevoeld wordt door de persoon die de ervaring meemaakt.
• is alleen in het heden. Belevenissen die geweest zijn, noemen we herinneringen. Belevenissen die we nog niet meegemaakt hebben, maar wel bedacht, zijn dromen.
• is het punt waar herinnering en fantasie elkaar ontmoeten.

Je kunt dus geen belevenis ontwerpen, maar wel voor een belevenis ontwerpen.

Dit artikel is ook gepubliceerd op Frankwatching.

Waar komen we vandaan?

Vanderwal begint met het opsommen van de verschillen tussen het oude ‘Ik ga halen’-web en het ‘Kom naar mij’-web.

‘Web 1.0′ was ingericht op mensen die vanaf een desktop computer op zoek gaan naar informatie. Trouwens, dat geldt eigenlijk nog steeds: veel internetteams werken aan eigen websites en steken moeite in zoekmachineoptimalisatie opdat zoveel mogelijk mensen naar de site komen. Ook denken ze er meestal niet aan onze informatie zo aan te bieden dat mensen er ook met hun mobiele telefoon of andere devices gebruik van kunnen maken.

Over gebruikmaken gesproken. Veel informatie die aanbieden wordt, is niet herbruikbaar. Denk bijvoorbeeld aan grafieken. Dat zijn nu meestal plaatjes en zijn dus niet direct te combineren met ander data. Om te hergebruiken en combineren moeten we nu dus vaak werken met een lokale kopie van het origineel of moeten we data reproduceren.

Doordat we steeds meer vertrouwd raken met de digitale en online wereld, kunnen we buiten de bestaande containers (zoals website, browser, desktop, pagina) gaan denken en dus grenzen verleggen.

Persoonlijke informatiecyclus

Hoe ziet de (digitale) informatiewereld er voor de individuele gebruiker uit? Vanderwal deelt deze wereld op in 4 ‘information clouds’:

• Global InfoCloud: Internet. Vrije toegang tot informatie overal vandaan. Niet door de gebruiker georganiseerd of beheerd.
• Local InfoCloud: Bedrijfsnetwerk en intranet. Toegang door locatie of autorisatie. Niet door de gebruiker beheerd. Ook niet door hem georganiseerd, maar de gebruiker is vaak wel bekend met de structuur.
• External InfoCloud: Andere bedrijfsnetwerken en intranetten, waar de gebruiker geen toegang tot heeft, bijvoorbeeld wegens autorisatie, locatie of zelfs taalbarrière.
• Personal InfoCloud: Persoonlijke informatieverzameling. De gebruiker organiseert, beheert en bepaalt toegang voor anderen.

Vanzelfsprekend zijn de Global en External clouds het grootst en de Personal het kleinst. De gebruiker zelf ziet de informatiewereld echter heel anders. Hij ziet vooral de informatie die het dichtst bij hem staat en het meest toegankelijk is en de informatie die naar voren komt als hij op internet zoekt. Maar miljarden pagina’s liggen buiten zijn gezichtsveld. Zijn Personal InfoCloud is het centrum van zijn informatiewereld.

Kom naar mij

Vandaag de dag moeten we nog moeite doen om onze persoonlijke informatie goed te kunnen beheren en gebruiken. Daarom spannen we ons in om contactpersonen en agenda te synchroniseren tussen PC en mobiele telefoon, onze digitale foto’s op te slaan op de computer, e-mails door te sturen naar ons andere e-mailadres en programma’s te installeren op onze computer èn mobiele telefoon. In het ‘Kom naar mij’-web worden onze persoonlijke webgeschiedenis en al onze objecten (mensen, websites, data, enz.) online opgeslagen in een ‘cloud’, die altijd en overal via ieder device beschikbaar is, net als de software die we gebruiken. En de informatie die aangeboden wordt en die we opgeslagen hebben, is niet alleen leesbaar maar herbruikbaar. Als het goed is gaat Web 3.0 ons hier een handje bij helpen: semantisch opgeslagen informatie in open formats.

De sleutel van het ‘Kom naar mij’-web is de Personal InfoCloud. Onderstaande figuur, die de persoonlijke informatiecyclus (vinden, herkennen, opslaan, hergebruiken, volgen) uitbeeldt, laat dit zien.

Hoe kunnen we hier van profiteren? Seth Godin geeft in zijn visie op Web 4.0 een aantal uitstekende voorbeelden, o.a.:

• Mijn vlucht van Amsterdam naar New York is afgelast. Mijn telefoon (of het device waar ik op dat moment mee werk) weet mijn boeking en de afgelasting, en komt zelf met alternatieve vluchten.
• Google weet wat ik zoek en wat anderen zoeken. Iedere dag laat hij me zien wat ik naar zou moeten zoeken, maar wat ik nog niet doe. En hij verbindt me met mensen die het zelfde zoekgedrag hebben als ik.
• Ik ben laat voor een afspraak. Mijn GPS telefoon weet dit (omdat hij mijn kalender, mijn locatie, de tijd en de verkeerssituatie kent). Hij meldt mij dat ik laat ben en waarschuwt de mensen die op mij wachten.
• Tijdens het schrijven van een artikel krijg ik suggesties voor bronnen, omdat mijn tekstverwerker weet wat ik geschreven heb, waarover ik aan het schrijven ben en wat er op het web te vinden is dat daaraan gerelateerd is.

De Personal InfoCloud volgt mij, ongeacht welk device ik bij de hand heb. En zonder dat ik zelf op zoek hoef, komt de relevante informatie op het juiste moment naar mij toe.

Voorlopig is het nog niet zover. Voordat we het ‘Kom naar mij’-web en de Personal InfoCloud kunnen gebruiken, moet er nog een aantal dingen worden gerealiseerd, zoals:

• Een alomtegenwoordig Web en ‘connected’ devices;
• Software as a Service;
• Webtop in plaats van een browser en desktop;
• (Her)bruikbare data.

Alomtegenwoordig Web en ‘connected’ devices

Dankzij GSM, UMTS, GPRS en andere 3G mobiele-communicatiesystemen is het Web (in Nederland tenminste) al nagenoeg altijd en overal beschikbaar. Het kan echter nog beter. Internetabonnementen zijn nu nog device-specifiek, maar straks hebben we wellicht één abonnement waarmee onze computer, notebook, mobiele telefoon, autoradio, horloge en koffiezetter allemaal ‘connected’ zijn.

Software as a Service

Sinds 2006 zijn er veel online applicaties opgedoken die bekende desktopapplicaties zoals spreadsheets, tekstverwerkers en kalenders kunnen vervangen. Dit heet Software as a Service (SaaS). De grote voordelen hiervan zijn:

• De applicatie leeft in de browser, dus werkt platformonafhankelijk en hoeft niet per device geïnstalleerd te worden.
• Je werkt altijd met de laatste versie.
• De meeste online applicaties werken standaard met online data. Je hebt dus ook altijd je documenten e.d. bij de hand.

Webtop in plaats van een browser en desktop
Als de meeste software van desktop naar online gaat, gaat de browser steeds meer de rol van de desktop overnemen. De browser is echter nog steeds een programma op onze desktop, dat in de basis nog hetzelfde doet als tien jaar geleden: webpagina’s presenteren.

Vorige week kwam Google naar buiten met de open source browser Chrome, dat volgens Google een browser voor applicaties is in plaats van alleen maar pagina’s. Hoe fundamenteel anders het concept van deze browser is, wordt me echter nog niet duidelijk. In de presentatie over Google Chrome wordt vooral geschermd met eigenschappen als stabieler, sneller, veiliger en simpeler. Dit is natuurlijk belangrijk als we veel van onze primaire taken online gaan uitvoeren, maar niet revolutionair.

Het is waarschijnlijk dat desktop en browser zullen samensmelten tot een zogenaamde ‘webtop‘. Volgens Nova Spivack wordt de desktop van de toekomst een ‘hosted webservice’: “All devices will synch with the cloud, where your applications, data and desktop workspace state will live as a unified, hosted service. Your desktop will appear on whatever device you login to, just as you left it wherever you last accessed it.”

Wat volgens Spivack ook zal veranderen, is de verschuiving van informatie naar attendering, oftewel het ‘Kom naar mij’-web van Vanderwal. De meest schaarse resource is niet meer bandbreedte of opslagcapaciteit, maar aandacht. We kunnen de information overload nauwelijks aan, dus moeten we meer moeten overlaten aan onze persoonlijke webservice, die informatie voor ons filtert zodat wij er beter op kunnen handelen.

Twee bedrijven hebben al geprobeerd de webtop en het ‘Kom naar mij’-web te verbeelden in filmvorm. Allereerst Microsoft, die begin dit jaar een filmpje uitbracht, getiteld “Future Vision: Healthcare”.

En vorige maand presenteerde ontwerpbureau Adaptive Path zijn webtop-concept Aurora.

Aurora (complete video without commentary) from Adaptive Path on Vimeo.

De kernelementen van de Aurora webtop zijn:

• Context-bewustzijn: Er is geen product dat zoveel over ons weet als de browser: ons werk, sociale connecties, ontspanning enzovoorts. Als de browser al die data combineert met onze gedragingen en onze fysieke context, dan kan het zich aanpassen op onze online interacties.
• Natuurlijke interactie: Dit verwijst naar de natural user interface (NUI), die Microsoft al toepast in de Surface.
• Continuïteit: Een consistent interactiemodel dat overal toegepast kan worden, ongeacht schermresolutie en soort bediening (muis, touchscreen, afstandbediening). Ook moet de user experience op het ene device naadloos kunnen overgaan in de andere.
• Collaboratief: Het web is een sociaal platform, maar de browser was altijd ’single user’. Samenwerken in een gedeelde omgeving, informatie delen en data van verschillende bronnen combineren tot één overzicht worden gewone, vanzelfsprekende functies.

Beide visies liggen redelijk in elkaars verlengde, en ook met het beeld dat Thomas Vanderwal en Nova Spivack oproepen. Ik verwacht dan ook dat de eerste echte prototypes van de webtop deze lijn zullen volgen.

(Her)bruikbare data

Om de trucjes uit de filmpjes van Microsoft en Adaptive Path, zoals het combineren van grafieken, werkelijk uit te voeren, zijn het Semantic Web (zie Peter Bekels artikelen) en open formats voor het uitwisselen en samenvoegen van data onmisbare bouwstenen.

Samengevat

Verschillende ontwikkelingen, zoals Software as a Service, Semantisch Web en een alomtegenwoordig Web, zullen ons over een aantal jaren in staat stellen om onze informatie altijd, overal en device-onafhankelijk te gebruiken. Alles wat we nodig hebben, staat namelijk in onze persoonlijke, online ‘information cloud’. Desktop en browser maken plaats voor de webtop: een 100% online besturingssysteem annex browser, die ons toegang geeft tot onze applicaties en data, ongeacht device, beeldschermresolutie of locatie. De persoonlijke cloud treedt ook op als agent, die ons locatie-, tijd- en contextafhankelijk attendeert op relevante data. En alle data is opgeslagen in open, semantische formats, zodat we moeiteloos data kunnen gebruiken en mixen.

Berichten op home  =  Berichten per dag  x  Dagen op home

Rekenvoorbeelden:

• Als er per dag gemiddeld 2 nieuwsberichten gemaakt worden en ieder bericht moet ongeveer 3 dagen op de homepage blijven staan, dan moeten er 6 nieuwsberichten op de homepage staan.
• Als er per maand gemiddeld 2 nieuwsberichten gemaakt worden en ieder bericht moet ongeveer 1 maand op de homepage te zien zijn, dan moeten er 2 nieuwsberichten op de homepage staan.

Lastiger is natuurlijk de vraag: hoe bepaal je hoe lang een nieuwsbericht op de homepage moet staan? Daar is geen exact antwoord op. Het hangt namelijk van diverse factoren af, bijvoorbeeld:

• Hoe regelmatig komen bezoekers op de website?
• Bied je ook een RSS-feed en hoeveel mensen zijn daarop geabonneerd?
• Hoe belangrijk is nieuws ten opzichte van andere content (bv. producten/diensten), oftewel hoeveel ruimte mag nieuws innemen?

Frankwatching is niet de eerste die zijn lezers betrekt bij het redesign van zijn site. Eerder dit jaar betrok usability-koning Ruben Timmerman zijn lezers intensief bij het redesign van Usarchy, met succes. Bij Tam Tam hebben we dit jaar ook een keer geëxperimenteerd met een projectblog, voor het redesign van de TU Delft website (waar nu hard aan gebouwd wordt), maar in alle projecthectiek hebben we dit medium niet ten volste kunnen benutten. Desalniettemin is het in mijn ogen een uitstekende manier om al tijdens het ontwerpproces input te krijgen van de doelgroep en van professionals die het leuk vinden mee te denken.

Terug naar Frankwatching. Ik ben heel benieuwd naar het Frankwatching 4.0 concept en zal ook zeker op Forward mijn steentje bijdragen aan het ontwerp. Enne Frank, vergeet je niet de semantische (en valide) html en de gedifferentieerde RSS-feeds?

De Surface

De Surface is één van de eerste ‘multi-touch’ computerinterfaces. Nu nog een tafelmodel, maar het zal een kwestie van tijd zijn dat multi-touch computing toegepast kan worden in handzame apparaten.

Promofilmpje van de Microsoft Surface. Ook leuk: de lange demo en de parodie.

MS heeft zich ten doel gesteld meer natuurlijke, intuïtieve ervaringen te creëren. De tablet-pc liet zien dat je een computer anders kon bedienen dan we gewend waren. Met gestures en strokes van een stylus. Ook bij de Zune wordt gebruik gemaakt van gestures, met de hand. En in Windows Vista zit veel spraakherkenning en -technologie (vooral ingestoken op toegankelijkheid). Doorlopend research naar meer ‘natural computing’ heeft geleid tot een visioen van een apparaat dat:

• transparant en intuïtief is,
• hand-, pen- en stemgestuurd is,
• draagbaar is,
• altijd beschikbaar en connected is,
• eenvoudig is in vorm and profiel,
• eenvoudig laat communiceren en delen,
• een verlengstuk is van onze persoonlijkheid, en
• creatief en onderhoudend is.

Daaruit resulteert o.a. dit filmpje:

Het type interacties die mensen in dit filmpje hebben en het idee dat ‘surfaces respond to us’ is precies het visioen dat het Surface designteam voor ogen had.

Natural User Experience

Tot nu toe heeft interacteren met een computer betekend dat mensen de taal van de computer moeten leren. Het is al veel eenvoudiger dan vroeger, maar nog steeds moeten we begrijpen hoe het apparaat werkt om ermee om te kunnen gaan. De komende decennia zullen we steeds meer proberen computers de taal van mensen te leren.

“The vision of Natural User Experience (NUE) is to deliver intuitive, seamless experiences that unfold through natural human input.”

Microsoft

De Graphical User Interface (GUI) maakt dus plaats voor de Natural User Interface (NUI). Dit betekent dat WIMP (Window, Icon, Menu, Pointing device) wordt vervangen door STaG (Speech, Touch and Gesture). Onderstaand schema laat nog even de evolutie zien van command line interfaces (CLI) tot NUI.

Het ontwerpen van de Surface

De los Reyes behandelt een aantal theoretische modellen voordat hij overgaat op de ontwerpprincipes van de Surface.

Zes bekwaamheden

In “A Whole New Mind: Moving from the Information Age to the Conceptual Age” stelt Daniel Pink dat de ‘information economy‘ verschuift naar een ‘experience economy‘. Hierin is het vermogen om met informatie en feiten om te gaan niet meer voldoende.  Een nieuw tijdperk vereist het kunnen omgaan met concepten, het spelen op emotie. Hiervoor zijn de volgende bekwaamheden nodig:

1. Design: het vermogen om een product of proces te voorzien van esthetische of emotionele kwaliteiten die de gebruiker engageren (”pleasure, meaning, and beauty”).
2. Story: het vermogen om een verhaal te creëren dat gebeurtenissen, mensen, ideeën en plaatsen verbindt in een boeiend geheel. Met verhalen is kennis over duizenden jaren doorgegeven.
3. Symphony: het vermogen om verschillende stukken van multidisciplinaire perspectieven samen te voegen tot een betekenisvol en accuraat geheel. Deze vaardigheid relateert aan het ‘tekenen met de rechter hersenhelft’, focussen op relaties, metaforen en ‘big picture thinking’.
4. Empathy: het vermogen om het perspectief, de worstelingen en de beleving van anderen te begrijpen.
5. Play: het vermogen om bezig te zijn met humor en spelen. Spelen is, naast zijn vermogen om gevoelens te prikkelen, een waardevol economisch product in massamediaal and Internetgebaseerde entertainment.
6. Meaning: het vermogen om voorbij te gaan aan materiële behoeften en op zoek te gaan naar een hoger (levens- of spiruteel) doel.

Vervolgens haalt De los Reyes het dualisme aan. Volgens het dualisme zijn lichaam en ziel, cultuur en natuur, subject en object gescheiden werelden. De los Reyes stelt dat intelligentie en emotie leven in co-existentie; ze staan niet los van elkaar. Onze manier van leren laat dit zien: we nemen het beste kennis op tijdens een ervaring. En emoties zijn een readout van een ervaring (James-Lange theorie).

Dit resulteert in de ‘2-Factor Design Theory’: eerst prikkelen, dan inprenten.

Emotie

Wat is in de experience economy nog de rol van producten? Of breder gesteld: wat is de rol van objecten? Als objecten ‘embedded’ intelligentie kunnen hebben (bv. rekenmachines), en je trekt voorgaande theorieën van het dualisme e.d. door, dan kunnen ze dus ook embedded emotie bevatten.

Veel van de ontwerpvisie van de Surface is gebaseerd op emotie.

Het Surface team heeft 5 kern-ontwerpprincipes gedefinieerd:

• Natural & Intuitive: Bv. ‘Scatterview’, organische layout, alsof je foto’s op een tafel hebt die je met de hand manipuleert. We zijn al vertrouwd met deze ‘interface’.
• Unique & Magical: Niet alles wat we ontwerpen hoeft een natuurgetrouwe, exacte tegenhanger in de echte wereld te hebben. We moeten ook de kracht en waarde van technologie aanwenden.
• Social & Together: We hebben de gelegenheid om technologie in een omgeving te brengen dat het mogelijk maakt voor mensen om te ontmoeten en gelijktijdig te werken met de Surface.
• Aware & Responsive: In staat zijn dingen te herkennen en daarop te reageren. Je kunt een object op het oppervlak leggen (bv. een mobiele telefoon, een getagd object of een kwast) en de Surface weet welke interacties hij daarop kan aanbieden. “Allow doing things that are contextual. The hardest thing is to provide the exact right options, to know what people want to do with particular objects.”
• Premium & Authentic: Microsoft wordt hier langzaam steeds beter in. Dit draait om die laatste 10% van de user experience: de details, het vakmanschap dat de experience vloeiend en geweldig maakt.

Natural interface

Wat is nu de NUI van de Surface? De content is de interface. De focus lag op het direct werken met de content, in plaats van toolbars, menu’s en iconen. De ‘Scatterview’ is daar een mooi voorbeeld van: die werkt met stapels in plaats van folders.

Wat nog het dichtst in de buurt van een ’shell’ komt, zijn de access points.

Video: Microsoft Surface Access Points

“It’s hard to design a simple, focused, intuitive interface. It’s easy to complicate things by adding (navigational) elements. These are the greatest design challenges.”

Daniel Makoski (Microsoft Surface team)

Laatste ontwerpweetjes

Het Surface team heeft veel gebruik gemaakt van paper prototyping. Het bleek een ideale methode om een interface te testen die je met de hand kunt manipuleren (gestures, enz.).

Toegankelijkheid voor een NUI is pionieren. “It’s very difficult to have access standards for a space where there are no standards yet. NUI provides the promise of allowing reaction to people and how they interact, whether it’s speech recognition or touch.”

Wat betekenen al die begrippen als Contact, Gestures, Manipulations enzovoorts? Het Surface team heeft een post gewijd aan Surface terminologie.

Waarin verschilt ontwerpen en ontwikkelen van Surface-applicaties met dat van desktop-applicaties?

• Geen vaste boven-onder oriëntatie;
• Meerdere ‘muiscursors’;
• Meerdere gelijktijdige gebruikers;
• Meerdere gebruikers contexts;
• Meerdere gelijktijdige ‘drag & drop’ acties;
• Traditionele manier van data invoeren gaat niet meer op.

Lees de uitgebreide uitleg hiervan in het artikel deel 1 en deel 2.

De conferentie is gericht op (online) marketeers en marketing managers, interactieontwerpers, search engine professionals, webanalytics experts en anderen die werken aan hun online conversie.

Keynotes

Er zijn 3 uitstekende sprekers gevonden om de deelnemers aan het denken te zetten:

• Andrew Chak, auteur van het boek Submit now: Designing Persuasive Websites.
• BJ Fogg, auteur van Persuasive Technology: Using Computers to Change What We Think and Do. Ik heb hem hierover in 2005 in Montreal horen spreken; absoluut de moeite waard!
• Steve Jackson, medevoorzitter van de Web Analytics Association.

Wedstrijd

Tussen de presentaties door gaan de deelnemers zelf aan de slag met een ‘ontwerp voor conversie’-opdracht, daarbij begeleid door een design-coach en een conversie-coach. Ook hier weer een mooie lijst namen, o.a. Ruben Timmerman, Robert-jan Verkade, Tanja de Bie, Ton Wesseling, Stefan Wobben en Ronald Verschueren.

Ook ik was benaderd als designcoach, maar helaas (het leek me erg leuk) moest ik afzeggen.

Wie 19 september nog wel vrij heeft staan in zijn agenda, meld je aan!

Sinds ik lid werd in 2005, is er nooit veel aan verbeterd, terwijl er genoeg verbeterpunten aan te wijzen waren:

• De ingewikkelde url (vooral om te typen): http://del.icio.us
• Het weinig opvallende ‘Post’ als linkje om een nieuwe favoriet toe te voegen
• Het niet kunnen sorteren van je favorieten
• Moeilijk vinden van favorieten op een combinatie van tags

Gelukkig zijn de nodige verbeteringen doorgevoerd:

• Simpele url: www.delicious.com
• Actiemenu met een duidelijke “Save a new bookmark” knop
  
• Sorteerfilter
• Kruimelpad-achtige navigatiebalk op basis van tags.
  
• Aanpasbaar detailniveau
• En nog een hele boel kleine usability-vergrotende wijzigingen.

In onderstaande video kun je alle verbeteringen in vogelvlucht bekijken.

En een screenshot waar je ook veel van de verbeteringen in kunt zien: