Issuu on Google+

Designmanual


Velkommen Denne designmanual indeholder retningslinjer til, hvordan markedsføringsmateriale tilhørende kampagnen “Stop Tandlægeskræk” skal udformes. Retningslinjerne skal altid overholdes, således at al markedsføringsmateriale har et ensartet layout og kan forbindes med samme afsender.


Indhold Logo 01 Respektafstand 03 Skalering 04 Baggrund 05 Gr책skala 06 Typografi

07

Typografi

09

Font 10

Farver 13 Farvepalet 14 Farvesymbolik 15

Ikoner 17 Oversigt 18


Diagrammer 21 Former 22 Tal 23

Web 25 Overskrifter 26 Brødtekst 27 Billeder 28 Knapper 29 Desktop/Laptop 30 Tablet 31 Mobil 32


Logo

1


Logo

2


Respektafstand For at sikre afstand mellem formatets kant og andre elementer er der defineret en respektafstand. Respektafstanden udgør det dobbelte af afstanden fra bunden af bomærket til hovedlinjen på navnetrækket.

3


Skalering Logoets størrelse afhÌnger af formatet, det skal bringes pü. Derudover er det vigtigt at vise, at logoet fungerer i flere skaleringer.

4


Baggrund Logoet kan placeres pü en mørk baggrund uden Ìndring i farverne.

5


Gr책skala Logoet findes i en gr책skalaversion, som skal benyttes, hvis der ikke er mulighed for farveprint, eller hvis der skal laves et layout i sort/hvid.

6


Typografi Navnetrækket i logoet er skrevet med fonten Roboto. Den er anvendt i fed og tynd udgave til henholdsvis “Stop” og “Tandlægeskræk”.

Roboto Thin

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXZzÆæØøÅå1234567890({[.,;:$!% Roboto Bold

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxZzÆæØøÅå1234567890({[.,;:$!% 7


8


Typografi

9


Primær font Lato er kampagnens primære font. Den skal bruges til alle former for tekst fra overskrifter til brødtekst på alle medier.

Lato Regular

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXZzÆæØøÅå1234567890({[.,;:$!% Lato Italic

AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxZzÆæØøÅå1234567890({[.,;:$!% 10


11


12


Farver

13


Farvepalet Farverne, der skal bruges til kampagnen, ses her til højre.

14

# 0096ba

R: 0 G: 150 B: 186

C: 80 M: 25 Y: 18 K: 0

# 4bb6e3

R: 75 G: 182 B: 227

C: 62 M: 10 Y: 2 K: 0

# 62c7ff

R: 98 G: 199 B: 255

C: 51 M: 6 Y: 0 K: 0

# 98dceb

R: 152 G: 220 B: 235

C: 37 M: 0 Y: 7 K: 0

# f5f5f5

R: 245 G: 245 B: 245

C: 3 M: 2 Y: 2 K: 0


Farvesymbolik Farvesymbolik fortĂŚller alt om farvernes betydning, og hvordan de pĂĽvirker os.

15


16


Ikoner

17


Ikonoversigt Kampagnen har en rĂŚkke ikoner, der skal bruges ved forskellige kategorier. Ikonerne er beskrivende.

18


19


20


Diagrammer

21


Former De benyttede diagrammer er søjlediagrammer og cirkeldiagrammer. Disse skal have bestemte former og layouts, som vist her til højre.

22


Tal og tekst Tal og tekst ved diagrammer skal stå på en bestemt måde. Ved søjlediagrammer skal tekst stå til venstre. Tal vises ved hover. Ved cirkeldiagrammer skal tal og tekst stå rundt om.

23


24


Web

25


Overskrifter H1 overskrifter til desktop/laptop skal være 60 pt. Underoverskrifter skal være 30 pt. H2 overskrifter skal være 20 pt. Til andre enheder bør størrelsesforholdet mellem de to overholdes.

Lato, 60 pt.

Overskrift Lato, 30 pt.

Overskrift Lato, 20 pt.

Overskrift 26


Brødtekst Brødteksten skal være let læselig. Derfor bør linjernes længde minimum være 30 enheder (inkl. mellemrum) og i størrelsen 12 pt. Længere, oplysende tekster, bør stå i 3 spalter og være venstrejusteret. Her ses eksempler på anbefalede brødtekststørrelser i spalter.

Lato, 12 pt.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud Lato, 3 spalter Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut

exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros

aliquip ex ea commodo consequat.

liber tempor cum soluta nobis eleifend

Duis autem vel eum iriure dolor in hen-

option congue nihil imperdiet doming

drerit in vulputate velit esse molestie

id quod mazim placerat facer possim

consequat, vel illum dolore eu feugiat

assum. Typi non habent claritatem

nulla facilisis at vero eros et accumsan

insitam; est usus legentis in iis qui facit

et iusto odio dignissim qui blandit

eorum claritatem. Investigationes

praesent luptatum zzril delenit augue

demonstraverunt lectores legere me

duis dolore te feugait nulla facilisi. Nam

lius quod ii legunt saepius. Claritas

27


Billeder Billeder på hjemmesiden skal have et bestemt udseende. De bør altid være runde og i størrelsen 100 X 100px. Billeder skal altid have relevans og må aldrig være urealistiske eller kunstige.

28


Knapper Knapper på hjemmesiden skal altid have et bestemt udseende. Herunder skal fonten altid være Lato Regular, 12pt i farven #f8f8f8. Yderligere skal knapper have en minimumstørrelse på 120 px og maks 150 px i bredden (til desktop/ laptop og tablet) og tilpasset hele skærmens bredde (til mobil).

Del nu!

Deltag nu!

Se resultat!

29


Desktop/laptop

30


Tablet

31


Mobil

32



Designmanual: Stop Tandlægeskræk