Wireframes, eller wireframing, kan være en stor hjælp, når man skal udtænke layout til en hjemmeside, app eller lignende. Lad os derfor dykke ned i, hvad wireframing går ud på og hvorfor det giver mening i udviklingsprocessen.
Wireframes er en mockup metode, som gør det muligt at skitsere selve skelettet til en hjemmeside eller lign. Helt konkret kan man sige, at det er en slags grundopskrift med de væsentligste ingredienser til den enkelte digitale løsning.
Jeg vil gerne vide mere om visuelle mockups!
Wireframes bruges i designprocessen til at vise det “nøgne skelet” af det digitale produkt. Det betyder med andre ord, at man tegner siderne i sort/hvid. Der er ikke fokus på detaljen, men grundstrukturen. Derfor vil man heller ikke kunne se, hvilken tekst og hvilke billeder, som skal indgå - blot hvilket indhold, der er brug for og placeringen på siden.
Man tager typisk wireframes i brug, når man kommer til designfasen i udviklingsprocessen. Når man laver wireframes, skal man tage stilling til, og efterkomme, to ting 1) virksomhedens overordnede mål og 2) de behov, krav og ønsker slutbrugeren kunne have til det endelige produkt.
Læs mere om brugervenlighed og brugerrettet design her
Wireframes viser bl.a. altså:
Wireframing er en god måde at skitsere de grundlæggende tanker og ideer. Det er et godt værktøj til at skabe den overordnede forståelse, der skal til før man bruger tid på at lave en visuel mockup med flere detaljer.
Fordelen ved at lave og vise en "grov skitse" er, at kunden har fokus på de overordnede elementer og strukturen, frem for små detaljer, som senere kan justeres i det endelige produkt. Gør det så simpelt som muligt, så kunden tager stilling til det vigtigste, nemlig strukturen. Jo mere ind til benet, jo færre forståelsesmæssige barrierer.
Wireframes kan, sammen med en visuel mockup, også danne grundlag for de kravsspec, som udviklerne tager udgangspunkt i. De indeholder nemlig en udspecificering af krav og ønsker til hjemmesidens funktionalitet, integrationer til andre systemer og platforme, og lign.
Den mest ligetil måde at lave en wireframe er med pen og papir, men der findes selvfølgelig rigtig mange værktøjer til wireframing. For eksempel, Miro som har mange templates, hvis du vil hurtigt i gang.
Vi starter gerne dialogen – vi skal bare bruge dit navn og telefonnummer. Vi lover at ringe til dig, så vi sammen kan tage en snak om hvorvidt, vi kan hjælpe med at understøtte din forretning i et partnerskab.