En interaktiv designprosess 14

Alle snakker om HTML5, og noen snakker til og med om CSS3. Men selv om HTML og CSS er viktige ingredienser i designprosessen min, er det bare et redskap – a means to an end. Samtidig tror jeg at grunnleggende kunnskap om webstandarder kan hjelpe designere å realisere idéer bedre.

For noen år siden lagde jeg følgende film for å illustrere poenget mitt:

(Er du med? Lær deg HTML og CSS, men det har ingen verdi i seg selv.)

Når jeg designer et nettsted jobber jeg etter en arbeidsflyt jeg har innarbeidet og finpusset på gjennom snart 15 år. Her er et lite innblikk i hverdagen min:

Idéen

Når jeg har analysert problemet og tenkt ut en idé tester jeg ut ulike løsninger i grove skisser (på papir, i Photoshop eller Illustrator). Denne prosessen gjentar jeg til jeg har et startpunkt på designet jeg vil jobbe videre med.

Designet

Deretter jobber jeg ut noen mer raffinerte skisser som gir et bilde av hvordan designet vil se ut på ulike deler av nettstedet. Jeg detaljerer disse nok til at jeg kan vise dem frem og få tilbakemeldinger, men ikke så mye at jeg låser muligheten for å jobbe videre med dem.

Når jeg er enig med kunden om en retning for designet jobber jeg videre med nettstedet i browseren. Jeg bygger det opp i HTML og CSS og modulariserer det med PHP (og av og til litt XML).

Jeg jobber meg gradvis gjennom de ulike delene av nettstedet, side for side, bit for bit.

Helheten og detaljene

Jeg ser på flyten mellom ulike sider og interaksjonen i enkeltelementer, typografi, farger og grafiske elementer. Sakte, men sikkert jobber jeg frem en prototype som viser helheten og alle de små detaljene i designet. (Jeg jobber fortsatt med skisser, men løsningen detaljerer jeg i prototypen.)

Underveis jobber jeg med scenarioer og reellt innhold for å teste interaksjonen og tøyeligheten i designet: Hvor kommer innholdet fra? Hva skjer hvis innholdet endrer seg? Hva skjer når jeg klikker på ditt og datt? Hva skjer når jeg er logget inn? (Og hva hvis alt går til helvete?)

Men hva faen er poenget?

Når jeg jobber med designet interaktivt får jeg en følelse av hvordan nettstedet blir, ikke bare hvordan det ser ut. Og fordi jeg tester alt underveis overlater jeg veldig få ting til tilfeldighetene.

Men først og fremst hjelper prototypen meg med å kommunisere med de ulike interessentene i prosjektet. Kunden forstår hva de får og utviklerne får en designdokumentasjon som er vanskelig å misforstå.

Hvordan jobber du?