Design guides er et uvurderligt værktøj til at maksimere design team output, og for at sikre en ensartet brandidentitet. Vi ser på seks væsentlige komponenter i vellykkede designguider.

En design guide er mere end blot et dokument, der følger med en ny hjemmeside eller brandidentitet. En god design guide er et kunstværk i sig selv og har praktisk anvendelse i det daglige designarbejde. Det viser hvad dit projekt er og stræber efter at være. Det bør bringe elementer af design, stemme og lige kode sammen på en måde, der er håndterbar, brugbar og let at forstå.

Det starter med disse seks design guide elementer, der skal være i din dokumentation. (Hvis de ikke er, skal du straks ændre din vejledning!)

1. Brandidentitetseksempler

Din design guide skal fremvise din brandidentitet i et visuelt format, der er repræsentativt for den måde, du vil have designmaterialer til at se. Det er et klasse eksempel på show, ikke fortælle. (Selv om der er nogle fortællinger i vejledningen til at gå med de visuelle eksempler.)

De bedste eksempler er egentlige anvendelser, som eksemplificerer præcis hvad designstandarderne er beregnet til at skildre.

Brug skærmbilleder fra din hjemmeside, mobil hjemmeside, app eller et andet sted, når designet er bedst.

Hvad er godt med Elsker at ride design guide er, at hver side i hæftet ligner hjemmesiden og skaber brandkonsistens. Guiden selv bringer små elementer i designet i fokus, såsom den rigtige stil til apps-ikoner i en præcis visning.

Det bedste ved at bruge rigtige eksempler i en design guide er, at du ikke behøver at skabe ekstra arbejde for at fremvise visuelle elementer; du har allerede dem i hånden. Plus, holdmedlemmer vil vide, at den skriftlige retningslinje arbejder i praksis, fordi der er visuelt bevis.

ride

2. Retningslinjer for design

Alt fra farveprøver til typografipaletter, til former og brug af designelementer skal skitseres tydeligt.

Hvorfor ser designet ud og fungere på en bestemt måde? Hvad er filosofien bag den?

At forklare disse ting kan hjælpe brugerne med at anvende designstilen mere præcist og konsekvent på tværs af medier. Når det kommer til website design, er det en god idé at inkludere elementer, der kan være forskellige fra print branding kolleger og hvordan de vedrører. For eksempel vælger mange designere en anden typografipalette online, der efterligner trykt branding for at maksimere brugen af ​​Google Fonts til Typekit for at gøre det lettere at bruge dem.

Sørg for at bemærke, hvilke skrifttyper der er substitution, hvis dette er en del af din designstrategi.

Når der beskrives designretningslinjer, skal det være specifikt, når det er vigtigt. H1-tags er altid 88 point, eller miniaturebilleder er altid 200 til 200 pixel, men overstyr ikke unødvendige detaljer. Du vil have holdmedlemmer til at se oplysninger med et overblik og bruge det, ikke få vejet ned for at finde noget i et hav af specifikationer.

Netflix

3. Stemme og personlighed

Skrivestil retningslinjer er ikke så sjovt at tænke på som andre visuelle elementer i en design guide, men de er lige så vigtige.

En beskrivende skrivestil til kopiering kan også påvirke billederne. Det bidrager til den type billeder, du vælger at bruge, og endda elementer som farve og type. Alle disse varer går sammen for at skabe en overordnet personlighed for mærket.

Det hvordan udenforverdenen vil identificere dig.

Derudover er en stærk stemme og personlighed også en del af den visuelle identitet. En god personlighed viser i designelementer, fordi brugerne næsten kan identificere designelementer selv uden for indholdet af resten af ​​mærket. (Tænk Coca-Cola rød eller Disneys signatur skrifttype.)

stemme

4. SEO søgeord

Søgemaskine optimering kan være en af ​​de mest talte om og mindst sjove dele af website design. Tænk på søgeord tidligt og ofte.

Medtag dem på den måde du taler om mærket på, i beskrivende sprog om designet og sæt en liste over de øverste søgeord i selve designguiden.

Urban Outfitters har en veldesignet (og sjov) søgeordsliste i sin brand guide. Mens tøjmærket bruger masser af forskellige søgeord, er de vigtigste ord markeret med farve, så du kan se dem med det samme.

En søgeordsliste som dette bringer de ord, du vil sige til tophul, hver gang du ser dem. De fleste, der skriver kopi, fortæller dig, at når du ser eller tænker på et ord i en bestemt sammenhæng, bliver det fast i hovedet. Det er netop, hvad SEO-søgeordslisten skal gøre.

Designelementer skal til enhver tid korrelere med disse søgeord, så indholdet er relateret i hele webdesign.

by-

5. Mønster og element stilarter

Med så mange forskellige medier online (for ikke at nævne virksomheder, der også designer trykte elementer), er det vigtigt at have vejledninger til alle mulige anvendelser.

Dette gælder stillbilleder og animerede versioner af logoer, farvepaletter, mønstre og endda designelementer som formularfelter og navigation.

Din design bog skal have et afsnit dedikeret til disse elementer. Og hvis du vil have, at teamet virkelig elsker dig, skal du oprette et mønster- og elementstilguide i en online-placering, så brugerne bare kan kopiere og indsætte elementer til hurtig brug.

Ollo

6. Kodeuddrag

Hvert website design guide skal omfatte masser af almindeligt anvendte kodestykker. Fra knapper til små animationer til glidereffekter, tilføjer disse små kodeord timer til din daglige arbejdsgang ved at eliminere behovet for manuelt at indtaste specifikationer med hvert nyt element.

Dette virker for alt fra blogindlæg - tilføj en kodeblok til billeder, som bloggere kun kan kopiere og indsætte for den rigtige størrelse og afgrøde til mere uddybte brugergrænseffekter.

Firefox indeholder designkomponentinformation i sin design guide til den nyligt reviderede branding og logo brug. Selvom du ikke udleverer et komplet bibliotek med kodestykker, skal du huske at inkludere nogle basisoplysninger, f.eks. Hvor du kan bruge H1 til H4 på sider inden for webdesign og hvordan du stiler knapper og billeder.

firefox

Konklusion

Det bedste ved en design guide er, at det ikke behøver at være et statisk dokument. Det kan vokse og ændre sig, da dit brand og visuelle identitet gør det samme.

De fleste designere - især webdesignere - vælger online-versioner af en design guide, så det er hurtigt og nemt at foretage ændringer og greb kode og farveuddrag. Overvej at tilføje en stil guide side til din hjemmeside, og husk at henvise til det (og opdatere det) ofte.