Rogier van der Linde & Davy De Winne, 2014

Presentatie over: "Rogier van der Linde & Davy De Winne, 2014"— Transcript van de presentatie:

1 Rogier van der Linde & Davy De Winne, 2014
VISUALISATIE Rogier van der Linde & Davy De Winne, 2014

2 VISUALISATIE Communicatie over concepten, de context, gebruikersgroepen enz… werkt best als het op een of andere manier kan gevisualiseerd worden. Enkele technieken: Context: user stories personas Concept: scenarios storyboards UX vision videos Structuur: use cases user flows user experience map Design: moodboards style guides

3 CONTEXT – USER STORY Steekkaarten met telkens één zin:
‘As a [who/role] I want to [what/task] so that [why/goal]’ Voorbeelden: ‘As a teacher, I want to upload my course material, so that my students can access it’ ‘As a tourist, I want to see pictures of the bedrooms so that i can choose a romantic room for a week-end with my partner’

4 CONTEXT – PERSONA Fictief gebruikersprofiel als typevoorbeeld van een bepaalde groep gebruikers

5 CONCEPT – SCENARIO Stap per stap beschrijving van een concrete gebruikssituatie van jouw app/website/idee. Kan met postits weergegeven worden, b.v. blauw: een actie geel: vraag groen: commentaar roze: idee

6 CONCEPT – STORYBOARD Weergave van een scenario in stripverhaalvorm
6 tot 8 frames verhaallijn onder elke frame tekstballonnen

7 CONCEPT – STORYBOARD – ‘HELP, IK KAN NIET TEKENEN’
Je hoeft niet te kunnen tekenen; je kan de ‘ster-mannetjes’ gebruiken.

8 CONCEPT – STORYBOARD – ‘HELP, IK KAN NIET TEKENEN’
Je kan ook een korte comic maken met Photoshop ‘Cutout’ en ‘Poster Edges’ filters

9 CONCEPT – UX VISION VIDEO
Je kunt zelfs een video maken van je visie op de user experience:

10 STRUCTUUR – USE CASE Visualisatie van de vereisten van een toepassing of een deel van een toepassing d.m.v. UML (Universal Modelling Language), veel gebruikt in softwareontwerp. Focus ligt vooral op implementatie en functionaliteit, niet op de gebruikerservaring (en is dus minder interessant in deze cursus).

11 STRUCTUUR – USER FLOW Flowchart van de mogelijke acties die een gebruiker onderneemt om tot een bepaald doel te komen. User flows zijn bijzonder nuttig: je kunt een deeltaak isoleren, en kijken waar eventuele knelpunten conversie in de weg staan: volgt elke stap logisch op de vorige, m.a.w. is het voor de gebruiker op elk moment duidelijk en logisch wat de keuzes zijn, of wat van de gebruiker verwacht wordt? zijn de flows goed van elkaar gescheiden, m.a.w. is lopen op pagina’s de flows niet door elkaar? (uitzondering zijn doorverwijspagina’s zoals de homepage) Over user flows zullen we het later nog hebben.

12 STRUCTUUR – USER EXPERIENCE MAP
Een model van de complete ervaring die een persoon heeft met een dienst of product Deze experience map is opgesteld door Rail Europe. Rail Europe is een Amerikaanse distributeur reizigers 1 enkele plek biedt om treinkaartjes te reserveren en te kopen voor heel heel Europa, zodat ze niet naar allemaal verschillende websites moeten gaan. Ze hadden al een goede website en een gelauwerde contact center, maar ze wilden een beter zicht krijgen op de interacties van hun klanten op alle raakpunten, zodat ze beter zouden kunnen begrijpen waar ze hun budget, design en technologiemiddelen op moeten concentreren. Deze kaart heeft bijgedragen tot een beter empatisch begrip van de interacties van de klanten met de Rail Europe raakpunten, zowel in tijd als in ruimte. Het opstellen van een goede experience map is niet eenvoudig – zie - en valt buiten het bestek van deze cursus.

13 DESIGN – MOODBOARD Beeldcollage van concepten, ideeën, dromen en gevoel. Kan gebruikt worden om de stijl van je product te bepalen, maar ook om vage ideeën te visualiseren en te bepalen welke kant je opwil.

14 DESIGN – STYLE GUIDE Een handleiding voor de opmaak van designelementen; kan gebruikt worden voor documenten, websites, drukwerk, of zelfs voor de hele huisstijl.

15 PERSONAS Clive Ondernemer, heeft comfort en standing nodig Dave
Sportman, heeft snelheid en blitz nodig

16 PERSONAS ? ?

17 PERSONAS

18 een oplossing voor iedereen werkt voor niemand
PERSONAS een oplossing voor iedereen werkt voor niemand

19 PERSONAS Personas zijn fictieve profielen die de belangrijkste gebruikersgroepen voorstellen. Typische gegevens: foto typerende quote persoonlijke info (naam, leeftijd, opleiding, werk...) korte beschrijving huidige situatie frustraties en doelstellingen

20 PERSONAS FOTO NAAM QUOTE BESCHRIJVING PERSOONLIJKE INFO DOELSTELLINGEN

21 PERSONAS NAAM BESCHRIJVING PERSOONLIJKE INFO DOELSTELLINGEN FOTO QUOTE

22 PERSONAS FOTO NAAM PERSOONLIJKE INFO BESCHRIJVING QUOTE DOELSTELLINGEN

23 PERSONAS Primary persona: belangrijkste / meest gemiddelde persona
zonder deze persona heeft je toepassing geen bestaansrecht andere personas zijn mits aanpassingen ok met een interface-ontwerp gericht op deze persona ontwerp eerst voor deze persona, en pas dan aan voor de rest

24 PERSONAS Enkele tips: personas moeten gebaseerd zijn op onderzoek van echte gebruikers maak niet teveel personas; een goede vuistregel is ongeveer 20 gebruikersinterviews en 4 personas personas mogen weinig met elkaar gemeen hebben focus op de verschillen tussen personas die er echt toe doen; is bijvoorbeeld leeftijd belangrijk? personas moeten opgesteld zijn als het verhaal van een echt persoon

25 PERSONAS – OPSTELLEN We vertrekken we van een website die de betere papierwaren verkoopt. Stappen om tot personas te komen: Stap 1: verzamel resultaten van de gebruikersinterviews

26 PERSONAS – OPSTELLEN Stap 2: stel lijst op van belangrijke sleutelkarakteristieken die uit de intervieuws tevoorschijn komen Stap 3: zet gebruikers uit op deze karakteristieken

27 PERSONAS – OPSTELLEN Stap 4: vorm groepjes gebruikers met veel overeenkomsten

28 PERSONAS – OPSTELLEN Stap 4: vorm groepjes gebruikers met veel overeenkomsten

29 PERSONAS – OPSTELLEN Stap 5: daarmee heb je je personas gevonden

30 PERSONAS – OPSTELLEN

31 PERSONAS – PUBLICEREN Stap 6: publiceer je personas
Print ze uit en hang ze aan de muur...

32 PERSONAS – PUBLICEREN ... of wees creatiever. Dit is een voorbeeld van Cisco, die er een soort action figure van maken

33 PERSONAS – PUBLICEREN Eentje van Yahoo...

34 PERSONAS – PUBLICEREN Mogelijkheden te over: print ze op speelkaarten kaarsen sleutelhangers ... ok, een tattoo is overdreven, maar vergeet nooit wie je gebruikers zijn!