← Tilbake
Tjønnås – mockup
Dette prosjektet ble gjort tverrfaglig i samarbeid med tre andre studenter fra grafisk design, webutvikling og interaksjonsdesign. Løsningen er basert på innsikt fra rundt 20 intervjuer med både kunder og ansatte hos Tjønnås Delikatesser og Norvald kafé i Gjøvik. I etterkant av prosjektet har jeg iterert videre på designet.

☕️ Tjønnås & Norvald

↓ Test prototypen for mobil ↓

Designprosess og metoder

  • 🗣️ Intervju
  • 🗂️ Affinitymap
  • 👥 Personas
  • 📝 Storyboarding
  • 📄 Low-fidelity prototype
  • 💻 High-fidelity prototype
  • 🎨 Mine iterasjoner
Designprosess illustrasjon

Innsiktsarbeid

Under dette prosjektet brukte vi mye tid på å gjennomføre grundig innsiktsarbeid for å komme frem til problemene. I starten av arbeidet gjennomførte vi et intervju av en Tjønnås kunde. Senere fikk vi også tilgang til 19 andre intervjuer som var gjennomført av andre grupper i klassen. Både kunder og ansatte hos Tjønnås og Norvald ble intervjuet, og vi fikk dermed innsikt i både kunde- og ansattbehov.

Vi startet med å analysere intervjuene og kategorisere funn i et affinity map. Noen av problemene som ble identifisert angikk manglende informasjon, vanskeligheter med å bestille og booke, lite produktsynligheten og interne kommunikasjonsproblemer.

Videre organiserte vi funnene i behov, der vi skilte mellom kundebehov og ansattebehov.

Hovedfunn: Vi fant et tydelig ønske og behov for et bestillingssystem, men også booking.

Affinity Map
Affinity Map

Personas

Vi utarbeidet fire personas basert på affinity kartet og intervjuene, i tillegg til to scenarioer per persona. Gruppen gjorde en dot voting av hvilke scenarioer vi ønsket å utforske videre, og danne en løsning for. Her vant de fiktive personene Katrhine og Jørgen, og scenarioene deres tilsvarte at vi måtte lage en løsning for bestilling og reservasjon. Vi valgte å spesifikt fokusere på bestilling av gavekurver, da det bare foregikk på Instagram.

Tjønnås Persona 1
Tjønnås Persona 2

Wireframing/Storyboarding

Videre begynte vi å skissere ut hvordan vi ønsket at løsningen skulle se ut. Her ble det en del diskusjoner om hva som er best for brukeren, og hvordan vi kunne imøtekomme behovene deres. Vi benyttet metoden crazy 8s for å oppnå flest mulig forslag på kort tid.

  • Skisser på ark
  • Diskusjoner
  • Crazy 8s
Skisse 4 for Tjønnås
Wireframes

Sitemap

Etter storyboardingen lagde vi et sitemap for å komme frem til informasjonsarkitekturen vi ønsket i løsningen. Under prosessen ble det gjort flere iterasjoner på sitemappet, for å komme frem til noe som ville fungere både for mobil og desktop. Tjønnås Delikatesser og Norvald Kafé er separerte enheter, men samtidig er det samme bedrift. Dermed måtte vi også lage noe som fungerte for begge enhetene.

Sitemap for Tjønnås
Sitemap

Low-Fidelity prototyper

Våre low-fidelity prototyper fikk flere endringer underveis.. De aller første prototypene er veldig ulike fra den endelige løsningen. Layouten for hjemskjermen er kanskje det som har endret seg aller mest. Vi droppet blant annet bildekarusell og generelle knapper til andre sider. Den beslutningen førte også med seg en del diskusjon angående navigasjonen. Vi kom frem til at en typisk burgermeny kanksje ikke er den mest brukervennlige løsningen. Dermed valgte vi å lage noen hovednavigasjonsknapper i bunnen av skjermen, men også ha en meny som en del av hovednavigasjonen

Low-fidelity prototype for Tjønnås

High-Fidelity

Vårt endelige design er basert på innsikten vi fikk fra intervjuene, og det har vært en del iterasjoner underveis. Vi valgte å fokusere på gavekurver og helgepakker, siden det var behov for bestillingssystem og produktsynligheten. Denne versjonen av prototypen svarer til disse kundebehovene, som var målgruppen vi valgte å begrense oss til.

I etterkant av dette prosjektet har jeg iterert litt på designet for å forbedre brukeropplevelsen. Jeg har blant annet lagt til litt flere farger og rettet opp i layouten enkelte steder. Fargene i den ferdigstilte prototypene var ikke helt optimale, så jeg byttet dem ut med noen friskere farger. I tillegg til dette endret jeg hjemskjermen slik at åpningstidene og lokasjon er mer synlige. Affinitymappet avslørte nemlig at dette også er viktig for kundene, og at dagens løsning ikke kommuniserer åpningstidene tydelig nok.

  • Funksjoner for produktsynlighet
  • Bestillingssystem
  • Synliggjøre Åpningstider & Lokasjon
  • Iterasjoner på farge
  • Justeringer av layout
High-fidelity prototype for Tjønnås
Min iterasjon
Iterert high-fidelity prototype for Tjønnås
Min versjon

Refleksjon

Det har vært skikkelig lærerikt å gjennomgå et prosjekt med hovedvekt på grundig innsiktsarbeid! Det var også interessant å jobbe tverrfaglig med grafisk design og webutvikling. Her erfarte jeg også at Figma ikke var et kjent verktøy for alle.

Det er nok flere ting ved dette arbeidet jeg ville endret på. Som sagt har jeg allerede iterert litt videre på designet.

Mine viktigste forbedringspunkter:

Det er for mange knapper i navigasjonen, og det gjør at de er veldig små og vanskelige å trykke på. I tillegg til dette så hadde vi nok fått bedre visuell konsistens hvis alle jobbet utifra de samme elementene og fargene. Det hadde også gjort det enklere å iterere videre på designet, og det hadde vært lettere for alle i gruppen å jobbe i Figma. Det er nok flere ting ved denne prototypen jeg ville endret på i etterkant, men kanskje spesielt navigasjonen.

Se prototypen OG PROSESS

Link til prototypen i Figma: Åpne Figma-prototypen

Link til prosess i Figjam: Åpne Figjam (Innsikt)

Skjermbilde av prototype-løsningen
Designforslag
Lær mer om meg