Webdesignprocessen: fra idé til færdige skærme
En god designproces er ikke bureaukrati: det er den rækkefølge, der forhindrer omarbejde. Hver fase lukker en beslutning, som den næste tager for afgjort.
Denne guide gennemgår faserne, hvad hver leverer, hvor lang tid de tager, og hvor designprojekter typisk går i stå.
Faserne og hvad hver leverer#
Rækkefølgen betyder noget. At springe en fase over fjerner den ikke — den skubber blot beslutningen frem til, hvor den er dyrere at ændre.
| Fase | Leverance | Typisk tid |
|---|---|---|
| Opdagelse | Mål, målgruppe, begrænsninger | 3 til 5 dage |
| Struktur | Sideliste og navigation | 3 til 5 dage |
| Wireframes | Layout uden visuel stil | 1 til 2 uger |
| Visuel retning | Typografi, farve, tone — på én side | 3 til 5 dage |
| Færdige skærme | Skabeloner anvendt, desktop og mobil | 2 til 4 uger |
| Prototype | Klikbare forløb til test | 2 til 4 dage |
| Aflevering | System, eksporter, specifikationer | 3 til 5 dage |
Visuel retning på én enkelt side er den fase, der sparer mest tid. At godkende tonen, før den anvendes på tredive skærme, forhindrer omarbejde af tredive skærme.
Wireframes før stil#
Wireframes uden farve og typografi fremtvinger diskussionen om indhold og hierarki, og det er den diskussion, der betyder noget.
- Tegn mobilen først. Der er plads til mindre, hvilket tvinger til at prioritere.
- Brug rigtigt indhold, eller så tæt på som muligt. Pladsholdertekst skjuler pladsproblemer.
- Vis tomme, fejl- og indlæsningstilstande — de glemmes ofte og improviseres bagefter.
- Markér den primære handling på hver skærm. Er der tre, er der ingen.
- Diskutér ikke farver i denne fase. Dukker det op, er wireframes for detaljerede.
- Validér indholdsstrukturen med den, der skal skrive den, før I går videre.
Hvor processen typisk går i stå#
Blokeringerne er næsten altid de samme, og næsten alle er organisatoriske frem for kreative.
| Blokering | Årsag | Løsning |
|---|---|---|
| Modstridende feedback | Flere beslutningstagere uden hierarki | Én enkelt ansvarlig |
| Uendelige runder | Runder ikke defineret i aftalen | Fast antal med godkendelseskriterium |
| Manglende indhold | Ingen er udpeget | Navn og dato pr. side |
| «Det er ikke det, jeg forestillede mig» | Visuel retning sprunget over | Godkend tonen på én side først |
| Skærme der ikke kan bygges | Design uden kontakt til udvikling | Tidlig gennemgang med udvikleren |
| Mobil improviseret til sidst | Designet kun til desktop | Design mobilen først |
«Uendelige runder» er næsten altid et aftaleproblem, ikke et designproblem. Definér hvad en runde er, og hvor mange der er.
At aflevere design der kan bygges#
Afleveringen afgør, om bygget flyder, eller om det bliver en tolkningsøvelse.
- Aflevér et lille system, ikke bare skærme: farver, skrifttyper, afstande, komponenter.
- Dokumentér hver komponents tilstande: normal, fokus, aktiv, deaktiveret, fejl.
- Specificér adfærden mellem brudpunkter, ikke bare to faste bredder.
- Inkludér tomme og fejltilstande for hver skærm.
- Eksportér billeder i moderne formater og i de størrelser, de bruges i.
- Markér hvad der er fast, og hvad der må tilpasse sig — den der bygger, støder på tilfælde du ikke forudså.
- Hold en aflevering live. En halv time sparer en uges spørgsmål.
Ofte stillede spørgsmål
Hvor mange rettelsesrunder er normalt?
To til tre pr. fase er sædvanligt og bør stå i aftalen, med definition af hvad der tæller som en runde. Uden den grænse har designet en tendens til at udvide sig i det uendelige, fordi hver ny person, der ser skærmene, har en mening. Én enkelt beslutningstager er mere værd end nogen talgrænse.
Har jeg brug for wireframes, når jeg allerede har referencer?
Ja, for referencer viser stil, mens wireframes løser struktur. At gå direkte fra referencer til færdige skærme ender som regel i diskussioner om farver, når det reelle problem er informationshierarki. Wireframes laves hurtigt og ændres endnu hurtigere.
Skal jeg designe alle sider?
Design skabeloner, ikke sider. En side med halvtreds undersider har som regel fem eller seks distinkte skabeloner. Design hver skabelon med det sværeste indholdstilfælde — den længste overskrift, den længste liste — så følger resten uden ekstra arbejde.
Hvem skal godkende designet?
Én person med reelt mandat. Du kan samle meninger fra flere, men beslutningen skal tilhøre nogen. Godkendelse i udvalg producerer design, ingen hader og ingen forsvarer, og er den hyppigste årsag til projekter, der trækker ud i månedsvis i den visuelle fase.
webdesignprocesdesignfaser hjemmesidewireframesdesignsystemrettelsesrunderdesignaflevering
