Innhold
- 01. Evaluer, lær, forstå
- Alle mulige løsninger
- 02. Wireframing
- Wireframing verktøy
- 03. Bli inspirert
- Hold det relevant
- Bær kamera
- 04. Design og bygg
- Ta en pause
- Likte dette? Les disse!
Så du har vunnet jobben, møtt klienten og skrevet ned så mange notater som mulig. Hva nå? Selv om stort sett alle webdesignere har sin egen prosess for å designe et nettsted, trodde jeg at jeg ville dele min personlige tilnærming til arbeidsflyten med deg.
Dette er på ingen måte en endelig liste over hva du må gjøre under et designprosjekt, bare mine foretrukne metoder og praksis for både inspirasjon og kritikk. Jeg vil gjerne vite hvordan din er forskjellig - gi meg beskjed i kommentarfeltet nedenfor.
01. Evaluer, lær, forstå
Før du skynder deg for å fyre opp favorittgrafikk- eller kodeditoren din, er det viktig å få tankene dine til å tenke på riktig måte. Med ‘riktig vei’, mener jeg å tenke i form av oppsummeringen og hva dette prosjektet trenger å formidle for å oppnå dine mål.
Så notater i hånden, jeg vil kaste tankene mine tilbake til møtet med klienten, se over notatene mine og prosjektmålene og tenke på hvordan designet kan oppnå dem. Personlig synes jeg denne prosessen er mest effektiv når jeg er borte fra dataskjermen.
Alle mulige løsninger
Jeg leser gjennom notatene mine og vurderer helvete ut av dem, og noterer alle mulige løsninger på målene som er skissert. For eksempel, hvis klienten har bedt om en "rolig" eller "avslappende" følelse på nettstedet, hva kan dette bety når det gjelder farge, type, bilder, teksturer og hvitt mellomrom. Hvis det antas at klientens primære målgruppe ikke er teknisk kunnskapsrik eller datakyndig, hva kan dette bety med hensyn til brukeropplevelse, funksjonalitet og oppfordringer til handling?
Jeg prøver å bruke så mye tid som er nødvendig på denne oppgaven og evaluere så mye som mulig. Når jeg er fornøyd med scenen jeg har nådd, vil jeg gå videre til neste fase.
02. Wireframing
Med tanke på alt som ble oppdaget i forrige oppgave, handler neste trinn om å omformulere mitt potensielle design.
Personlig foretrekker jeg å gjøre dette for hånd på papir fordi jeg synes det er nyttig å lage notater på trådrammen underveis. I noen tilfeller diskuteres imidlertid wireframes med klienten før du designer, i så fall kan det være et bedre alternativ å oversette wireframe til en digital versjon.
Wireframing verktøy
Jeg pleier å bruke Adobe Illustrator for denne oppgaven, men det kan gjøres i alle grafikkredigeringsprogrammer. Det er også tilgjengelige verktøy som er spesielt dedikert til denne prosessen, for eksempel Balsamiq Mockups eller Mock Flow-appen.
Det er viktig å merke seg at wireframes ikke bare skal tegnes for nettleserversjoner av nettstedet. Tenk på tvers av enheter gjennom hele prosessen og tenk på hvordan elementene på siden vil fungere på tvers av alle enheter.
03. Bli inspirert
Jeg synes det å nærme meg trådrammer med bare forestillinger om evalueringene dine i tankene hjelper meg å tenke klart om prosjektet. Men før jeg begynner å designe, liker jeg å søke inspirasjon fra en rekke kilder.
Jeg begynner med å se på andre nettsteder som oppnår lignende mål som den korte informasjonen jeg har fått. Hvis jeg ser noe du liker, kopierer jeg ikke bare det, men tenker på hvordan det kunne vært gjort bedre. Jeg spør også: hvordan vil nettstedets målgruppe svare på det?
Hold det relevant
Ofte blir designere inspirert litt for bokstavelig og inkluderer ofte designfunksjoner eller elementer i prosjektet fordi de liker dem, ikke fordi det var relevant for prosjektet. Du bør ikke tenke på designtrender eller skape noe dine kolleger i bransjen vil like. Det skal alltid være relevant for prosjektet.
Inspirasjon kan også hentes fra et kundeperspektiv. For eksempel, hvis jeg utformet et nettsted for en smykkebutikk, i stedet for å løpe til Google og søke etter "Best designet smykkesider", ville jeg besøke en faktisk smykkebutikk. Jeg vil se på interiørdesignet, tenke på følelsen jeg får når du går inn, eller hvordan produktene vises for å lokke meg til å kjøpe dem.
Bær kamera
Inspirasjon kan ofte komme fra de mest usannsynlige stedene. Jeg finner vanligvis den beste inspirasjonen vekk fra dataskjermen min. Design i den virkelige verden kan spille en viktig rolle; arkitektur, kunst, produktdesign, fotografering. Også former, form og farger i hele naturen kan gi et flott inspirerende perspektiv. Å ha et kamera på meg hjelper meg hele tiden å fange denne inspirasjonen.
04. Design og bygg
Nå føler jeg at jeg kjenner dette prosjektet ut og inn. Mitt sinn er oversvømmet med inspirasjon, og jeg gleder meg til å bli kreativ.
Jeg liker å designe med musikk på; det hjelper meg å avskjære meg fra distraksjoner utenfor og forsvinne i min egen verden. Jeg holder alle notatene og trådrammene ved din side og henviser kontinuerlig til dem.
Ta en pause
Jeg synes også det er veldig nyttig å ta pauser under designprosessen. Å se på noe konstant i åtte timer rett kan føre til at man tenker i en kreativ retning. Derimot kan det å gjøre regelmessige pauser og tenke på designen vekk fra skjermen gjøre underverker for det kreative sinnet.
Fremfor alt husker jeg alltid hvem jeg designer for; det er min sak å kreativt uttrykke deres.
Ord: Jason Cianfrone
Jason Cianfrone er designer og utvikler i Base Creative, et multi-prisvinnende Londonbasert byrå for webdesign og markedsføring på nettet. Følg ham på Twitter på jCianfrone.
Likte dette? Les disse!
- Hvordan lage en app
- Strålende Wordpress opplæringsvalg
- Oppdag hva som er neste for Augmented Reality
Hvordan skiller designprosessen din seg ut? Gi oss beskjed i kommentarene nedenfor!
