UX Diploma Inleiding

Inhoud

Fase 1: Onderzoek Fase 2: Analyse Fase 3: Ontwerp Fase 4: Prototypering Leerervaringen

Dit project bestaat uit werk dat ik heb gedaan voor UX Dilopma aan de Galsgow Caledonian University, geleid door het UX Design Institute. Het werd over een periode van zes maanden uitgevoerd en omvatte tools zoals: Figma Illustrator, Indesign, Screenflow, Reflector.

De opdracht:

Doe onderzoek naar huidige websites voor het boeken van vluchten en gebruik de verzamelde inzichten om een gebruiksvriendelijke applicatie voor het boeken van vluchten te ontwerpen.

Fase 1: Onderzoek

Gebruikstests

Om het project te starten, startte ik met bruikbaarheidstesten om diepgaande kwalitatieve inzichten te verkrijgen in de bruikbaarheid van bestaande apps voor het boeken van vluchten. De eerste fase bestond uit het definiëren van mijn doelstellingen en het bepalen van de specifieke resultaten die ik met de bruikbaarheidstests wilde bereiken. Ik ontwikkelde een wervingsscreener, een toestemmingsformulier en een script voor mobiele bruikbaarheidstestsessies. Bij het opstellen van de scripts werd er zorgvuldig op gelet dat er geen suggestieve vragen werden gesteld die tot onproductieve resultaten zouden kunnen leiden. Na deze voorbereidende fase voerde ik mobiele bruikbaarheidstests uit op Hopper en Easyjet.

Doelstellingen

1. Analyseer het algemene gebruikersgedrag binnen de applicaties Hopper en Easyjet.
2. De belangrijkste doelstellingen van de gebruikers vaststellen.
3. Bepaal de functies die voldoen aan de verwachtingen van de gebruikers.
4. Identificeer de functies die niet voldoen aan de verwachtingen van de gebruikers.
5. Elementen herkennen die wrijving veroorzaken in de gebruikerservaring.
6. De soorten problemen begrijpen die gebruikers waarschijnlijk van de website wegjagen.
7. Onderzoeken op welke punten in het gebruikerstraject gebruikers zich gesterkt of gefrustreerd voelen en wat de omstandigheden zijn.
8. De cruciale stukjes informatie identificeren die belangrijk zijn voor de gebruiker.

#89B999
#9DCCD6
#DC7662
#EFC84A
#89B999
#F9AACC
#FFFFFF
#000000
PRIMAIRE KLEUR
SECUNDAIRE KLEUR
PRIMAIRE KLEUR
Typography
LOGO TYPEFACE : OHNO BLAZE
PRIMARY TYPEFACE : GRAFIK FONT FAMILY

Primary
Typeface

ABC

Graphic Font Family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890

The fox jumps over the
lazy brown dog

The fox jumps over the
lazy brown dog

The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog

Secondary
Typeface

Abc

Elephant font family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890
Typography
LOGO TYPEFACE : OHNO BLAZE
PRIMARY TYPEFACE : GRAFIK FONT FAMILY

Primary
Typeface

ABC

Graphic Font Family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890

The fox jumps over the
lazy brown dog

The fox jumps over the
lazy brown dog

The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog

Secondary
Typeface

Abc

Elephant font family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890
Typography
LOGO TYPEFACE : OHNO BLAZE
PRIMARY TYPEFACE : GRAFIK FONT FAMILY

Primary
Typeface

ABC

Graphic Font Family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890

The fox jumps over the
lazy brown dog

The fox jumps over the
lazy brown dog

The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog
The fox jumps over the lazy brown dog

Secondary
Typeface

Abc

Elephant font family
Aa Bb Cc Dd Ee Ff Gg Hh Ll Mm Nn Oo
Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz
1234567890
No items found.
No items found.

Fase 2: Analyse

Affiniteitsdiagram

Vervolgens begonnen we met het interpreteren van de verzamelde gegevens. In eerste instantie hebben een collega en ik de opnames van de bruikbaarheidstest grondig bekeken en gedetailleerde aantekeningen gemaakt. Vervolgens schreven we elk punt uit op post-it notities. Daarnaast bestudeerden we zorgvuldig de uitkomsten van de diepte-interviews, het benchmarking-document voor concurrenten en de enquêteresultaten en maakten we nog meer sets post-it notities. Deze notities werden vervolgens op een foamboard geplakt en we organiseerden ze in verschillende categorieën, wat resulteerde in de ontwikkeling van een duidelijk en gestructureerd affiniteitsdiagram.

Customer Jouney map

Met behulp van de inzichten uit het affiniteitsdiagram structureerde ik de informatie in een stapsgewijze visualisatie van de reis van de gebruiker, waarbij ik de emoties van de gebruiker in elke fase illustreerde. Daarnaast documenteerde ik hun doelstellingen, gedrag, context en pijnpunten voor elke stap.

Belangrijkste bevindingen

Intuïtieve navigatie:
• Zorg voor een eenvoudige en duidelijke navigatie voor een probleemloos boekingsproces.

Flexibele datumopties:
• Zorg voor een interactieve kalender om gebruikers te helpen flexibele reisdata te kiezen.

Transparante prijzen:
• Toon een duidelijke tariefsverdeling, inclusief belastingen en toeslagen.

Mobiele optimalisatie:
Optimaliseer het platform voor soepel mobiel boeken.

Real-time updates:
• Toon live prijsupdates op basis van gebruikersvoorkeuren.

Efficiënte foutafhandeling:
• Geef duidelijke foutmeldingen en begeleid gebruikers om fouten te herstellen.

Visum assistentie:
• Begeleiding bieden bij visa en vereiste documentatie.

Persoonlijke suggesties:
• Pas vluchtaanbevelingen aan op basis van gebruikersvoorkeuren.

Ondersteuning in meerdere talen:
• Zorg voor een gevarieerd gebruikersbestand met meerdere taalopties.

Veilige betalingen:
• Zorg voor een veilig en gevarieerd betalingsproces voor het vertrouwen van de gebruiker.

Toegankelijke klantenondersteuning:
• Bied toegankelijke helpopties en een responsieve klantenservice.


Efficiënt boekingsproces:
• Zorg voor intuïtieve navigatie en een mobiel-vriendelijk platform.
• Toon realtime prijsupdates en een transparante tariefspecificatie.

Gebruikersvoorkeuren:
• Besef dat gebruikers vaak de add-ons sectie overslaan.
• Bied een optie voor afrekenen met een gast, waarbij gemak voorrang krijgt boven het aanmaken van een account.

Persoonlijke assistentie:
• Geef gepersonaliseerde aanbevelingen op basis van gebruikersvoorkeuren.

• Het implementeren van deze verbeteringen zal het boekingsproces stroomlijnen en de gebruikerstevredenheid verhogen.

Fase 3: Design

Mobile Flow Chart

Met behulp van de inzichten uit mijn onderzoek heb ik een mobiel stroomschema gemaakt om de geïdentificeerde problemen effectief aan te pakken. Gezien de verschillende manieren waarop gebruikers omgaan met sites voor het boeken van vluchten, koos ik ervoor om mijn focus te beperken tot een primaire lineaire use case. Deze beslissing werd deels beïnvloed door de observatie dat alle vier de usability test kandidaten de "add-ons" en "create account" secties oversloegen. Bovendien volgen vluchten meestal een overwegend lineair traject, waarbij elke volgende stap afhankelijk is van de vorige.

Ontwerp mobiel interactie

De volgende fase bestond uit het bepalen van de functionaliteit van elk pagina-element bij interactie met de gebruiker. Ik streefde ernaar om het invulgemak van formulieren op elke pagina te optimaliseren, door ervoor te zorgen dat elk invoerveld het juiste toetsenbord weergeeft.

Fase 4: Prototype & Wireframe

Ontwerp mobiel interactie

De volgende fase bestond uit het bepalen van de functionaliteit van elk pagina-element bij interactie met de gebruiker. Ik streefde ernaar om het invulgemak van formulieren op elke pagina te optimaliseren, door ervoor te zorgen dat elk invoerveld het juiste toetsenbord weergeeft.

Wireframes

Na de afronding van de onderzoeksanalyse, het ontwerp en de prototypingstaken bestond de volgende stap uit het samenstellen van documentatie voor overdracht aan het ontwikkelingsteam. Idealiter zouden alle aspecten op dit moment grondig moeten zijn behandeld, zodat het ontwikkelingsteam geen aannames hoeft te doen of ontbrekende informatie hoeft aan te vullen.

Klaar om een project te starten?