Wireframes viser struktur og indhold uden distraktion. Prototyper gør dem klikbare, så de kan testes på rigtige brugere og bruges som fælles sprog med udviklere. Ydelsen findes, fordi de dyreste fejl i et webprojekt sker tidligt: en forkert struktur, et flow med for mange trin eller en funktion, ingen har brug for, opdages ofte først, når det er bygget.
Vi arbejder hurtigt og billigt i denne fase, fordi det er her, de store fejl undgås. Wireframes tegnes i Figma i gråtoner, så samtalen handler om prioritering og indhold, ikke farver. Prototypen kobles sammen med Figmas prototype-funktion eller Maze, og vi tester med fem brugere pr. runde. Udviklere og SEO-specialist gennemgår strukturen, så URL-struktur og teknisk gennemførlighed er på plads, før vi går videre.
I står med en klikbar prototype af nøgleflows, en dokumenteret brugertest og en liste over, hvad der skal ændres, før det designes færdigt. Prototypen fungerer som specifikation for udvikleren og som beslutningsgrundlag internt: I kan vise ledelsen, hvad der skal bygges, og hvorfor, med resultater fra rigtige brugere i stedet for holdninger.
Vi aftaler, hvilke flows der skal tegnes, og samler det indhold, de skal vise: produkter, priser, tekster, datafelter fra ERP eller PIM. Vi gennemgår eksisterende data om, hvor kunderne tøver i dag.
Hvert flow tegnes skærm for skærm i Figma med rigtigt indhold og noter om formål. Vi gennemgår dem med jer og udvikleren og retter, før de kobles sammen til en prototype.
Skærmene kobles sammen til en klikbar prototype. Fem brugere fra målgruppen løser opgaver i den, mens vi observerer og noterer, hvor de tøver, klikker forkert eller opgiver. Fund prioriteres efter alvor.
Prototypen rettes ud fra testen, og vi leverer den sammen med testrapport og anbefalinger til UI-design eller udvikling. Ved behov kører vi endnu en testrunde på de reviderede skærme.
Wireframes viser prioritering og flow uden farver og billeder, så samtalen handler om det rigtige: hvad skal siden gøre, hvad skal stå øverst, og hvad kan undværes? Vi tegner i gråtoner med rigtige tekster og rigtige produkter, ikke lorem ipsum, fordi indholdet afgør, om strukturen holder. Hver skærm får en note om formål og de data, den skal vise, så udvikler og indholdsansvarlige kan vurdere den samtidig.
Klikbare prototyper i Figma gør det muligt at teste flows med rigtige brugere og få feedback, før én linje kode er skrevet. Vi kobler skærmene sammen med overgange og states, så testdeltagere kan gennemføre en opgave fra kategori til ordrebekræftelse. Prototypen bruges også i interne gennemgange, hvor det er nemmere at få ledelsen til at tage stilling til noget, man kan klikke i, end til et dokument.
Vi arbejder i korte loops: skitse, test, ret. Det er billigere at ændre en prototype ti gange end at bygge om én gang. En typisk opgave har to til tre runder, hvor hver runde afslutter med en prioriteret liste over fund fra testen. Vi stopper, når brugerne gennemfører opgaverne uden at tøve, ikke når vi selv synes, det ser færdigt ud. Alle versioner gemmes i Figma, så beslutningerne kan spores.
Udvikleren ser wireframes, før de bliver til prototype, og siger fra, hvis noget er dyrt eller umuligt i jeres platform. SEO-specialisten vurderer, om struktur og navigation understøtter de søgeord, kategorisiderne skal rangere på. Det sparer omtegning senere og betyder, at det, vi aftaler i prototypen, også er det, der bliver bygget og indekseret.
Sådan ser det ud
0sprints fra skitse til design
Fra grå flader til et udtryk, der kan genkendes. Prototyper testes på rigtige brugere undervejs.
SkitseDesign
Et eksempel fra virkeligheden
En B2B-webshop med ca. 4.000 varer skulle have et nyt bestillingsflow, hvor forhandlere kan genbestille fra ordrehistorik og se egne priser. Salg og IT var uenige om, hvor meget der skulle vises pr. vare. Vi tegnede to versioner som wireframes, gjorde dem klikbare og testede dem på fem forhandlere. Den enkle version, med varenummer, pris og antal i én linje, blev gennemført dobbelt så hurtigt som den detaljerede. Den blev bygget, og efter tre måneder kom ca. 60 procent af genbestillinger gennem flowet i stedet for pr. mail.
Mere inden for Digitalt design
F 
A 
U 
S 
Nyt PrestaShop site og 360 graders digital marketing med SEO og PPC annoncering.
Se alle cases
Et digitalt sats på e-handel, der gav pote. Se vores arbejde for Werenberg, og hvordan vækstkurven blev stejl med en stabil og udviklingsdygtig webshop.
Skræddersyet design og udvikling af møbelshop. Markedsføring gennem PPC med 200% vækst.
All-around design, udvikling, branding, strategi og søgemaskineoptimering
Avanceret Google Tag Manager setup til konverteringstracking
Ofte stillede spørgsmål
Fem pr. runde finder de fleste problemer. Vi kører gerne flere runder.
Ja. Prototypen viser alle trin, states og overgange, og vi leverer et kort notat med forklaring pr. skærm. De fleste udviklere foretrækker det frem for en kravspecifikation i tekst.
Et enkelt flow, fx checkout eller en konfigurator, med prototype og én testrunde koster fra 18.000 kr. Større opgaver med flere flows prissættes efter antal skærme.
Ja. Fra identitet og logo til retningslinjer og skabeloner, og vi sørger for, at det virker digitalt først.
Ja, alt design lever i Figma med komponenter og tokens, som udviklere kan bruge direkte.
Nødvendige cookies får siden til at virke. Statistik og markedsføring sætter vi kun med dit samtykke. Du kan altid ændre valget nederst på siden. Læs cookiepolitikken.
