Grundlæggende UX

tema 3

forside produkter materialer moodboard styletile the four step sketch crazy 8s crazy 8s art museum solution sketch storyboard

←→

Se prototype til pc
Se prototype til mobil

I tema 3, grundlæggende UX, skulle vi designe vores egen webshop, der sælger t-shirts. Fokusset for temaet var brugergrænsefladen og brugeroplevelsen - altså design af UI og UX-elementer til ens webshop.


Jeg valgte at lave en webshop kaldet “Bæredygtige striber”, hvor man kan købe t-shirts, skjorter og bukser lavet af bambus og økologisk bomuld. Mit koncept var, at alt skulle være stribet i lyse farver, og at det skulle være behageligt at have på - man skulle kunne bruge det som hverdagstøj, som hyggetøj og som nattøj, hvis man vil. Hele opgaven blev udarbejdet i Adobe XD, som en high fidelity klikbar prototype. Jeg har lavet et købsflow af en beige t-shirt og et par grønne bukser.


Vi blev introduceret til forskellige research metoder, som vi skulle bruge til at opbygge vores webshop.


Vi blev introduceret til desk research, interview, observation og survey. Ved desk research kom jeg bl.a. frem til, hvilke materialer jeg skulle bruge. Jeg valgte hør, da det er meget bæredygtigt og kræver meget lidt vand og ingen kemiske gødninger eller pesticider. Jeg valgte også en blanding af bambus og økologisk bomuld, da det giver et stærkere materiale, som holder længere.


Ved interview, observation og survey, fandt jeg bl.a. ud af, hvad folk går efter. Jeg fandt ud af, at de fleste går efter noget basic, som kan styles på flere måder og at det skal være god kvalitet og behageligt. Jeg fandt også ud af at 69% helst ville købe en t-shirt i neutrale farver, hvilket resulterede i mit farvevalg på sitet. Folk ville med større sandsynlighed shoppe med rabat, derfor lavede jeg en pop-up rabat på 10%. De fleste (73,9%) ville betale mellem 100-300 for en bæredygtigt produceret t-shirt, og det satte jeg så mine priser efter.


Vi arbejdede med Copy og microcopy til vores prototype, som er det tekst der fremgår på sitet.


Vi arbejdede også med konventioner, som er de standarder der gennem tiden er opstået for placering af navigationselementer og hvordan brugeren forstår dem. Dette brugte jeg bl.a. til at placere knapper og søgefelt. Jeg brugte det også til at style links og til at lave en brødkrummesti, så man kan klikke sig tilbage i sin navigation, hvilket gør brugeroplevelsen lettere.


Vi blev også introduceret til forskellige sketch-faser, hvor vi lavede the-four-step sketch, Crazy 8s, Solutions sketch, storyboard, Artmuseum, Heat map, Speed Critic, Supervote og et storyboard. Se eksempler på dette i billederullen øverst.


Ved Heat Map øvelsen fik jeg mange stemmer på ”rabatkode ved tilmelding af nyhedsbrev” og ”føj til favoritter” funktionen. Ud fra dette valgte jeg at implementere det på mit site.


Efter alt dette forarbejde kunne vi gå i gang med at lave vores prototype. Hertil lavede jeg også et moodboard og et styletile.


Vi blev også introduceret til Adobe Photoshop i dette tema. Det brugte jeg bl.a. til at designe mit tøj til webshoppen i, og jeg tegnede faktisk også de billeder, jeg har brugt under materialer, i Photoshop. I dag ville jeg nok have brugt Illustrator, men det var vi ikke blevet introduceret til endnu.


t-shirt bukser

Til sidst i opgaven blev vi introduceret til forskellige test former. Herunder tænke-højt test og five-act-interview. Disse to forskellige test gav også god og brugbar feedback. Jeg fik andres perspektiver og syn på mit design og fandt ud, at mit design blev opfattet, som jeg havde tænkt. Jeg fik også lavet nogle små rettelser ud fra testene. Jeg fik bl.a. gjort min footer klikbar, jeg fik implementeret “fri fragt opnået” og gjort det lidt tydeligere, at man kan scrolle og læse om materialer på siden med et specifikt produkt.