De Med1Pas is een medisch paspoort en biedt ruimte om al je relevante medische informatie op te slaan die, in geval van nood, belangrijk kunnen zijn. Het medische paspoort komt in een handig USB creditcard formaat en is dus gemakkelijk mee te nemen in de portemonnee. Of je nu op reis gaat of in eigen land veel onderweg bent, een aandoening hebt of bijvoorbeeld een allergie, het is verstandig altijd je medisch paspoort bij je te dragen.


1. Strategie
– Doelen, doelgroep en concurrentie
– Businessgoals en Usergoals
– Do’s en dont’s op de website van de concurrenten
– Stakeholderanalyse
– Persona en Empathymapafbeelding

2. Scope
– Userdoelen, Businessdoelen, Requirements
– Businessdoelen realiseren
– Userdoelen realiseren

3. Structuur
– UX-validatie en Information Architecture
– Product Backlog creëren
– Content requirements
– Userstorymap
– MVP
– Onderzoeksresultaten
– Informatiestructuur
– Navigatiemenu orderingsprincipe

4. Skeleton
– Navigatie- en interactiedesign
– Skelet van de site
– Samenstelling van iedere stap

5. Surface
– Sensorydesign
– Conclusie

Strategie

Doelen, doelgroep en concurrentie
Patiënt1 is het grootste landelijke Persoonlijke GezondheidsDossier (PGD). Als online platform werkt Patiënt1 samen met huisartsenverenigingen, medisch specialisten, ziekenhuizen, patiëntenverenigingen, mantel- zorginstellingen, maatschappelijke instellingen en enkele maatschappelijke verantwoorde commerciële partijen. Het bedrijf heeft de doelstelling om mensen met ziektes of chronische aandoeningen te helpen de kwaliteit van leven te verbeteren en geluk en welzijn te realiseren. Wanneer een gebruiker zijn gezondheidsgegevens bij zich wil dragen, onderweg of in geval van nood, dan is het heel eenvoudig mogelijk om de informatie uit de PGD op het Europees Medisch Paspoort of Med1pas te plaatsen. Dit is een pas die een USB-stick bevat. Op deze stick kan het complete medische dossier van de gebruiker (zijn PGD) worden gezet door die informatie te uploaden van de site. Dankzij het handige creditcardformaat is de pas makkelijk mee te nemen, bijvoorbeeld in de portemonnee of handtas. De gegevens worden automatisch in zes verschillende talen vertaald en op het paspoort gezet. Ondanks de naam ‘Europees Medisch Paspoort’ is de pas in de praktijk wereldwijd te gebruiken.

Businessgoals
– Universele producten ontwikkelen
– Bedrijfsreputatie stabiliseren
– Naamsbekendheid vergroten
– Het begrip voor de markt vergroten
– Resellers en leveranciers betrekken
– Ontwikkelingen vergroten
– Leads genereren
– Klanten bijtrekken en behouden
– Klantenservice verbeteren
– Bestelproces minimaliseren

Usergoals
– Makkelijke gebruikerservaringen
– Duidelijke taal
– Mogelijkheid voor informatieve feedback
– Consistentie in gebruikersinterface
– Gebruiksvriendelijkheid
– Betrouwbaarheid


Do’s en dont’s op de website van de concurrenten
Met behulp van drie vragen kunnen we de concurrentenwebsites analyseren:
1- Wat is de eerste indruk?
2- Waardoor komt dat?
3- Wat kunnen we daaruit concluderen?
Bij deze concurrentie-analyse wordt vervolgens rekening gehouden met: inhoud van de homepagina, opstelling van de navigatie, interactie op de site, het design, de leesbaarheid, de technische kwaliteiten, de vindbaarheid van termen binnen de website, de vindbaarheid van de site in de zoekmachines en het totale plaatje en tot slot het gevoel.

Er zijn twee websites bestudeerd van de concurrenten:

www.ohra.nl

Do’s
– Overzichtelijke indeling
– Leesbare tekst
– Mogelijkheid om vragen te stellen via social media en Whatsapp
– Handige overzichtelijke serviceblokken
– Suggesties mogelijkheid
– Responsive design

Dont’s
– Geen productfoto
– Lange laadtijd van de homepage
– Verstopte informatie
– Productdetails ontbreken

www.sdu.nl

Do’s
– Voordelen goed zichtbaar op de homepagina
– Product goed vindbaar via zoekveld
– Duidelijk ingedeelde navigatie
– Duidelijke omschrijving van het product
– Beknopte productdetails aanwezig
– Geen verplichte registratie op de site

Dont’s
– Klein lettertype op de site
– Betaalmogelijkheden niet vermeld in het winkelwagentje
– Niet geschikt voor mobiel
– Menu-items verstopt in het navigatie menu


Stakeholders
– Iedereen die gezondheid belangrijk vindt

- Zorgverleners

– Leveranciers

– Zakelijke klanten
– Medewerkers

– Aandeelhouders

– Lokale gemeenschappen
– Overheid

- Media

– Particulieren

– Patiënten

- Ontwikkelaars

- Onderzoekers

- Reizigers

Stakeholderanalyse
Stakeholders zijn personen en organisaties die direct of indirect beïnvloed worden door de activiteiten van de onderneming dan wel een directe of indirecte invloed hebben op de onderneming. Succes voor het bedrijf is: winst, geld besparen & promotie. Succes voor de eindgebruiker is: functionaliteit, efficiëntie & wenselijkheid. Met behulp van vragen kunnen we de stakeholder definiëren. Tegenover wie heeft Patiënt1 wettelijke verplichtingen? Wie wordt beïnvloed door de beslissingen van Patiënt1? Wie is dagelijks in contact met de Patiënt1 applicatie? Wie kan helpen om de maatschappelijke impact van Patiënt1 beïnvloeden? Wie doe de monitoring van ingediende klach- ten bij Patiënt1? Wie beoordeelt of volgt Patient1? Op de afbeelding (Stakeholderanalyse) worden de stakeholders ingedeeld in drie groepen, en nader ingedeeld naar type van invloed.


Persona en empathymapafbeelding
Een onderzoek naar de klanten kost veel tijd en geld. Om snel een beeld te krijgen van de gebruikers van Patient1 website, kunnen we andere middelen gebruiken. Uit de Google Analytics statistieken blijkt dat mensen tussen 60 en 70 jaar relatief makkelijker een Med1Pas kopen. Dit is niet voldoende voor een compleet marktonderzoek, maar we kunnen alle eigenschappen en verwachtingen van deze doelgroep in een persona verwerken. Voor persona is een vrouw van 68 jaar uitgekozen. Ook op basis van deze persona is een Empathymapafbeelding aangemaakt.




Scope

Userdoelen, Businessdoelen, Requirements

Businessgoals en Usergoals
Een scope is een beschrijving van wat er moet gebeuren. Om het mislukken van het project te voorkomen, verdient het de voorkeur vooraf vast te stellen wat is inbegrepen en wat niet is inbegrepen. Nadat de scope is bepaald, kan de benodigde tijd plannen en een kostenraming van het project maken. Wanneer dit dit gaat gebeuren, moet ervoor waken binnen de grenzen van het project te blijven zowel qua tijd als middelen. Alleen wat relevant is binnen de scope zou ermee moeten werken.
Hiervoor worden UX-strategieën gebruikt: van Top-down of van Bottom-up. Afhankelijk van het project wordt bepaald of het een Top-down (een nieuw project) of een Bottom-up (uitbreiden van een bestaand project). Met behulp van de top-downstrategie begint de verandering met een beheeropdracht. Zij zijn de officiële initiatiefnemers en beslissers. In een bottom-upstrategie worden eerst de gevoelens, meningen en wensen van het team in overweging genomen alvorens een actieplan op te stellen. Er zijn situaties waarin met gecombineerde strategieën nog betere resultaten worden behaald, zoals korte termijn projecten waarin een duidelijke en strakke deadline is gesteld. Een aanpak van onderaf is een buitengewoon effectieve manier om geleidelijk nieuwe ideeën te ontwikkelen en te introduceren. In dit geval is het niet nodig om te werken aan het ontwerp zonder stakeholders en bestuur erbij te betrekken. Er zal weinig werk aan de designkant zijn, maar er zullen meer correcties moeten worden gedaan. Voordat de vereisten kunnen worden geïntroduceerd moeten de requirements van het project heel duidelijk zijn.
Wat zal Patient1 bereiken met de nieuwe aanpassingen? Op basis hiervan kunnen de requirements worden bepaald. Elk extra deel moet de verantwoordelijkheid nemen voor het opstellen van goede requirements, voor het bereiken van het uiteindelijke doel en het behalen van een goed resul- taat. Er moet altijd een afbeelding zijn van waarheen het proces zou moeten gaan. Als het vereistenproces goed is georganiseerd kan Patiënt1 geld en tijd besparen.
Kennis over gebruikers wordt vaak gebruikt als een voorwaarde voor het identificeren van requirements, maar deze kennis wordt niet systematisch geïntegreerd in het proces. Persona’s bieden een hulpmiddel voor het adequaat documenteren van de attributen van gebruikers en ondersteunen het ontwikkelteam gedurende het gehele ontwikke- lingsproces. Om verder te kunnen gaan moet op basis van de persona eerst gedefinieerd worden wat de user wil. Dit kunnen wensen zijn zoals: digitale medische gegevens altijd bij de hand hebben, gegevens aanpassen op mobile telefoon, exporteren via mobile devices, verzekering papieren kunnen uploaden, vaccinaties toevoegen, betalingsbe- vestiging krijgen via de e-mail, nieuwe medicatie toevoegen via telefoon, video bekijken.

Businessdoelen realiseren
Succes van Patiënt1 is gebaseerd op zowel doelen en doelstellingen, omdat die het bedrijf helpen bij het identificeren van noodzakelijke acties. Doelstellingen zijn algemene verklaringen van gewenste prestaties, terwijl doelen de specifieke stappen of acties zijn die worden genomen om het doel te bereiken. Zowel de doelen als de doelstellingen moeten specifiek en meetbaar zijn. Doelen kunnen betrekking hebben op gebieden zoals winstgevendheid, groei en klantenservice, met een reeks doelstellingen die kunnen worden gebruikt om die doelen te bereiken.

– Meer projecten uitvoeren die winstgevend zijn
– Omzet verhogen
– Uitgaven verlagen
– Elke maand 5% meer leads genereren
– Een mooie locatie huren met een lagere huur
– Klanten sneller en effectiever helpen via de helpdesk
– Klachten verminderen met 50%
– Klachten behandelen binnen 48 uur
– Helpdeskprocedure op papier vast leggen
– Klanten met spoedgeval dienen teruggebeld te worden vóór het einde van dezelfde werkdag
– Elke zaak goed documenteren voor de leerdoeleinden
– Een trainingscursus ontwikkelen voor de nieuwe medewerkers
– Alle Med1Passen moeten uiterlijk om 16.00 uur klaarstaan voor verzending

Userdoelen realiseren
a. Makkelijke gebruikservaring – intuïtief en makkelijk door de stappen heen gaan, aantal stappen naar het doel verminderen. Als het doel ingewikkeld is, dan moet het hele pad in fases worden verdeeld, zodat de gebruiker weet wáár die zich bevindt. Fases kunnen aangegeven worden met een tijdlijnbalk boven de content.

b. Duidelijke taal – De hele content gaat in je-vorm geschreven worden op taalniveau B1, zodat iedereen de content goed kan begrijpen.

c. Mogelijkheid voor informatieve feedback – Directe feedback is altijd waardevol voor een bedrijf, zo is meteen zichtbaar waar de gebruiker vastloopt op enig moment. Daarom is het belangrijk om deze optie zichtbaar en makke- lijk toegangbaar te maken in de vorm van webform met zo minimaal mogelijk velden en dus alleen relevante informatie.

d. Consistentie in gebruikersinterface – elke informatieve pagina heeft een hoofdafbeelding en meer gedetailleerde afbeeldingen wanneer er meer uitleg nodig is. Actieknoppen krijgen een kleur groen en worden centraal gepositioneerd. Annuleerknoppen worden als een blauwe link weergegeven (geen buttonvorm).

e. Gebruiksvriendelijkheid – duidelijk onderscheid maken tussen de pc-weergave en mobile device. Op de telefoon wordt tekst groter weergegeven en buttons worden op de hele breedte gezet voor meer click oppervlakte voor mensen met dikke vingers.

f. Betrouwbaarheid – zichtbaar maken op welke platform de Patiënt1-applicatie draait en welke beveiligingscertificaten daarvoor worden gebruikt; elk certificaat krijgt een korte uitleg.


Structuur

UX-validatie en Information Architecture

Product Backlog creëren
Op basis van feedbacks, reviews, telefonische klachten en de bespreking met het Scrum-team, is een productachter- standslijst opgesteld. Kort gezegd is een Product Backlog een lijst van alle dingen die binnen het project moeten worden gedaan. Alle punten worden beoordeeld met prioriteit van zeer hoog tot zeer laag. Er wordt voor elk werkitem ook een inschatting gemaakt van de moeite die het kost om de achterstand op te lossen. Deze items kunnen van technische aard zijn of gebruikersgericht zijn, bijvoorbeeld in de vorm van gebruikersverhalen.


Content requirements
Pagina’s mogen geen commerciële sponsoring of advertenties bevatten.
Alle pagina’s en bestanden moeten actueel en nauwkeurig zijn.
Alle pagina’s moeten een link bevatten naar de startpagina.
Een disclaimer over de inhoud van de website. Overmatig grote afbeeldingen 1000px breed maken.
Auteursrechtelijk beschermd materiaal in welke vorm dan ook (inclusief afbeeldingen).
Blanco pagina’s of pagina’s ‘in aanbouw’ of ‘binnenkort beschikbaar’ onzichtbaar maken.

Userstorymap
Bij userstorymapping wordt de Product Backlog gestructureerd op basis van de belangrijkste verzamelde punten of processtappen. De elementen vormen de rode draad van het product. De rodedraad geeft een compleet overzicht van de scope van het product. Het overzicht vertelt welke mogelijkheden een gebruiker heeft bij het gebruiken van PGD. Het zijn de noodzakelijke en wezenlijke stappen die nodig zijn om tot een zinvol product te komen. Vervolgens kan nog verder gestructureerd worden om het inzicht verder te verbeteren. In de User Storymap zijn meerdere processen opgenomen, maar voor deze project zal verder gewerkt worden met het bestelproces.

MVP
Minimum viable product (MVP) is een vroege versie van een product, het minimaal werkbare product, waarmee het mogelijk is om gebruikers het product alvast in de praktijk te laten testen. Dit is de meest minimale versie en daarmee de snelst te creëren versie van een app of product. Het is een product in zijn primaire vorm, dat vervolgens met elke sprint naar een perfecter product ontwikkeld wordt. Het biedt manieren om gebruikspatronen en directe feedback van echte gebruikers te verzamelen, waardoor op basis van deze informatie beslissingen genomen kunnen worden met betrekking tot verdere productontwikkeling.

Onderzoeksresultaten
Met behulp van wireframes kan in een vroeg stadium de usability getest worden met paper protypes of digitale prototype. Meestal worden er diverse varianten van een scherm getest bij verschillende testers en tijdens het testen direct aanpassingen gedaan. Voor de paperprototypingtest waren er vijf personen van verschillende leeftijd en sociale categorieën op locatie uitgenodigd: twee vrouwen en drie mannen. Het doel van dit onderzoek was om het bestelproces van Med1Pas op de website van Patiënt1 te laten testen. De deelnemers kregen voor de test duidelijke instructies over het doel van het onderzoek om bruikbaarheids- problemen te identificeren. Bij dit onderzoek waren twee medewerkers van Patiënt1 aanwezig om de handelingen te observeren en noteren voor latere beoordeling. Het was belangrijk dat tijdens de test de gebruikers geen onderling contact hadden. Na afloop van het onderzoek bleek dat er een paar functionele obstakels waren: geen zoekoptie en geen mogelijkheid om de bezorgdatum te kiezen. Verder werden er bij usability de volgende obstakels gemeld: inputvelden waren te klein, actiebuttons konden iets groter zijn, en de mogelijkheid ontbrak om feedback te plaatsen.


Structuur

Informatiearchitectuur

Informatiearchitectuur is een waardevol aspect van het gebruikerservaringproces, die mensen helpt om hun omgeving te begrijpen en te vinden waarnaar ze op zoek zijn. Kort gezegd behelst de informatiearchitectuur het creëren van een structuur voor een website, applicatie of ander project, die ons helpt te begrijpen waar we als gebruikers zijn en de nodige informatie kunnen vinden. Informatiearchitectuur is méér maken van plattegronden, hiërarchieën, categorisaties, navigatie en metadata. Wanneer een ontwerper een menu op het hoogste niveau schetst om gebrui- kers te helpen begrijpen waar ze zich op een site bevinden, creëert hij informatiearchitectuur. Om een informatie- structuur beter te kunnen structureren en opstellen, worden enkele vragen gesteld. Hoe is nu de gebruikers beweging op Petient1 website? Hoe helpt de applicatie de gebruiker zijn informatie te categoriseren? Hoe wordt die informatie teruggegeven aan de gebruiker? Is die informatie nuttig voor de klant en voldoende voor het nemen van de gewenste beslissingen? Om deze vragen te beantwoorden, moet de informatiearchitect zich concentreren op een aantal dingen: de doelgroep, de technologieën gerelateerd aan de website en de gegevens die via de website worden gepresenteerd.



Orderingsprincipe navigatiemenu

Voor de Patiënt1-website was gekozen voor een horizontaal menu, met minimaal één niveau: bij Home, Wat is mijn PGD, Behandelplan en Contact. Bij Encyclopedie het uit naar meerdere niveaus, omdat het orderingsprincipe daarvan alfabetisch is. Dat houdt in dat alle artikelen in de Encyclopedie zijn gegroepeerd op basis van de eerste letter in de titel. Als er bij sommige letters geen artikelen zijn, zijn deze menu-items niet zichtbaar in het menu om lege pagina’s en verwarring te voorkomen bij de gebruiker. Bij de submenu-itemsgroep Hoe werkt het waren alle items gegroepeerd op de basis van een functioneel of taakge- richt orderingsprincipe. Alle items die eronder hangen, leggen uit wat en hoe de gebruiker bepaalde taken moet verrichten om hun eigen PGD goed in te vullen met de juiste informatie, zodat het medische dossier zo compleet mogelijk wordt. De submenu-itemsgroep ‘Med1Pas”, op sequentieel orderingsprincipe gegroepeerd, bevat liniaire duidelijke stappen. Dit is een winkelwagentjemodule op de Patiënt1-website. Dit orderingsprincipe wordt bijvoorbeeld gebruikt bij kopen van een product of het boeken van een reis.

De Patiënt1-website heeft twee gedeeltes: voor gewone bezoekers en voor geregistreerde bezoekers. Na de registratie komen de gebruikers in de applicatie-afdeling, waarna de gebruiker gratis gebruik kan maken van het Persoonlijk GezondheidsDossier. Patiënt1 vindt het belangrijk dat iedere gebruiker zijn gezondheidsinformatie verzamelt, beheert en deelt. Daarom is het PGD gratis en blijft het gratis. Patiënt1 voldoet aan alle beveiligingseisen die gesteld zijn voor vertrouwelijk behandelen van medische gegevens. Na het inloggen komt de gebruiker in de applicatie terecht. Hier opent zich een andere menu voor verdere acties. De bezoekers van het PGD worden verdeeld in twee groepen: gebruikers en patiënten die aan hun account een behandelplan hebben gekoppeld. De laatsten krijgen dus een uitgebreider menu te zien. De applicatie is in zes categorieën verdeeld: Medische gegevens, Medicatie, Metingen, Behandelplannen, Medisch Paspoort exporteren en Help me op weg.

Medische gegevens – Gebruiker vult zijn medisch dossier met onder meer aandoeningen, allergieën en operaties.
Medicatie – Gebruiker vult zijn medicatielijst in en maakt die compleet. Belangrijk is het om ook zijn geschiedenis bij te houden, zodat een zorgverlener een totaalbeeld kan krijgen van het medicatiegebruik.
Metingen – Gebruiker houdt diverse metingen bij, waaronder gewicht, bloeddruk, temperatuur en cholesterol.
Behandelplannen – Gebruiker volgt een persoonsgerichte behandeling van de eigen zorgverlener. Een behandelplan wordt altijd gestart door de zorgverlener, die werkt vanuit de Patiënt1Pro-omgeving (www.patient1pro.nl). Dit platform is gekoppeld aan Patiënt1 en is speciaal voor de zorgverlener ontwikkeld.
Medisch Paspoort exporteren – Gebruiker exporteert medische gegevens naar de Med1Pas.
Help mij op weg – Voor starters die meer willen weten of vragen en opmerkingen hebben, zijn veel gestelde vragen verzameld in de vorm van een accordeon om het overzicht te behouden.


Navigatie- en interactiedesign

Uit de notities van de Klantenservice blijkt dat de meeste mensen die hun doel niet bereiken, uit frustratie op verschillende knoppen en links klikken of terugkeren van hun actie en dan iets anders proberen Dit is een duidelijk teken dat de Patiënt1-website UX-problemen heeft. Hier kunnen we gebruikmaken van skeleton-schermen om de perceptie van inactiviteit te verlichten. Zo behoud je het verkeer op de site en mogelijk zelfs het bouncepercentage. Het draait immers om de behoeften van de gebruiker. Een website met een goed UX Design spreekt de gebruiker meer aan, waardoor zij een positievere ervaring met Patiënt1 zullen hebben. De kans is groter dat de gebruikers vaker terugkomen, omdat de site prettig werkt.


Skelet van de site
Onder het skelet van de site wordt verstaan de plaatsing van knoppen, tabbladen, foto’s en tekstblokken. Het skelet is ontworpen om de opstelling van deze elementen te optimaliseren voor maximaal effect en efficiëntie – zodat het prototype eerder in gebruik genomen kan worden en daarmee foutjes eerder ontdekt kunnen worden.
Het skeleton bestaat uit drie componenten:
- Informatie ontwerp: Informatie plaatsen zodat de gebruiker makkelijker de hele interactie op de website begrijpt. – Interface ontwerp: Positionering van elementen zodat de gebruiker intuïtief alles kan vinden wat hij zoekt.
- Navigatie ontwerp: de set schermelementen waarmee de gebruiker via de informatiearchitectuur kan bewegen.


Samenstelling van elke stap
Het hele bestelproces is vanaf de productpagina verdeeld in zes gemakkelijke en overzichtelijke stappen, zodat de gebruiker gemakkelijk en intuïtief door het hele bestelproces heen kan gaan. Hieronder worden deze stappen nader uitgelegd:

Stap 1. Productpagina – houdt in: een logo, zoekoptie, winkelwagentje-icoontje, hamburgermenu, productnaam, productvideo, meerdere productfoto’s, tekstuele beschrijving van de product, specificatiebeschrijving, gebruikers reviews, mogelijkheid om een vraag te stellen, ‘Bestel direct’-knop.
Stap 2. Winkelwagentje – houdt in: een logo, zoekoptie, hamburgermenu, titel van de stap waarin de gebruiker zich bevindt, productfoto van het gekozen artikel, korte tekstuele beschrijving van het product, mogelijkheid om aantal producten te kiezen, veld met mogelijkheid om de kortingscode te gebruiken, korte beschrijving van betalingsmogelijkheden, totale prijs, ‘Bestel’- knop.
Stap 3. Gegevens invullen – houdt in: een logo, zoekoptie, hamburgermenu, titel van de stap waarin de gebruiker zich bevindt, webform met de volgende invoervelden: e-mailadres, naam, adres en huisnummer, postcode en woonplaats, ‘Verder’-knop.

Stap 4. Gegevens controleren – houdt in: een logo, zoekoptie, hamburgermenu, titel van de stap waarin de gebruiker zich bevindt, productfoto van het gekozen artikel, korte beschrijving van het artikel, aantal, ingevulde gegevens, zoals: e-mailadres, naam, adres en huisnummer, postcode en woonplaats, mogelijkheid om een stap terug te gaan en gegevens te corrigeren, ‘Naar betaalomgeving’-knop.
Stap 5. Betaling – betaalomgeving, houdt in: logo van de betaalmodule, drop-down menu om eigen bank uit de lijst de kiezen, totaalbedrag, korte beschrijving van de betaalmodule, ‘Betalen’-knop.

Stap 6. Bedankpagina – houdt in: een logo, zoekoptie, hamburgermenu, titel van de stap waarin de gebruiker zich bevindt, productfoto van het gekozen artikel, korte bedanktekst, mogelijkheid om contact op te nemen met de Klantenservice, een ‘Like ons’-knop op sociale media.








Surface

Sensorydesign

De bedoeling van een moodboard is om een idee, gevoel of een concept te visualiseren. Het is een tool om beeld ‘tastbaar’ te maken met behulp van een verzameling van bepaalde afbeeldingen, kleuren en teksten; zo worden de sfeer en richting gecreëerd om het doel te bereiken. Er worden daartoe kleine bijpassende details verzameld in een collage van afbeeldingen en teksten. Met een moodboard kan men dus beter het doel visualiseren, en het helpt bij de bepaling van de designrichting. Hieronder is een opgesteld moodboard voor Patiënt1. Er wordt daarbij rekening gehouden met combinatie van bestaande kleuren en enkele nieuwe kleuren toegevoegd. Om tijd te besparen, was er gekozen voor bestaande foto’s van de laatste fotoshoot van Med1Pas, waarbij het accent is gelegd op het product. Voor de tekst waren alle variaties van Myrad Pro font gekozen. Dit font heeft voldoende variaties van light naar black om te kunnen kiezen.







Conclusie

Eerst was een responsive design ontworpen op basis van het huidige desktop design, met veel paars, lila en grijstinten. Het werkprototype is gemaakt met behulp van Marvelapp. Dit prototype was voorgelegd aan de zeven testers van verschillende leeftijden en sociale niveaus. Na afloop van de test gaf meer dan 70% van de testers aan dat het bestelproces saai en niet uitdagend genoeg is. Waarschijnlijk komt dit door de monotone kleuren en te veel tekst.

Naar aanleiding van deze feedback was voor een nieuw design gekozen waarin was rekening gehouden met de korte teksten, bulletpoints in teksten, duidelijke koppen en ruime regelafstand in de tekst. Daarnaast is veel aandacht besteed aan opvallende kleuren bij belangrijke onderdelen, voldoende ruimte voor foto’s en andere details.