Sketching Hvordan en enkel penn og papir kan transformere webdesignene dine

Vi bruker god del av vår tid foran en skjerm, mest sannsynlig har vi mer enn en datamaskin, uten å nevne iPhones, grafikkbrett og alle de andre ultra moderne djevelene som invaderer våre skrivebord. Vi er alle en del av generasjonen som trenger en mus for å bla gjennom et album med familiefotoene (farvel til kjære familiealbum med sidene igjen til gule) og Facebook for å sende bursdagskrav til en venn. 20 eksempler på flotte "skisse" inspirerte nettsteder inkludert!

Likevel, i midten av denne digitale tidsalderen er de beste allierte av en webdesigner vanlige verktøy som kan kjøpes med endringen under sofaenes puter. Jeg snakker om å lage penn, blyant og papir en del av den kreative prosessen som andre "ikke-digitale" designere har brukt i årevis: skisse.

Med denne artikkelen behandler vi et argument som sikkert mange av dere vil ha til hjerte: Vi får se hvordan skisse kan hjelpe oss med å ordne ideene, utforme et effektivt layout og - hvorfor ikke - gi en ny og original touch til vårt design.

Skisse som en del av planleggingsprosessen

Tenk deg dette scenariet: Vi har nettopp avsluttet en utmattende briefing med vår klient, og nå er det øyeblikket å omorganisere ideene. Vi kjenner våre kunders preferanser og behov; På dette grunnlag bør vi kunne sette opp utformingen vi må designe. Problemet er mengden informasjon vi må vurdere! Vi definerte at på hjemmesiden må vi sette en glidebryter og en synlig oppfordring som inviterer til en kontakt, sidene på nettstedet blir syv, og vi må også inkludere de siste nyhetene på hjemmesiden og så videre.

På dette punktet forsikrer jeg deg om at du åpner Photoshop med forspenningen om å skape et effektivt layout er ubrukelig; uten en plan for hva du må tegne i detaljene, vil du bli blokkert og tvunget til å designe uten nok fremsyn for å ta intelligente beslutninger. Dette betyr ofte mer arbeid senere, og fikser det som kunne ha blitt gjort riktig første gang med bare litt arbeidskisse.

Sketching tilbyr noe unikt for webdesignere? Det hjelper oss med å organisere store mengder informasjon til håndterbare brikker som vi kan designe rundt.

I stedet, hvis du har lykken til å kunne metabolisere konsepter og ideer i et design, sannsynligvis vil du glemme noe viktig, med det resultat at du må sette hendene på layoutet igjen for andre gang. Og, du vet også sikkert at det er oppsett at selv med en liten forandring, blir helt forandret og mister kommunikativ og estetisk effektivitet? et virkelig frustrerende resultat faktisk.

Noen få råd om hvordan du går uten å miste hodet? Få penn og papir?

  1. Merk nøkkelordene Det må skille selskapet og det du vil ha foran øynene dine i prosjektfasen, slik at du ikke mister fokuset på at du må representere grafisk. Unngå kompliserte setninger og konsepter, være organiske: jo mer umiddelbar du er, desto mer kan tankene dine behandle informasjonen raskt og enkelt.
  2. Alltid i a skjematisk måte, muligens som en liste, skriv ned informasjonen som er nyttig for designfasen. Det du må gjøre er å registrere på papir bare informasjonen og konseptene du trenger når du åpner det grafiske programmet.
  3. Ranger ut informasjonen i faser, slik at hvert uttrykk er så enkelt som mulig. Hvis du fremdeles må utforme oppsettet til hjemmesiden, må du ikke ta notater på innholdet som skal inkluderes på kontaktsiden: unngå forvirring og distraksjon. Legg merke til informasjonen på forskjellige ark i notisboken, slik at du kan konsentrere seg om ett enkelt trinn om gangen.

Denne første fasen av skissering gjelder utarbeidelsen av informasjonen på en skjematisk og enkel måte. Du tenker nok på at all denne strengheten og disiplinen ikke har noe å gjøre med kreativitet og fantasi, og du vil ha en endring i naturen? Ok, la oss gå videre til neste trinn.

Skisse som en del av den kreative prosessen

Vi sa at skissen er en kreativ prosess, men vil dette bety i praksis?

Vi kan vurdere skisse som et mellomland? mellom informasjonen i vår besittelse og oppsettet vil vi ende opp med planlegging. På dette området, fiendtlig og magisk, finner vi farger, skrifter, bokser, ideer, inspirasjon, teksturer, bilder, opplevelser, tvil? og mye mer. Useless å si at midt i alt dette er det lett å forvirre og finne den rette ideen, ideen som virker, og som gjør oss stolte av å være designer.

Jeg tror at det ikke er noe mer irriterende enn å finne seg foran et blankt ark, og venter på inspirasjon som skal komme fra hvem som vet hvor og slår seg opp med å lage grimme layouter (så hvis du er veldig heldig som meg, Jeg er forlovet med en kollega som tar mest ut av situasjonen for å fortelle deg at arbeidet ditt suger uten å plage å søte pillen, slik at det ikke gjør vondt din som en kreativ).

En av mine egne skissebøker? Vi vil se dette senere.

Personlig passerte jeg litt tøffe tider med noen klienter: Inspirasjonen ville ikke komme, og mine grafiske forslag fikk meg til å skamme seg over meg selv. Jeg passerte timer på å se på galleri, føler meg enda mer deprimert fordi det virket som om alle kunne lage flotte layouter, den eneste personen som ikke kunne sette to rektangler sammen på en fin måte var meg. I mitt tilfelle ble trykket enkelt gjort ved hjelp av en blyant.

Gi sparkstart til en kreativ prosess på papir frigjør faktisk fantasien din, slik at du kan jobbe på en mer spontan og stimulerende måte.

Spesielt hvis prosjektet du jobber med, er stort og rik på tekniske detaljer, vurderer du at den første fasen absolutt kan kastreres for den kreative fluxen, for ikke å nevne den svekkende frykten? som påvirker mange designere: fanget i trangen til å gjøre det raskt og bra, forblir vi ofte lammet foran skjermen ute av stand til å omorganisere ideene og kanalisere dem i riktig retning.

Derfor, før du begynner å jobbe med hva som helst grafisk program, få penn og papir og? skisse! Scribble, skrive ned et par ideer, begynne å spore en slags abstrakt design for å bli kjent og etter fri din intuisjon. Du vil etterpå analysere ideene, nå bare la deg gå og unngå logikk og rasjonalitet, de vil ikke hjelpe deg i denne fasen.

Sett opp utformingen, legg ned et par notater, slett alt, start på nytt: I løpet av denne prosessen jobber hjernen raskt og frenetisk, så vær oppmerksom på alt før denne intuitive fasen svinger ned! Du vil oppdage at å gi fullstendig frihet til dine ideer er hyggelig og avslappende, foruten nyttig.

Gjøre feil? med vilje

Den første ideen vil sjelden være den rette, være forberedt på å akseptere den. Sketching hjelper deg å blokkere deg selv og gripe til forskjellige grafiske muligheter som kan være rett for deg umiddelbart og lett, men dette betyr ikke at du ikke vil begå feil i denne fasen. Det positive er at selv om du gjør feil i denne fasen, kan du alltid rive arket, skarpe blyanten og starte om igjen på nytt ark. Kast bort en layout laget med Photoshop, bare fordi du skjønte at det ikke er den beste løsningen for saken din, er uten tvil demotiverende.

Skisse, Ikke Wireframe

På den måten råder jeg deg til å ikke forveksle skisser med etableringen av WireFrame: vi snakker om to forskjellige ting, selv om jeg ser at det er litt forvirring om argumentet. For noen dager siden fortalte en webdesigner meg å sitere med sine eksakte ord? Ah, bruker du penn og papir? Jeg gjør alt på nettet? , nevner et nettsted som tillater å lage mockups med en matematisk presisjon, med full kontroll over farger og typografi.

Vel, dette er ikke sketching, dette er helt en annen ting. Hvis du klikker med musen på noen knapper for å lage noen rektangler, tillater du ikke å forme ideene dine og frigjøre kreativ flux, prøv å tro. Med denne utsagnet tviler jeg ikke på nytte av en god wireframe, jeg vil bare understreke forskjellene mellom disse to tilnærmingene.

Omfavne kaos

Sett bort ditt ønske om presisjon, linjal og kompass! I denne fasen er det ikke noe rom for ordre og rigor, så begrens ikke den kreative fluxen, blokkere deg selv på marginaler og hvite mellomrom, du kan tenke på dem senere. På samme måte, ikke bekymre deg hvis du ikke er spesielt kunstnerisk begavet og dine manuelle evner nesten ikke lar deg holde en blyant: skisse brukes til å omorganisere ideene ikke for å danne begavede artister.

I denne sammenheng må vi legge til at selv om skisse ble født som et fritt middel for uttrykk for fantasi og kreativitet fra hverandre dine grafiske evner, betyr det ikke at skissen heller ikke på en bestemt måte har en kunstnerisk verdi. La oss se sammen hva jeg snakker om.

Skisse som en del av designprosessen

Tendensen til mange webdesignere til å skissere har gitt sparken til en ekte grafisk stil som på en eller annen måte hylser de estetiske aspektene ved skissen: Vi har børster som mimser spontanitet og lyshet, for ikke å snakke om hundrevis av skrifttyper i håndskrevet stil funnet på nettet. Takket være slike ressurser som skaper i dag, er en layout i skisseformat ganske enkelt, men i tillegg til disse designene som bruker denne grafiske stilen, har de vanligvis en originalitet som gjør dem tiltalende og ut av det felles løp.

Skissestilen, bare fordi den er knyttet til en aktivitet som er felles for mange reklamer, brukes ofte på nettsteder av frilansere eller kommunikasjons- / designbyråer som ønsker å overføre dette konseptet grafisk. Uansett, selv kombinasjonen av noen skisseelementer til en mer tradisjonell grafikk kan gi et nytt perspektiv til ellers vanlige design.

La oss se hvordan noen nettsteder har brukt denne stilen på en effektiv og original måte, og hvordan dette har påvirket estetikken og effektiviteten av deres layouter.

Kunal Chhajer

http://www.kunalchhajer.com/

Nettstedet til webdesigneren Kunal Chhajer gjenspeiler nøyaktig konseptet av skisseformen. Grafikken er lett og behagelig, den er beriket på en original måte av noen design som gjør utformingen unik. Stilen er også tilbakekalt ved bruk av en håndskrevet skrift i navigasjonsmenyen. Alle disse detaljene gir designen den kreativiteten som en designer ønsker å uttrykke i sitt personlige nettsted.

Kreativ med en K

http://www.creativewithak.com/

I Creative med et K-nettsted er det en massiv bruk av skisser og doodler, bare for å tydelig vise "kreativ natur"? av nettstedet. I dette tilfellet gjør selve oppleggets egenart, så atypisk, nettstedet spesielt og uvanlig, selv om det er vanskelig å konsultere.

Lega-Lega

http://www.lega-lega.com/

Nettstedet Lega-Lega er en nettbutikk av skjorter med utskrifter litt utenom det vanlige, og det er rettet mot et ungt marked. Tilføyelsen av noen skisse detaljer gir en kreativ og perky kutt til nettstedet.

Beavory

http://beavory.com/

Beavory er nettstedet / bloggen til Karen Mack, israelsk illustratør. Stilen på nettstedet hennes er bevisst basert på en stil som minner om sin kreative natur på en uttalt og original måte. Hver detalj, fra strukturen av layoutet basert på uregelmessige linjer - som om de ble tegnet med en feltpenn - til ikonene i det sosiale nettverket, sporer helt en effektiv skisseform.

Sløyfe

http://bowtieperiod.com/

Bowtie er et digitalt studio som bestemte seg for å representere seg selv på en kreativ måte på nettet. Animasjonene på nettstedet, sammen med søte, uvanlige tegninger, gjør layoutet attraktivt og sterkt ekstravagant. De kaller seg kreative? og for å bevise det bruker de elementer i skisseform.

MakoMako

http://www.makomako.cz/home/

Layoutet til bandet MakoMako er helt opprettet i skisseform, slik at den samme strukturen på siden er basert på et ark med uregelmessige linjer, og på hjemmesiden som en del av designet finner vi i tillegg til de vanlige grafiske detaljer basert på skisser og håndskrevne skrifter, en blyant. En nysgjerrig og et veldig uvanlig utseende for et band.

Stan Snømannen

http://stanthesnowman.com/

Nå er det nesten sommer, mye av sin sjarm forsvinner, men den grafiske effektiviteten til nettstedet Stan snømannen er imidlertid ute av spørsmålet. I dette tilfellet gir tillegget av stiliserte bilder og en kalligrafisk skrift en spontan stil til layouten, leken og uformell. Og det sporer konseptet av aktivitet, basert på skrive gratulasjonskort.

Greenaway Pro

http://www.greenawaypro.co.uk/

Festivalen Greenaway Pro 2011-siden kombinerer på en bestemt og attraktiv måte skisseformet og grunneformen, noe som gir et veldig originalt preg på oppsettet. Også i dette tilfellet har valget av denne grafiske stilen en tendens til å uttrykke et uformelt, spontant og eksentrisk utseende. Perfekt for en festival som omhandler musikk og surfing, rett?

Julian Laval

http://www.julianlaval.com/

Julian er en annen freelance webdesigner som ønsker å markere sine grafiske ferdigheter, utnyttet skildens kommunikative kraft på en virkelig kreativ måte. Selvfølgelig er det ikke bare dette som gjør nettstedet spesielt, men til og med den nysgjerrige og bevisst uvanlige naturen til tegningene sine. Som mange andre steder i denne stilen, er farger begrenset til en grå skala, for å gjøre illustrasjonene mer realistiske.

Små skapninger

https://www.littlecreatures.com.au/

Nettstedet Little Creatures er fullstendig designet i skisseform og takket være den særegne skisse, så lite refinished, siden er så attraktiv.

Le Carnet Ordinaire

http://carnetordinaire.com/

Carnet Ordinaire er et nettsted som er som en dagbok, med reisebeskrivelser, kommentarer og personlige hensyn. Med tanke på den eksentriske og intime naturen til nettstedet, er skisseformen den mest hensiktsmessige: utformingen er basert på bildet av en åpnet moleskine, forbedret av skisser og stiliserte tegninger. Selv bakgrunnen er gjort mer original med noen tegneserier satt i ugjennomtrengelighet og ved tilstedeværelsen av en blyant, forlot tilfeldig nær moleskine.

Wing Cheng

http://www.wingcheng.com/

Wing Cheng-porteføljen er et perfekt eksempel på det friske perspektivet som skissestilen kan gi til et oppsett. Sidestrukturen er basert på en ajar moleskine, hvor sidene faller ned. Effekten blir gjort mer dramatisk takket være skygger som rammer utformingen og bruken av kalligrafiske skrifttyper for hvert innhold i oppsettet, fra titlene til prosjektene til beskrivelsen. Men den ekte særegenheten til dette nettstedet tar hensyn til prosjektets eksponering, også skissert i blyant på en virkelig kreativ måte.

Kuztown University

http://www.kutztown.edu/acad/commdes/faculty/

Kutztown-universitetet for kommunikasjon og design kunne ikke finne en bedre måte å adressere effektivt til reklamer eller håper. Oppsettet er absolutt uvanlig for en akademisk virkelighet: Bakgrunnen i vannfargestil, siden basert på en side av en bok, illustrasjonene i vannfarger, de spesifikke skriftene i navigasjonsmenyen? alle originale og sikkert uttrykksfulle detaljer.

Dan Whittaker

http://www.dannwhittakercreative.com/

Dann Whittaker på hans nettsted viser en grafisk stil som er vanlig for mange webdesignere. Et uformelt og spontant utseende, basert på en sidebokoppsett og på en konsistent bruk av detaljer i skisseform. I komplekset er oppsettet veldig effektivt og hyggelig estetisk.

Tjernobylhjertet

http://www.chernobylheart.org.uk/

I tilfelle av Tjernobylhjerteområdet er skissestilen brukt til å fremheve barndomsbegrepet grafisk: her snakker vi om barn og vi ser det gjennom noen små stiliserte skisser som kopierer tegningsveien. Effektiv og behagelig.

Demain j'arrete

http://demainjarrete.stpo.fr

Skissestilen er perfekt for å presentere på tegneserier og illustrasjoner, slik at utformingen representerer visuelt og kreativt innholdet på nettstedet. I Demain J'arrete-saken har hele nettstedet et kull? grafisk stil, fra bakgrunnsgradienten til de uregelmessige linjene som inneholder oppsettet og navigasjonsmenyen.

Naturbutikk

http://www.natureshop.co.nz/

Legge til et par skisse detaljer på tilsynelatende uformell måte, kan gi den spesielle kreative kontakten til et minimalt og viktig sted. Resultatet, som er synlig for eksempel i nettstedet Nature Shop, er ekstremt hyggelig.

Klar til marked

http://www.readytomarket.net/

Oppsettet til Klar til marked er et eksempel på hvordan man blander en moderne stil med noen stiliserte og komiske detaljer kan gi et nytt og stimulerende resultat.

Cou Cou Shop

http://www.coucoushop.ch/

Cou Cou Shop er veldig hyggelig og hyggelig å se. En av de mest spesielle elementene i oppsettet er uten tvil den footer, som viser et stilisert landskap i Sveits. Selv skissen på posen fra forskjellige vinkler er en veldig original detalj.

Upside Down Town

http://upsidedowntown.me/

Fargerikt, uvanlig og lunefull: stedet for læringssenteret Upside Down Town investerer mye på originaliteten av skissestilen. Hvert element i oppsettet, spesielt i overskriften, peker på den visuelle effektiviteten til tegninger, skisser og farger som fremhever grafisk og hyggelig måte på barns verden.

Konklusjon

Vi så hvordan skisseprosessen kan hjelpe oss med å behandle ideer på en kreativ måte og samtidig, hvordan noen skisser kan gi et annet og originalt perspektiv til våre layouter. Gjør sketching en vane når du begynner å jobbe med et nytt designprosjekt - og ikke bare - kan komme svært nyttig også på andre felt, som i copywriting - og i tide vil du utvikle en fleksibilitet i sinnet som blir nyttig i din arbeid. Derfor konkluderer du: Slå av datamaskinen og få papir og penn!

Jeg er ferdig med å dele med deg to personlige skisser: en skisse av min nåværende portefølje og de første ideene jeg legger ned for denne artikkelen, under en kjedelig togtur.

Nå er det din tur, jeg vil se skissene dine!