Designmanual. Versjon 1.0 Mai 2018

Designmanual Versjon 1.0 Mai 2018

Innhold Introduksjon Konsept Logo Fargepalett Typografi Illustrasjon 50 øre ikon Bildestil 3 4 6 16 19 25 28 30 Handelens Miljøfond Designmanual 1.0 Mai 2018 2

Introduksjon Norge skal innføre EUs emballasjedirektiv og krav om reduksjon av plastposer. I stedet for at det innføres en statlig avgift på bæreposene, tar handelen selv ansvar for å rydde opp. Det vil si at medlemmer av Handelens Miljøfond skal betale en medlemskontingent på 50 øre per plastbærepose. Midlene vil gå til miljøtiltak, herunder tiltak som bidrar til å redusere plastposebruken. For at Handelens Miljøfond skal kunne legge igjen et tydelig nok avtrykk, er det viktig at visuell identitet samsvarer med disse verdiene. Denne designmanualen er laget for å sikre at Handelens Miljøfond sin visuelle identitet er tydelig og konsekvent på alle profilbærere og kommunikasjonsflater. Alle som skal lage grafisk eller digitalt materiale for Handelens Miljøfond forplikter seg til å lese disse retningslinjene og sørge for at merkevaren alltid opptrer sammenhengende, gjenkjennelig og tydelig. Handelens Miljøfond Designmanual 1.0 Mai 2018 3

Konsept Handelens Miljøfond Designmanual 1.0 Mai 2018 4

Vekst og utvikling Konseptet omhandler vekst og utvikling. Når noe går ned, går noe annet opp. Dette økosystemet skal gi en effekt og den visuelle profilen er basert på dette konseptet. Fra mindre plastforsøpling, til bedre miljø. For å visuelt identifisere budskapet og målet til Handelens Miljøfond, er det viktig at vi bruker en universell utforming som skaper umiddelbare assosiasjoner til konseptet. Ved å kombinere de mest universelle ikonene ender vi opp med en unik logo som svarer på akkurat dette. Trygt og bærekraftig økosystem med internasjonale ambisjoner. Illustrasjon viser konseptutvikling løst visuelt. Verdi og Effekt Gjenvinning Miljøet Reduksjon av plastforsøpling Handelens Miljøfond Designmanual 1.0 Mai 2018 5

Logo Handelens Miljøfond sin primærlogo er merkevarens fremste signatur. Form og farge er med på å skape de riktige assosiasjonene til miljø og gjennvinningseffekten. Logo består av ikon og navnetrekk. Følgende sider viser retningslinjer for bruk. Ikon Navnetrekk Handelens Miljøfond Designmanual 1.0 Mai 2018 6

Primærlogo Primærlogoen representerer Handelens Miljøfonds verdier. Denne logoversjonen skal brukes så mye som mulig der det teknisk lar seg gjøre. Både digitalt eller på trykksak. Vi bruker både hvit logo på grønn bakgrunn og grønn logo på hvit bakgrunn like mye. Bruksområder: Alle profil- og kommunikasjonsflater der det er teknisk og regelmessig mulig. Grønn Primærlogo Grønn logo på hvit. De lyse pastellfargene fra profilens fargepalett fungerer også som bakgrunn. Grønn logo kan også plasseres over fotografi/ bilde som er lyst og gir god nok kontrast. Hvit Primærlogo Hvit logo på grønn fargebakgrunn. Hvit logo kan også plasseres over fotografi/ bilde som er mørke og gir god nok kontrast. Handelens Miljøfond Designmanual 1.0 Mai 2018 7

Sekundærlogo Der flater blir mer avlange og påvirker primærlogoens synlighet og størrelse, bruker vi den sekundære logoen. Dette for å utnytte flater på best mulig måte. Her er ikonet plassert på venstre side og navntrekk skrevet på én linje. Den fungerer på flater som krever en mindre, og avlang plass. Merk: Primærlogoen prioriteres alltid dersom det er mulig. Sekundærlogo brukes kun om primærlogo ikke fungerer godt nok på flaten, eller navnetrekket på primærlogo blir for liten. Grønn Sekundærlogo Grønn logo på hvit. De lyse fargene fra profilens fargepalett fungerer også som bakgrunn. Grønn logo kan også plasseres over fotografi/ bilde som er lyst og gir god nok kontrast. Bruksområder eksempler: - Flater som krever mindre plass - Topp logo mobil /responsiv - Avlang sponsorbanner - Nøkkelhalsbånd Hvit Sekundærlogo Hvit logo på grønn fargebakgrunn. Hvit logo kan også plasseres over fotografi/ bilde som er mørke og gir god nok kontrast. Handelens Miljøfond Designmanual 1.0 Mai 2018 8

Logoens farger Hvit logo på skogsgrønn flate Skogsgrønn logo på hvit flate flate Logoens farge er en viktig del av den visuelle profilen. Å ta eierskap i den skogsgrønne fargen er et viktig grep for å fremme assosiasjoner og verdier rundt frisk natur og gjenvinning. Det gir økt tilhørighet til modermerket jo mer grønt som benyttes. Handelens Miljøfond Grønn (PMS 3435 C) er en farge vi bruker primært på alle flater. Når det teknisk ikke er mulig å bruke farger, er det sort og hvitt som gjelder. Dette gjelder som regel i trykkeprosesser eller begrenset fargevalg som fax og printer. Dette gjelder Ikke digitalt. Disse fargeprinsippene gjelder også for sekundærlogo. C100 M0 Y68 K60 R0 G55 B26 #00371A Pantone 3435 C Svart logo på hvit flate (Når farger ikke er mulig) Hvit logo på Svart flate (Når farger ikke er mulig) C0 M0 Y0 K100 R0 G0 B0 #000000 C0 M0 Y0 K0 R255 G255 B255 #FFFFFF C R # Handelens Miljøfond Designmanual 1.0 Mai 2018 9

Støttefarger Varm sol Frisk skog Som bakgrunnsfarge. De lyse pastellfargene fra profilens fargepalett fungerer også som bakgrunn og harmonerer godt med den mørke grønne fargen. Dette kan gjøres så lenge vi bruker grønn logo. C38 M0 Y6 K0 R151 G210 B225 #97D2E1 Pantone 2975 C C0 M0 Y46 K0 R253 G245 B180 #FDF5B4 Pantone 100 C C0 M28 Y15 K0 R250 G205 B203 #FACDCB Pantone 699 C Lakserosa Havet C42 M0 Y33 K0 R159 G212 B182 #9FD4B6 Pantone 345 Handelens Miljøfond Designmanual 1.0 Mai 2018 10

Logo på foto Hvit logo på mørk bildebakgrunn Naturbilde som bakgrunnselement. Når man ikke vil bruke en solid fargebakgrunn på design eller kommunikasjonsflater, kan man benytte naturbilde i bakgrunnen. Handelens Miljøfond sin logo må alltid fremstå tydelig. Logo skal aldri opptre på forstyrrende bildebakgrunner. Vi bruker enten hvit eller skogsgrønn logo og husk alltid god kontrast. Se egne retninslinjer for fotostil på side 30. Grønn logo på lys bildebakgrunn 11

Minimumsstørrelse Størrelsene på logoene er definert ut ifra høyde. Retningslinjene for minste størrelser er til for alltid å sikre god lesbarhet av logo og navnetrekk. Oppsummert Print minimumstørrelse Primærlogo: minimum høyde 11mm Sekundærlogo: minimum høyde 7 mm Print minimumstørrelse Primærlogo Primærlogoen kan benyttes ned til 11 mm i høyden. Digitalt minimumstørrelse Primærlogo Primærlogoen kan benyttes ned til 90 px i høyden. Digital minimumstørrelse Primærlogo: minimum høyde 90 px Sekundærlogo: minimum høyde 60 px 11 mm 90 px Sekundærlogo Sekundærlogoen kan benyttes ned til 7 mm i høyden. Sekundærlogo Sekundærlogoen kan benyttes ned til 60 px i høyden. 60 px 7 mm Handelens Miljøfond Designmanual 1.0 Mai 2018 12

Sikker avstand For at logoen skal kunne fungere optimalt er det viktig at den har nok luft rundt seg. Både for digitalt bruk og i trykksaker. Ingen andre elementer skal plasseres innenfor denne avstanden. X Sikker avstand Regel Primærlogo Høyden av «H» definerer en sikker avstand. Sikker avstand kan reduseres dersom logoen skal brukes på svært små flater, altså i de tilfeller der den ville ha blitt for liten til å oppfattes tydelig. Man skal likevel alltid etterstrebe å ha så stor sikker avstand som mulig. X X X X Regel Sekundærlogo Høyden av «H» definerer en sikker avstand. Handelens Miljøfond Designmanual 1.0 Mai 2018 13

Sikker avstand eksempel Skjematisk eksempel viser plassering av logo på en enkel flate, med sikker avstand. For å ivareta god nok luft rundt logo er det viktig å ikke bryte disse prinsippene. Både på trykksaker og digitale flater er det alltid viktig at vi ikke plasserer logo for nære kanten. Eksemplet til høyre representerer en generell kommunikasjonsflate der en Handelens Miljøfond sin logo benyttes. Riktig Riktig Feil Luft Minimum Merk: Ikke bruk sikker sone-området som en egen logoform. Gjelder begge logovarianter. Luft Luft Riktig Feil Luft Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Eksempel Et grønt flagg Eksempel Et hvit omslag med en grønn logorektangel. Handelens Miljøfond Designmanual 1.0 Mai 2018 14

Vi vil ikke være... Det er viktig å ta hensyn til regler slik at den primære logoen ikke blir uklar eller rotete. Handelens Miljøfond sin logo krever sin tydelighet, luft og riktige farger for å ivareta retningslinjer. Merk: Samme regler gjelder for bruk av sekundærlogo. Ikke bruk en form rundt logo. Ikke bruk andre former som firkant eller sirkel rundt logo som påvirker utseende. Ikke sett annen farge på logo Ikke bruk andre farger enn logoens profilfarger; grønn eller hvit. Ikke bruk effekter på logo Logo skal alltid fremstå ren og tydelig. Legg aldri til effekter som f.eks. skygge bak logo. Ikke forandre på dimensjoner Ikke strekk, roter eller juster logoen på noen som helst måte. Logo skal alltid fremstå i sin originalitet. Ikke fjern deler av logo Det er ikke lov å fjerne deler av logoene Ikke flytt på elementer i logo Logoen skal alltid ha samme proporsjoner. Ikke plassér på rotete bakgrunn Plasser aldri logo på en bakgrunn som gir dårlig kontrast eller virker rotete. Ikke forstyrre logo Ikke plasser forstyrrende elementer i nærheten eller over logo. Benytt sikker avstand. Handelens Miljøfond Designmanual 1.0 Mai 2018 15

Fargepalett Handelens Miljøfond Designmanual 1.0 Mai 2018 16

Fargehierarki Skogsgrønn Renhet Tydelighet Havet Varm sol Lakserosa Frisk skog Av alle farger er det skogsgrønn som skal forbindes med Handelens Miljøfond. Grønnfargen skal gi assosiasjoner til friskhet, renhet, miljø og den norske naturen. Fargene skal være med på å styrke merkevaren. De er med på å skape gjenkjennelighet på alle de ulike kommunikasjonsflatene. Den grønne profilfargen brukes gjerne sammen med hvitt som gir en god kontrast. I tillegg bruker vi også pastellfarger for å legge til varme og positivitet. Som for eksempel bakgrunnsfarge. - Vi bruker også hvitt for å være rene i uttrykket. - Skogsgrønn brukes også til større tekster som for eksempel overskrifter, undertittel, ingress. - Svart farge brukes på brødtekstnivå for å være klare og tydelige. Ivareta god lesbarhet. Handelens Miljøfond Designmanual 1.0 Mai 2018 17

Fargepalett Teknisk fargebeskrivelse C0 M0 Y0 K0 R255 G255 B255 #FFFFFF C0 M0 Y0 K100 R0 G0 B0 #000000 C100 M0 Y68 K60 C0 M0 Y0 K100 R0 G55 B26 R0 G0 B0 #00371A #000000 Pantone 3435 C C38 M0 Y6 K0 C0 M0 Y46 K0 C0 M28 Y15 K0 C42 M0 Y33 K0 R151 G210 B225 R253 G245 B180 R250 G205 B203 R159 G212 B182 #97D2E1 #FDF5B4 #FACDCB #9FD4B6 Pantone 2975 C Pantone 100 C Pantone 699 C Pantone 345 Handelens Miljøfond Designmanual 1.0 Mai 2018 18

Typografi Handelens Miljøfond Designmanual 1.0 Mai 2018 19

Typografi Handelens Miljøfond sin profilfont heter Apercu, og består av en rekke gode typografiske kvaliteter med sin personlighet, lesbarhet og tidløshet. Handelens Miljøfond Designmanual 1.0 Mai 2018 20

Typografi Apercu er profilfonten til Handelens Miljøfond. Dette er en moderne Sans Serif-font fra 2010 med et vennlig, men distinkt uttrykk og en god lesbarhet i små størrelser, både digitalt og på trykk. Denne fontfamilien skal brukes på alle design og kommunikasjonsflater. På maskiner der font ikke fungerer eller ikke har blitt installert, er det Helvetica som erstatter Apercu. Regular ABCDEFGHIJKLMNOPQRSTUVWXYZÆØÅ abcdefghijklmnopqrstuvwxyzæøå 1234567890! #$%&/()=? Medium ABCDEFGHIJKLMNOPQRSTUVWXYZÆØÅ abcdefghijklmnopqrstuvwxyzæøå 1234567890! #$%&/()=? Bold ABCDEFGHIJKLMNOPQRSTUVWXYZÆØÅ abcdefghijklmnopqrstuvwxyzæøå 1234567890! #$%&/()=? Handelens Miljøfond Designmanual 1.0 Mai 2018 21

Typografi i bruk Overskrifter Bør stå i fontvekten bold, i små bokstaver. Handelen tar ansvar Underoverskrift Benyttes i fontvekten bold, og skal stå på egen linje. Pass på god nok størrelseskontrast i forhold til overskrift. Sammen skal vi redusere plastforsøplingen, øke plastgjenvinningen og redusere bruken av plastbæreposer. Brødtekst Skal stå i fontvekten regular. Kan benyttes både svart eller skogsgrønn farge. Til trykksak må brødtekst alltid være i svart, C:0 M:0 Y:0 K:100 Bli med på handelens store miljøsatsing, Handelens Miljøfond! Sammen skal vi redusere plastforsøplingen, øke plastgjenvinningen og redusere bruken av plastbæreposer. Medlemmer i Handelens Miljøfond betaler en kontingent på 50 øre per plastbærepose, som brukes til disse formålene. Oppstart er planlagt til begynnelsen av 2. kvartal 2018. Dersom tekst plasseres på et bilde eller en annen bakgrunnsfarge bør man ivareta kontrast og lesbarhet så mye som mulig. Handelens Miljøfond Designmanual 1.0 Mai 2018 22

Typografi og farger Både på printmateriell, brosjyrer eller i presentasjoner, bruker vi bakgrunnsfarger for å tilføye liv og lekenhet. Dette gjelder også for typografi. På hvite bakgrunner, eller på lyse bilder kan vi bruke skogsgrønn farge å teksten. Man kan også bruke en av pastellfargene på headinger for å gi det litt mer egenart. Husk: På trykksak/offset, for eksempel annonse på trykk, bruker vi alltid svart farge på brødtekst. Dette for å unngå misspass. CMYK verdier: C:0 M:0 Y:0 K:100 En introduksjonstekst som kan være kort eller lang. Bør gå over maks 4 linjer tekst. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tittel på presentasjon Side A

Typografi teknisk spesifikasjon Riktig bruk av typografi er viktig for å sikre både lesbarhet og den visuelle stilen. Sperring, linjeavstand og fontstørrelser må hensyntas på alle flater for at opplevelsen skal passe både den visuelle profilen og Handelens Mijøfond sin måte å prate på. Vi bruker store initialer og små bokstaver hver gang vi skriver Handelens Miljøfond. Slik skrives den også i logo. Handelen tar ansvar Vokabular For å holde en nedpå tone og være tydelige, beholder vi all kommunikasjon hovedsakelig i minuskler. Vi er ikke skrikete. Profilen følger norsk grammatikk som vanlig og egennavn starter alltid med stor bokstav. Vi forsøker å bruke språket kort og enkelt i og ikke overforklarende. Sperring Lesbarhet er en viktig del på alle flater og Handelens Miljøfond er alltid tydelig i kommunikasjonen. I all brødtekst og mengdetekst bruker vi den automatiserte sperreverdien null. (0) Linjeavstand Spesielt i løpende tekst er det viktig å ha stor nok luft mellom linjene. Apercu sin autofunksjon gjelder også her, og denne brukes på både brødtekst men også større budskap med større fonter som går over flere linjer. Handelens Miljøfond Designmanual 1.0 Mai 2018 24

Illustrasjon Handelens Miljøfond Designmanual 1.0 Mai 2018 25

Illustrasjoner Man kan bruke det man har for å skape nye verdier. Illustrasjonene er bygget opp av 4 elementer fra logoen og er formet som ulike elementer fra naturen som dyr, planter og fauna. De representerer effekten av gjenvinning og skal vekke assosiasjoner rundt naturen og miljøvern. Illustrasjonenes oppgave er å gi profilen en sjarmerende personlighet. Merk: Her er det mulighetsrom for å utvikle flere ikoner og bruke illustrasjonene til historiefortelling. For eksempel en kort film eller snutter for både sosiale media eller presentasjoner. Lundefugl Fugl Bjørn Laks Pingvin Plante Mulighetsrom Handelens Miljøfond Designmanual 1.0 Mai 2018 26

Illustrasjoner i bruk Illustrasjoner skal skape liv og sjarm. Vi bruker illustrasjoner for å gjøre det litt mindre uformelt (corporate) og vennligere. Pastellfarger kan også brukes. Digitale flater På webside er det dedikert plass for noen illustrasjoner som en del av bakgrunnen. Vi bruker dem ikke for mye da det kan bli for rotete og forstyrrende. Vi kan være lekne men ikke for barnslige. Printmateriale - Omslag - Plakat - Annonser Animasjon av illustrasjoner - Historiefortelling - Kommunikasjon - Informativt Digitalt / redaksjonelt - Illustrative innslag - Skape liv Handelens Miljøfond Designmanual 1.0 Mai 2018 27

50 øre ikon Handelens Miljøfond Designmanual 1.0 Mai 2018 28

50 øre ikon Dette ikonet er konstruert utifra den originale logoikonet. 50 øre er en spesialdesignet font som harmonerer optimalt i ikonet. Vi bruker dette ikonet når vi skal kommunisere 50 øre. Ikonet skal alltid stå i nærheten av Handelens Miljøfond sin logo. Handelens Miljøfond Designmanual 1.0 Mai 2018 29

Bildestil Handelens Miljøfond Designmanual 1.0 Mai 2018 30

Bildestil Fotografi er et viktig virkemiddel for å kommunisere innhold og skape en sterk gjenkjennbar identitet. En konsekvent bildestil er avgjørende for å skape en tydelig visuell identitet. Bildebruken skal kommunisere en vakker, men rå og ekte natur som gir positive assosiasjoner. Dyr og mennesker kan også være med, så lenge naturen spiller en tydelig rolle i motivet. Bildene skal vise det vi skal verne og målet i seg selv; en plastfri natur. Bilder som passer denne beskrivelsen, henter vi gratis på: unsplash.com Handelens Miljøfond Designmanual 1.0 Mai 2018

Versjon 1.0 Mai 2018 Kontaktinfo post@handelensmiljofond.no