Maries
Mobile first tilgang
Vores brugerundersøgelser viste, at den primære målgruppe oftest tilgår websitet fra mobilen. Derfor har vi designet løsningen med en mobile first-tilgang, hvor struktur, indhold og funktionalitet først er udviklet til den mindre skærm.
Udgangspunktet har været at prioritere det vigtigste indhold og sikre en enkel og intuitiv brugeroplevelse. Herefter er designet optimeret og tilpasset, så websitet også fungerer naturligt på tablet og desktop.
Præferencetest
For at sikre, at designet ramte kundens forventninger, gennemførte vi tidligt i processen en præferencetest. Formålet var at afstemme retning, før vi brugte tid på at færdiggøre det visuelle udtryk.
Testen blev gennemført på wireframes uden farver, så fokus udelukkende var på layout, struktur og opbygning. På den måde kunne vi få feedback på det grundlæggende designvalg, før vi arbejdede videre med det visuelle lag.
Wireframe
Processen startede med en wireframe, hvor fokus var på struktur, indhold og brugerflow.
Mockup
Herefter blev designet videreudviklet i en mockup, hvor farver, typografi og visuelle elementer blev integreret.
Færdige resultat
Det endelige resultat er en gennemarbejdet løsning, hvor design og funktion hænger sammen.
Farver og tilgængelighed
Maries er en farverig kaffebar, og det var vigtigt for os, at hjemmesiden afspejlede den stemning. Samtidig var det afgørende, at farverne ikke gik ud over læsbarhed og tilgængelighed.
For nogle kan det være svært at skelne mellem bestemte farver, og derfor testede vi vores design med fokus på kontrast og tydelighed. Vi anvendte et plugin i Figma til at vurdere farvekontraster og læsbarhed, og for at sikre, at værktøjet gav et retvisende billede, testede vi også løsningen med en person, der er farveblind.
Det gav os mulighed for at justere designet, så alle elementer fremstår tydelige og nemme at aflæse.
Allergener
For at imødekomme forskellige behov har vi gjort det nemt at afkode eventuelle allergener direkte i menuen. Informationen er præsenteret overskueligt, så brugeren hurtigt kan se, hvad produktet indeholder.
Løsningen er testet på flere brugere for at sikre, at markeringen er tydelig og intuitiv at forstå, og at brugervenligheden fungerer i praksis.
