wireframe

Derfor er wireframes en vigtig del af udviklingsprocessen

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.

Hvad er wireframes?

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.

Hvad bruger man wireframing til?

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å:

  • Hvad de forskellige sider skal indeholde, f.eks. tekst, billeder mv.
  • Hvilke elementer, som skal fremhæves eller på anden vis har en central rolle på siden.
  • Hvilke funktioner, der skal indgå, deres placering og hvordan de virker.

Hvorfor skal jeg lave wireframes?

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.

Hvordan laver jeg en wireframe?

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.

DEL DIN NYE VIDEN:

Del på facebook
Del på linkedin
Del på twitter

Relateret content

CASES & blogindlæg

Hvad er en mockup?

“Jeg kan ikke forklare det… men jeg kan vise dig det!”. I denne artikel dykker vi ned i, hvad et mockup design er, og hvordan