Berg-Hansen

Designmanual

Sist oppdatert:

22.oktober 2024

1.0

Logo

2.0

Profilfarger

3.0

Typografi

4.0

Bilder og film

5.0

Ikoner

6.0

Grafisk elementer

7.0

Sosiale medier

8.0

Universell utforming

9.0

Tone of voice

10.0

Nedlastning

1.0

Logo

1.1

Symbol

Symbol-logo («kula») skal kun brukes i de tilfellene hvor arealet er liten eller når hovedlogoen ikke kan brukes. Eksempel for hvor denne skal brukes er på profilbilde i sosiale medier, footeren på nettsidene og i appen.

1.2

Variasjoner

Det er to versjoner av logoen, for å optimalisere hvordan vi presentere merkevaren vår i forskjellig formater.

Den horisontale logoen er hovedlogoen vår. Symbolet brukes kun der det ikke er plass til hovedlogoen. Ved bruk av Symbolet må hovedlogoen framkomme på et tidspunkt slik at det er tydelig hvem som er avsenderen. Eksempel på dette er i Power Point malene, eller i en slutt vignet for film. 

1.3

Fargevariasjoner

Førstevalg av logo er alltid farget symbol med Berg-Hansen i sort tekst. Deretter er andre valget  farget symbol med hvit tekst. Nestevalget er deretter hel hvit logo. Helt sort logo (både emblem og tekst) skal kun brukes hvis hverken farget eller hvit logo fungerer. 

1.4

Feilbruk

Logotypen skal ikke endres på noen måte og skal alltid følge retningslinjen.

Følgende eksempler viser hva som ikke er mulig å gjøre med logoen. 

Endre form og/eller farge

Lage mønster med logoen

Legge til forettningsområdet

Plassere logoen skrått

1.5

Luft rundt logo

Logoen skal alltid plasseres i en fremtredende posisjon slik at den vises tydelig. Rundt logoen skal det alltid være nok luft til å sikre et rent og oversiktlig visuelt bilde. 

Riktig mengde luft beregnes ved hjelp av logosymbolet, kulen. Som vist her. 

Formatene EPS, AI, PNG, PDF, JPG og AI er lagret med dette luftrommet rundt logoen. 

1.6

Bakgrunn

Det er viktig at logoen alltid har tilstrekkelig kontrast til bakgrunnen. 

Se kontrastsjekke her for hjelp til å måle kontrastnivå.

1.7

Plassering

Når du benytter logoen må den plassers riktig ut fra hvilke kanal den plasseres i. Som hovedregel skal logoen plasseres inntil et hjørne. Det er aldri lov å plassere den fritt på flaten.

Topp venstre: kun for nettsider.

Topp høyre: Word, Power Point, film og markedsføringsmateriale.

Midten: markedsmateriell og film.

Bunn venstre: kun for nettsider.

Bunn høyre: kun for markedsmateriell.

1.8

Nettsider

På nettsidene skal logoen plasseres i header og footer på venstre side. På nettsiden benyttes helfarge logoen som er hovedlogoen og symbollogo. 

1.9

Annonser

På annonsen skal hovedlogoen alltid plassers i høyre hjørne på bunnen.

For bestilling: Fyll du ut vedalgt bestillingskjema og send til kommunikasjon@berg-hansen.no

1.10

Word og PowerPoint dokument

I Word dokumenter skal hovedlogoen stå i topp høyre hjørne. 

For ansatte ligger Word-mal med riktig plassering av logo i Microsoft Office 365.

1.11

Film

Alle filmer skal ha en sluttplakat med hovedlogoen. Logoen skal plasseres i midten av skjermen. Symbollogoen skal alltid plasseres i topp høyre hjørne igjennom filmen dersom denne skal benyttes. 

Vi tekster film hvor det er dialog. Det er et krav i sosiale medier. 

1.12

Bevegelig logo

Ta kontakt med kommunikasjon@berg-hansen.no for bruk av bevegelig logo.

1.13

Samarbeidspartnere

Plassering av samarbeidspartner sin logo skal ha et emblem avstand til «Berg-Hansen»-logoen. Den skal plasseres til venstre for Berg-Hansen logoen. 

Ved bruk av logoene til flere samarbeidspartnere skal et halvt logosymbol benyttes for å justere avstanden mellom logoene. Høyden for samarbeidslogoen skal ikke overstige 75% av høyden til Berg-Hansen logoen.

1.14

Meeting & Events

Meetings & Events-logoen er kun for bruk i presentasjoner, arbeidsklær og annet relevant crew-materiell. Logoen benyttes ikke eksternt utover presentasjoner. 

luft

Logoen skal alltid plasseres i en fremtredende posisjon slik at den vises tydelig. Rundt logoen skal det alltid være nok luft til å sikre et rent og oversiktlig visuelt bilde. 

Riktig mengde luft beregnes ved hjelp av bokstaven «M». Som vist her. 

Formatene EPS, AI, PNG, PDF, JPG og AI er lagret med dette luftrommet rundt logoen. 

Hvordan bruke logoen

Ved bruk av Meetings & Events logoen må Berg-Hansen fremstå tydelig som avsender. Dermed må man enten vise logoen sammen med Berg-Hansen på samme flate, eller kun vise Berg-Hansen sin logo på et tidspunkt. 

Skriften i de to logoen skal alltid ha samme farge dersom de dukker opp på samme flate. Dermed skal de begge to enten ha hvit tekst eller svart tekst. 

Skriftstørrelse på logoene skal være lik da det ikke skal være noen fokusforskjell når de dukker opp på samme flate. Avstanden  mellom logoene skal være en «Berg-Hansen logo»-avstand. Illustret til høyre. Ved bruk av Meeting & Events logoen skal Berg-Hansen sin logo alltid være plassert på samme flate. 

Feilbruk av logo

Meetings & Events-logoen kan kun benyttes i svart eller hvit. Den skal følge de samme reglene som hovedlogoen i forhold til bakgrunn og feil bruk. Meetings & Events-logoen skal ikke brukes for mye, og bør derfor ikke plasseres på alle sidene i en presentasjon, for eksempel. 

Ikke plasser M&E logoen og Berg-Hansen sin logo for tett under hverandre. Dette framstår som en egen ny logo. Dette er ikke tillatt å bruke logoen slikt. Se bilde til høyre for illustrasjon.

2.0

Profilfarger

Berg-Hansen blå er vår primærfarge og skal være fremtredende i alle flater der farge brukes. Fargen skal alltid være til stede når Berg-Hansen er avsender, enten som bakgrunnsfarge på mindre flater eller for å fremheve viktige elementer, som en Call to action.

Der det er mulig, bruker vi mørk blå i stedet for sort for å styrke det visuelle uttrykket vårt.

2.1

Fargene våres

2.2

Vektlegges

Bildet til venster visualiseres hvordan fargene skal vektes i alle flatene. Det er Berg-Hansen blå som skal være den fargen som er brukt mest på en flate i mostestning til de andre tre fargene.

2.3

Feilbruk

Fargekomboer som ikke er tillat på tekst (i alle størrelser):

• Lys blå & Turkis

• Mørk blå & Berg-Hansen blå

2.4

Farger til digital bruk

På digitale flater har vi behov for flere skarpere fargenyanser. 

Se Figma for en mer utdypende designmanual.

2.5

Kontraster

All fargebruk i Berg-Hansen skal til enhver tid oppfylle kravene til universell utforming basert på EU-standarden WCAG 2.0. Som hovedregel skal vi alltid etterstrebe at komposisjoner oppfyller middels kontrastnivå (AA).

Les mer om universell utforming

3.0

Typografi

Vi skal kun benytte fontene "Inter" på all material som produseres i Berg-Hansen.

Denne fontene er utviklet til bruk på dataskjermer med søkelys  på god lesbarhet. Denne fonten fungere også godt i små tekststørrelse og har en stor variasjon av forskjellige vekter og stiler. Det er en allsidig font som støtter en rekke språk. I tillegg er den tilgjengelig under SIL Open Font License, noe som betyr at den er gratis for både personlig og kommersiell bruk. 

Inter: Brukes til all materiell. 

Aptos: Kun til bruk i e-post kommunikasjon.

Apex New: Kun bruk i logo. 

3.1

Feilbruk 

Følgene punkter er ikke tillatt å gjøre:  

• Ikke bruk kun caps lock (store bokstaver).

• Skrifttypen skal ikke skyggelegges eller ha andre effekter.

3.2

Bruk og plassering 

Følgene punkter skal følges for all typografi:

• Teksten skal alltid være lesbar.

• Farge på brødtekst: mørkeblå, lyseblå, svart og hvit. 

• Undertittel og tittel skal ha forskjellige farger.

• Undertittel skal være 70% av størresen til tittelen.

Forsøk å bruke mørk blå/lys blå på brødtekst hvor mulig. Skaper et mer helhetlig uttrykk som er snillere for øynene.

3.3

E-post signatur

For all e-postsignaturer og kommunikasjon via e-post skal erstatningsfonten Aptos benyttes. Denne fonten skal kun brukes til e-post og ikke til andre formål. Innholdet i 

e-postsignaturen bestemmes basert på informasjonen som finnes på «Min side», og vil derfor variere avhengig av ansettelsessted.

4.0

Bilder og film

Vi bruker bilder/filmer som folk kan kjenne seg igjen i på reiser, møter, konferanser og arrangementer. Det betyr at vi fokuserer på:

Ekte mennesker og situasjoner 

Velg bilder/filmer som inneholder ekte mennesker i autentiske situasjoner. Unngå sterkt stagede eller overdrevne bilder. La ansikter og kroppsspråk formidle ekte følelser og relasjonene mellom mennesker.

Uforglemmelige øyeblikk

Velg bilder/filmer som fanger øyeblikk av møter mellom mennesker, latter og jublende øyeblikk. Dette innebærer også øyeblikk på gruppereiser eller fra scenen på arrangementer. Sørg for å bruke naturlig lys, eller blits som gjør at lyset fremstår naturlig. Unngå oppstilte bilder med sterk blits og kalde toner.

Teknologiske løsninger

Teknologiske løsninger som brukes i ekte situasjoner av mennesker som gjør reisen/arrangementet enklere. Dette kan vises gjennom bilder av mennesker på farten som sjekker app på telefonen eller interaksjoner mellom mennesker på arrangementer som registreres via teknologiske løsninger. 

Destinasjoner og transportmidler 

Bildene/filmene skal på en eller annen måte formidle at vi er tilbydere av reiser, møter, konferanser og arrangementer. Dette innebærer bilder av destinasjoner, situasjoner i små og store møte- og konferanselokaler, på arrangementer og ulike transportmidler som fly, tog, båt og bil. 

4.1

Riktig bruk

Bildene/filmene våre skal formidle ekte øyeblikk fra med ekte følelser og mennesker. Unngå oppstilte eller stagede
bilder/filmer.

Vi etterstreber at bildene/filmer skal se mer sjarmerende ut enn profesjonelle. Mer fokus på at bildene/filmene er godt sett, enn imponerende teknisk. 

Mennsker

Varme bilder

Stemingsfullt

4.2

Feilbruk

Unngå å retusjere bort mindre ufullkommenheter, med mindre det er svært distraherende. 

Unngå bruk av AI-genererte-bilder/filmer med mindre det er en tydelig del av konseptet eller fremstillingen. 

Kalde bilder

Oppstilt bilder

Alkohol/vinglass

Ai-generet

Overredigert

Folketomt

4.3

Våre bilder

Dersom du skulle trenge bilder finner du dette i bildebanken vår på SharePoint. Alle bildene her kan bennytes både internt og eksternt. 

Dersom du trenger nye bilder kan vi være behjelpelig til å ta nye bilder. Eller så kan du finne gratisbilder her 

• Pexels

• Unsplash

Vi har også muligheter til å skaffe lisenser på bilder fra Adobe Stock.

Grunnet opphavsrett er det ikke lov å hente bildder fra søkemotororer som Google ol.

4.4

Musikk i film

Det er viktig å være bevisst i valg av musikk til bruk i film. Musikkvalget skal støtte opp under filmens budskap, og takt/tone skal være i tråd med innholdet i filmen. På video med intervjuer eller mennesker som prater, skal det benyttes instrumental musikk. Velg musikk som bidrar til å skape entusiasme og positiv energi, gjerne innen sjangerne Pop eller Rock.

4.5

Grafikk i film

Grafikk skal kun brukes dersom det styrker budskapet i videoen eller gir nyttig informasjon som ikke kan formidles på annen måte, for eksempel navn på personer som intervjues eller steder som vises. 

Berg-Hansens logo skal alltid være synlig for å tydeliggjøre hvem som er avsenderen av videoen. Logoen skal alltid stå i høyre hjørne, og det skal i tillegg være en sluttplakat med hovedlogoen som plasseres i midten av skjermen. Farger og skrifttyper skal følge designmanualen.

4.6

Teksting i film

Alle forhåndsinnspilte videoer produsert av Berg-Hansen skal tekstes i henhold til retningslinjene fra WCAG 2.1. Det betyr at alt som blir sagt eller viktig informasjon skal fremkomme som undertekst i filmen. Lydeffekter som er relevante for handlingen skal også fremkomme i teksten. Tekst som allerede vises på skjermen, som for eksempel kulepunkter eller på en presentasjon, trenger ikke å tekstes i tillegg dersom informasjonen blir gjengitt i tale. 

Teksting skal ha maksimalt to linjer og samsvare med det som blir sagt. Undertekst skal være i skrifttypen Inter med hvit tekst og svart omrisse. 

For å lese mer om rettninglinjene fra WCAG 2.1 kan du se på følgende punkter:

• 1.2.1 Bare lyd og bare video

• 1.2.2 Teksting (forhåndsinnspilt) (Nivå A)

4.7

Egne bilder

Bruk mobilen når du er tilstede på arrangementer, møter, konferanser, studieturer o.l. for å ta bilder og video. ​

Hold telefonen stående. Dette formatet egner seg best for sosiale medier. Du trenger ikke redigere bildene - det kan vi hjelpe deg med hvis bildet trenger redigering.

Til alle med Iphone: Gå til «Innstillinger» —> «Kamera» —> «Formater» —> Huk av «Mest kompitabelt». Da blir bildene «JPG» og ikke HEIC. Heic-filer kan ikke leses av Microsoft (RDS)

4.8

Filming til sosiale medier

Bruk kameraet på telefonen for å filme, ikke apper som Snapchat o.l. Vi ønsker ikke videoklipp med filter, klistremerker eller musikk som er lagt på i ettertid.

Hold telefonen stående (og helst i ro) når du filmer. Du kan bevege deg sakte, men unngå raske bevegelser som å snurre telefonen rundt.

Film korte snutter på 5-10 sekunder, gjerne samme motiv fra forskjellige vinkler.

5.0

Ikoner

Et ikon er et symbol som har en likhet med objektet det representerer. Generelt brukes ikoner til å kommunisere informasjon uten behov for ord. Ikoner skal kun brukes i digitale tjenester.

Vi bruker ikonene fra Google. Hele biblioteket er i utgangspunktet lov å bruke, men det skal grundig vurderes om man skal inkludere ett nytt ikon fra biblioteket til nettsidene. Dersom det er behov for et nytt ikon utover det som finnes på Google, har Google en guide som beskriver hvordan man skal lage ikoner. Dersom det lages et nytt ikon må ikonet bruketestet før det tas i bruk. 

Ikoner kan være i fargene blå, turkis, sort og hvit.

5.1

Størrelse

Til digitalt bruk er det kun lov med størrelsene: 12px, 16px, 20px, 24px, 32px, 48px og 65px.

Ikke bruk ikoner fra andre bibliotek

Ikke endre tykkelse

Ikke bruk andre farger enn spesifisert i designmanual

6.0

Grafiske elementer

Implementeringen av sirkler som designelement i vår visuelle identitet er et valg som bygger på både praktiske og estetiske hensyn. Sirkelen stammer direkte fra vår logo, og representerer verdier som reise, bærekraft og jorden – sentrale temaer i Berg-Hansen sin merkevare.

I tillegg til symbolikken gir sirkelen en visuell enkelhet som er både gjenkjennelig og fleksibel i ulike flater. Sammenlignet med tidligere bruk av heksagoner, er sirkler enklere å anvende og tilpasse i ulike sammenhenger, både i digitalt og trykt materiell. 

6.1

Bruk og plassering 

Sirkelen gir mulighet for å integrere både bilder og tekst på en lesbar og konsistent måte, forutsatt at det er godt begrunnet og visuelt i tråd med vårt helhetlige uttrykk. Denne fleksibiliteten åpner for kreativitet, samtidig som den sikrer et enhetlig merkevareuttrykk.

6.2

Feil bruk

All tekst inni sirkler skal være lesbar. Ikke press inn masse tekst dersom det ikke egner seg.

Dersom bilder skal plasseres inni sirkler, må sirklene være stor nok til at det ikke blir utydelig eller rotete.

Det er lov å ikke bruke sirkler. 

7.0

Sosiale medier

På Instagram står vi ikke fritt til å benytte de farger og skrifttyper vi ønsker. Benytt egne retningslinjer for sosiale medier. 

Retningslinjer sosiale medier.pptx 

For spørsmål kontakt: kommunikasjon@berg-hansen.no

8.0

Universell utforming

Universell utforming handler kort sagt om design for alle! Alt vi gjør i Berg-Hansen skal tilgjengeliggjøres for alle type mennesker, uansett behov. Dette er noe vi stadig jobber med for å forbedre.

8.1

For utviklere

All HTML må være semantisk. Les mer om semantisk HTML.

Brukeren må kunne navigere med tastatur, med fokus på relevante objekter. Gode beskrivende alt-tekster og korrekte aria-labels, tilrettelagt for skjermlesere. Alt skal utvikles responsivt, slik at innholdet passer alle flater. Brukere må kunne overstyre tekststørrelse. Interaktive elementer må ha tilstrekkelig trykkflater.

8.2

Nyttige verktøy

WCAG standaren

Skjermlesere

Google Lighthouse (Web)

Contrast checker

Webaim Wave (Web)

Captions (teksting)

Capcut (teksting)

W3C-HTML (Validering av HTML)

W3C-CSS (validering av CSS)

9.0

Tone of Voice

Berg-Hansens tone of voice beskriver følelsene vi ønsker å uttrykke og formidle i ord, bilder og layout. Alt vi sier og gjør formidler en følelse og gir en opplevelse – fra hvordan vi formulerer våre tekster og utformer våre publikasjoner til måten vi oppfører oss på. Stemmen vår skal beskrive følelsen vi ønsker å skape og den tar utgangspunkt i tre temaer:

Visjon

Vi skal bli uunnværlige for alle reisende.

Misjon

Vi forstår kundenes behov og bruker vår kompetanse, brukervennlige tjenester og unike nettverk til å levere den desidert beste løsningen for kunden.

Posisjon

Å benytte seg av Berg-Hansen er lurt, lett og lønnsomt.

Personlig

Vi ønsker å vise at vi brenner for det vi gjør. I det så ligger det også å bli oppfattet som uformelle og engasjerte. Dette reflekteres i både måten vi kommuniserer, og i hvilken type bilder vi bruker.

Hva det er:

Å vise interesse i kunden

Å ha en uformell tone

Å ha en varm bildestil

Hva det ikke er:

Å bare kommunisere en vei (enveiskommunikasjon)

Å ha en formell og høytidelig tone

Å skape distanse gjennom bildebruk

Uredd

Vi ønsker å bli oppfattet som uredde gjennom å vise mot og handlekraft. Handlekraften skal være med en positiv «drive». Det betyr at vi skal fokusere på det positive og ikke det negative.

Hva det er:

Å være direkte i tonen

Å være tilgjengelig

Å tørre å anbefale

Hva det ikke er:

Å være utydelig

Å være negativ

Å skjule noe

Nytenkende

Vi ønsker å bli oppfattet som nytenkende og innovative og dette reflekteres i alt fra våre tekniske løsninger, tips vi gir kunden til hvilke typer bilder vi bruker.

Hva det er:

Å tenke positivt

Å ligge i forkant

Å tenke annerledes

Hva det ikke er:

Å være traust

Å være tradisjonell

Å henge etter

Våre verdier

Ansvarlig

Vi er til å stole på.

Personlig

Vi brenner for det vi gjør.

Nytenkende

Vi går foran.

Uredd

Vi viser mot og handlekraft.

10.1

Logo

Dersom du trenger logoen til Berg-Hansen finner du den her. Det er viktig å lese igjennom rettninglinnjer for logobruk når du skal bruke denne logoen.

10.2

Bestillingskjema

Dersom du skal kontakte oss i Kommunikasjons og markedsførings avdelingen for bestilling kan du benytte bestillingskjamet.  Dette sender du til oss på e-post:

kommunikasjon@berg-hansen.no