Designguide
- Vedtaget: godkendt af direktørgruppen den 3. marts 2020
- Opdateret: den 21. juni 2022
Formål og Indhold
Designguidens formål
Designguiden indeholder nogle grafiske grundelementer og et designsystem, som har til formål at sikre, at Aalborg Kommunes visuelle tilstedeværelse altid er konsekvent og genkendelig på tværs af platforme. Denne guide forklarer og eksemplificerer brugen af den visuelle identitet.
Aalborg Kommunes kommunikationspolitik
Den visuelle identitet understøtter Aalborg Kommunes kommunikationspolitik, som bygger på de tre nøgleord:
Genkendelig, tilgængelig og forståelig.
Hvem er guiden til for?
Designguiden henvender sig til alle, der skal arbejde med Aalborg Kommunes visuelle identitet på tværs af publikationer, platforme, projekter og målgrupper
Fem grundelementer
Identiteten er en videreudvikling af Aalborg Kommunes designlinje der hviler på fem grundelementer og skalerbare designprincipper, der vedrører logo, typografi, farver, billeder og grafisk grid.
Enkle designprincipper
Der er lagt vægt på enkle designprincipper, så den visuelle identitet er nem at bruge for alle, der skal arbejde med den.
En skalerbar visuel kommunikation
Aalborg Kommunes visuelle identitet består af en grafisk værktøjskasse, der har til formål at skabe en skalerbar visuel kommunikation.
Værktøjskassen rummer elementer, der kan skaleres fra et ’minimum’, hvor der kun indgår logo, primærfarver og typografi, og til et ’maksimum’, hvor alle grafiske elementer tages i brug - alt efter behov. Man kan således skalere fra at være en myndighed (minimum brug) til at have specifikke kampagner (maksimum brug).
Logo
Aalborg Kommunes logo består af:
- Bomærket: Aalborg-mønten med byvåbnet
- Navnetrækket: Aalborg Kommune
- Kan suppleres med en byline:”Vi udvikler os sammen”
Aalborg Kommunes logo er en vigtig del af den visuelle identitet. Aalborg-mønten har i kraft af byvåbnet en særlig identitetsskabende rolle i forhold til at positionere Aalborg Kommune som en myndighed.
Logoet må kun gengives som defineret i de originale filer og aldrig skrives eller opstilles på anden vis.
Størrelsesforhold og afstande er nøje afstemt, og det er derfor ikke tilladt at justere, rotere eller på andre måde ændre logoets form eller proportioner.
Navnetræk
Aalborg Kommunes navnetræk er specialtegnet med udgangspunkt i typografien Alright Sans. Når man bruger navnetrækket i en logo-funktion, for eksempel på brevpapir eller i præsentationer, skal det bruges som det ser ud i de originale filer. Der må naturligvis gerne stå Aalborg Kommune i en linje, når det skrives som en del af en overskrift eller brødtekst.
Aalborg-mønten
Bomærket i Aalborg Kommunes logo er en mønt med byvåbnet inden i, og det skal altid bruges med den runde baggrund.
Aalborg-mønten er Aalborg Kommunes visuelle markør, og det må derfor aldrig stilles i direkte forbindelse med service-, institutions- eller forvaltningsnavn.
Byvåbnet skal altid bruges som mønt, og må ikke adskilles. Byvåbnet må ikke bruges som vandmærke. Der er flere muligheder for farvebrug, hvilket man kan læse om i afsnittet om farver.
Aalborg-mønten er strammet op og rentegnet i forbindelse med denne nye version af designlinjen. I forbindelse med, at der skal laves nye layouts, eller gammelt materiale skal fornyes, så vær opmærksom på at bruge den nye version af Aalborg-mønten.
Versioner af Aalborg-mønten
Aalborg-mønten kan bruges i to grundversioner - helt afhængigt af designbehov:
- Aalborg-mønt med transparent baggrund
- Aalborg-mønt med massiv baggrund
Når Aalborg-mønten og logo bruges adskilt fra hinanden gælder der følgende guideline: - Størrelsesforholdet mellem Aalborg-mønt og navnetræk skal ikke følges ad - der må godt være størrelsesforskel alt efter behov.
Størrelse
Logoets størrelse skal altid vurderes i forhold til resten af layoutet og formatet.
For at få et ensartet udtryk, angives nedenfor konkrete mål på de mest gængse trykte
formater som A6, A5, A4 og A3, der kan bruges som guideline:
- A6 - 25 mm bred
- A5 - 35 mm bred
- A4 - 45 mm bred
- A3 - 55 mm bred
For at sikre logoets læsbarhed er der nedenfor angivet en minimumstørrelse i pixels og millimeter.
Minimumstørrelse på logo:
- 25 mm i bredden i print
- 80px i bredden på web
Placering af logo
Aalborg Kommunes logo skal altid omgives af den angivne respektafstand.
Respektafstanden er lig med A, som er størrelsen på A’et i logoet
Adskilt placering
Aalborg-mønten kan fritstilles - tages væk fra den faste opstilling med navnetrækket.
Aalborg-mønt og navnetræk skal altid være synlig på samme flade og det skal altid fremtræde klart og tydeligt i forhold til baggrund.
Respektafstand
Aalborg-mønten kan placeres, hvor man vil i layoutet, men den skal have en minimum afstand til kanten, der svarer til 1/4 af Aalborgmøntens højde/bredde.
Beskæring af Aalborg-mønten
Aalborg-mønten må godt beskæres. Beskæringen må dog kun ligge indenfor selve mønten, og udenom den indvendige grafik.
Eksempel: Placering når Aalborg-mønt og navnetræk er adskilt
Logoet i farver
Logoets farve og baggrund skal altid bruges i henhold til de guidelines, der er opstillet i afsnittet om farver (se afsnit om farvebrug).
Aalborg-mønten og navnetræk må gerne optræde i hver deres farve, men kun, når de bruges adskilt.
Til højre ses et udsnit af logoet i forskellige farvekombinationer, samt et eksempel på forskelligfarvet Aalborg-mønt og navnetræk.
Farver
Farver med følelser
Aalborg Kommunes farvepalette er designet med udgangspunkt i behovet for at kommunikere bredt og differentieret. I udviklingen af farvepaletten er der taget udgangspunkt i positive følelser, som kan bruges til at understøtte budskabet.
Farverne er udvalgt, så de lever op til kravene om webtilgængelighed.
Farverne skal så vidt som muligt bruges i 100%, men hvis der er behov for det, kan farverne også bruges i henholdsvis 20%, 40%, 60% og 80% farvemætning.
Bemærk desuden at Pantone, CMYK, RGB og HEX-værdierne alle er optimerede til hver sin platform og at de ikke må bruges i andre værdier.
Primær Blå
Seriøsitet
Pantone 288
CMYK: 100, 75, 0, 45
RGB: 20, 25, 105
HEX: 141969
Opacitet 80% hex: 434787, Opacitet 60% hex: 7275a5, Opacitet 40% hex: a1a3c3, Opacitet 20% hex: d0d1e1
Primær Hvid
Klarhed
Pantone 000
CMYK: 0, 0, 0, 0
RGB: 255, 255, 255
HEX: ffffff
Sekundær Pink
Energi
Pantone 214
CMYK: 9, 97, 33, 2
RGB: 214, 28, 100
HEX: d61c64
Opacitet 80% hex: de4983, opacitet 60% hex: e677a2, opacitet 40% hex: efa4c1, opacitet 20% hex: f7d2e0
Sekundær Orange
Nysgerrighed
Pantone 158
CMYK: 0, 66, 88, 0
RGB: 238, 112, 39
HEX: ee7027
Opacitet 80% hex: f18d52, opacitet 60% hex: ee7027, opacitet 40% hex: f8c6a9, opacitet 20% hex: fce2d4
Sekundær Turkis
Kontrol
Pantone 333
CMYK: 60, 0, 40, 0
RGB: 92, 196, 183
HEX: 5cc4b7
Opacitet 80% hex: 7ddoc5, opacitet 60% hex: 9ddcd4, opacitet 40% hex: 5cc4b7, opacitet 20% hex: def3f1
Sekundær Gul
Glæde
Pantone 113
CMYK: 2, 9, 80, 0
RGB: 255, 224, 73
HEX: ffe049
Opacitet 80% hex: ffe66d, opacitet 60% hex: ffec92, opacitet 40% hex: fff3b6, opacitet 20% hex: fff9db
Sekundær Grøn
Tryghed
Pantone 553
CMYK: 80, 40, 70, 55
RGB: 34, 68, 48
HEX: 224430
Opacitet 80% hex: 4e6959, opacitet 60% hex: 7a8f83, opacitet 40% hex: a6b4ac, opacitet 20% hex: d3dad6
Sekundær Brun
Ro
Pantone 462
CMYK: 48, 67, 83, 72
RGB: 66, 42, 20
HEX: 422a14
Opacitet 80% hex: 685543, opacitet 60% hex: 8e7f72, opacitet 40% hex: b3aaa1, opacitet hex: d9d4d0
Sekundær Lyserød
Afslappethed
Pantone 705
CMYK: 2, 12, 0, 0
RGB: 252, 234, 251
HEX: fceafb
Opacitet 80% hex: fdeefc, opacitet 60% hex: fdf2fd, opacitet 40% hex: fef7fd, opacitet 20% hex: fefbfe
Sekundær Lilla
Ambitioner
Pantone 7678
CMYK: 70, 80, 0, 0
RGB: 110, 70, 160
HEX: 6e46a0
Opacitet 80% hex: 8b6bb3, opacitet 60% hex: a890c6, opacitet 40% hex: c5b5d9, opacitet 20% hex: e2daec
Primær og sekundære farver
Et konsekvent farvebrug er afgørende for en genkendelig og sammenhængende identitet på tværs af publikationer, afsendere og platforme. Alt design skal derfor gøre brug af farvepaletten som indeholder:
- Primære farver
- Sekundære farver
Der skal altid være en af primærfarverne tilstede i et layout.
Brug maksimalt 3 farver i alt
De mange farver giver mange kombinationsmuligheder. Dette kræver nogle simple regler, der skal følges, for at sikre funktion og genkendelighed på tværs af platforme.
- Brug altid mindst én primærfarve
- Brug maksimalt 3 farver på én flade
Farvernes kombinationsmuligheder er følgende:
- 1 primær + 1 sekundær
- 1 primær + 2 sekundære
- 2 primære + 1 sekundær
Dette gælder ved enkelte flader. Er der tale om et flersidet layout må der gerne bruges flere farver.
Farver og webtilgængelighed
Med lovkravet om tilgængelighed (WCAG 2.1) er det vigtigt at være særligt opmærksom på at bruge farver der har det rette kontrastforhold, som tilgodeser farveblinde eller svagtseende. Dette gælder alle offentlige websites og andet digitalt indhold som uploades på internettet.
Webtilgængelighedskravet er inddelt i to niveauer: AA og AAA, hvor AA-niveauet er minimumskravet.
Farver til tekst
- AAA-niveauet kræver en minimums farvekontrast på ≥7:1
- AA-niveauet kræver en minimums farvekontrast på ≥4,5:1
Farver til grafik (CTA knapper, store overskrifter med mere)
- AAA-niveauet kræver en minimums farvekontrast på ≥4,5:1
- AA-niveauet kræver en minimums farvekontrast på ≥3:1
Tjek om farvekontraster lever op til tilgængelighedskravene på webAIMs hjemmeside
Farvesammensætninger til tekst og grafik, der består AAA-niveau (≥7:1)
- Primær blå og Sekundær turkis
- Primær blå og Sekundær lysrød
- Primær blå og Primær hvid
- Primær blå og Sekundær gul
- Primær hvid og Sekundær grøn
- Sekundær grøn og Sekundær lyserød
- Sekundær lyserød og Sekundær brun
- Sort og Sekundær turkis
- Sekundær gul og Sekundær grøn
- Sort og Sekundær Lyserød
- Sort og Sekundær gul
- Primær hvid og sort
- Primær hvid og Sekundær brun
- Sekundær gul og Sekundær brun
Farvesammensætninger til tekst og grafik, der består AA-niveau (≥4,5:1)
- Sekundær grøn og Sekundær turkis
- Primær blå og Sekundær orange
- Primær hvid og Sekundær lilla
- Sekundær lilla og Sekundær lyserød
- Primær hvid og Sekundær pink
- Sekundær gul og Sekundær lilla
- Sekundær orange og sort
- Sekundær brun og Sekundær turkis
Farvesammensætninger til grafik, der består AA-niveau (≥3:1)
- Primær blå og Sekundær pink
- Primær hvid og Sekundær orange
- Sekundær turkis og Sekundær lilla
- Sekundær pink og Sekundær lyserød
- Sekundær orange og Sekundær grøn
- Sekundær lilla og sort
- Sort og Sekundær pink
- Sekundær Brun og Sekundær orange
Farveforløb
Som et ekstra designelement, der skal give Aalborg Kommune et moderne og dynamisk udtryk, er det muligt at bruge farvepaletten i et farveforløb. Farveforløb skal bruges efter de gældende guidelines for farvebrug.
Der kan downloades prædefinerede farveforløb, men har man adgang til grafiske programmer, kan man selv lave et farveforløb i Adobe Illustrator (2020 version). Nedenfor er en mini guide til dette:
- Lav en ”kasse”
- Vælg Gradient tool/Gradient værktøjet
- Vælg Freeform/Fri form gradient
- Vælg en af de fire punkter der kommer frem i kassen for at vælge farve
- Punkterne kan flyttes, der skal tilføjes nye ved at trykke et vilkårligt sted i kassen
Download de prædefinerede farveforløb
TIP: Når farveforløb trykkes, kan man med fordel give det blur/sløring og noise/gryn, så der ikke kommer linjer i farveforløbet.
Grid
Halveringsprincip
Simple regler skal sikre maksimal sammenhæng og genkendelighed i alle designløsninger. Det gælder også grid og kompositioner.
Når man arbejder med layout gælder der et halveringsprincip, hvor man deler flader i lige store halvdele.
Man kan også vælge slet ikke at dele, hvis man for eksempel ønsker at lade en farveflade eller et foto fylde hele fladen/dokumentet ud.
Ved brug af halveringsprincippet kan man inddele i 1/2 eller 1/4 horisontalt og/eller vertikalt i forskellige variationer.
Eksempel: Halveringsprincip
Dynamisk halveringsprincip
For at skabe dynamik og bløde op i de stramme linjer som halveringspricippet danner, må man trække én flade ind over en anden flade (det er illustreret ved at være +1/2).
Hvor meget den ene flade skal trækkes ind over den anden skal vurderes individuelt ift. det visuelle udtryk og indhold.
Eksempel: Det dynamiske halveringsprincip
Typografi
Arial og Alright Sans
Aalborg Kommune bruger to typografier. Arial bruges i wordskabeloner, e-mails, powerpointskabeloner og så videre, hvor man ikke kan vælge Alright Sans.
Har man adgang til Alright Sans bruges denne. Alright Sans er en skrifttype med enkle detaljer og et imødekommende udtryk. Den har en god læsbarhed - også i små størrelser. Otte forskellige snit og matchende kursiv gør det il en pålidelig og alsidig skriftfamilie, der fungerer godt på tværs af alle medier.
Foto og illustrationer
Fotos udgør en betydelig del af Aalborg Kommunes kommunikation, og er derfor afgørende for både enkeltbudskaber og den samlede identitet.
I respekt for mangfoldigheden i behov, motiver og målgrupper skal Aalborg Kommune have mulighed for at bruge forskelligartede billeder. Der er følgende guidelines til brug af billeder:
- Brug stemningsfulde fotos der portrætterer Aalborg Kommunes borgere og steder (vær opmærksom på GDPR).
- Brug gerne fotos, der har en tydelig farveholdning, hvor én farve er gennemtrængende i fotoet.
- Overvej om det giver mening at bruge sort/hvid fotos.
- Brug nye og opdaterede fotos.
- Brug ikke billeder i dårlig opløsning, der har et grafisk udtryk eller voldsomt redigerede.
Billederne skal afspejle/være:
- Autenticitet og ægthed
- Levende
- Stemningsfyldte
- Aalborg Kommunes områder, aktiviteter og borgere.
Illustrationer
Som et ekstra grafisk element har Aalborg Kommune fået udviklet et modulbaseret kartotek af små illustrationer, der kan sammensættes til friser.
Illustrationerne skal afspejle Aalborg Kommune og borgerne; Land & by, arkitekturen, børn, infrastruktur, landbrug, natur, fjorden, ældre, skole, aktiviteter, transport med mere.
Illustrationerne skal bruges i mangel af gode eller opdaterede billeder eller små ikoner og tegninger. De skal være med til at tilføre Aalborg Kommune noget særpræg og give mulighed for en bredere visuel kommunikation.
Man kan enten selv sammensætte illustrationerne, bruge dem enkeltvis, eller bruge de prædefinerede sammensætninger.
Illustrationerne må bruges efter de gældende farveregler, og må ikke forvrænges eller roteres.
Eksempel: Brug af illustrationer
Tøj og beklædning
På kommunens arbejdstøj skal logoet placeres over venstre brystlomme. Skal forvaltningens navn fremgå, placeres det og eventuelt afdelingsnavn under logoet. Størrelsesforholdet mellem logo og forvaltningsnavn skal være sådan at højden på versalerne på skriften som forvaltningens navn skrives med svarer til 1/5 del af højden på logoet..
Logoet kan placeres i passende størrelse på ryggen af udendørs arbejdstøj.På t-shirts placeres logoet på venstre side af brystet. På højre side er der plads til navnene på særlige afdelinger eller kampagner. På hjelme skal logoet både sættes foran og bagtil.
Biler
På Aalborg Kommunes biler skal afdelingsnavn og det fulde logo fremgå. Afdelingsnavnet skrives med Alright Sans i regular.
Størrelsesforholdet mellem logo og afdelingsnavn skal være sådan at højden på navnetræk er den samme højde som versalerne i afdelingsnavnet.
Cvr. nummer skal fremgå foran bagerste hjul som angivet. Nummeret skal skrives i versaler så numrene ikke hopper på linjen.
Venstre og højre side på bilen er ens. På en lys baggrund anvendes hvide folier, og på en mørk baggrund anvendes folier i Aalborg Kommunes mørkeblå primærfarve.
Skilte
Udendørs skilte
Der er flere forskellige typer udendørs skilte, de fleste af mærket Modulex. Forvaltningsnavn skal kun fremgå, hvis skiltet står ved en forvaltning.
Institutionsskilt
- Navn på institution
- Adresse (vej og hus nummer)
- Eventuelt øvrige informationer
Forvaltningsskilt
- Navn på forvaltning
- Adresse (vej, hus nummer)
Ved produktion eller ændring af skilte kontakt:
AKPrint, Jesper Pedersen
Telefon: 99 31 15 23
Skriv til Jesper Pedersen
- Afdelinger skrives i Alright Sans Regular.
- Adresselinje skrive i Alright Sans Black.
- Teksten skal holde venstrekant.
- Logoet skal centreres. Bomærke og navnetræk må gerne skilles ad, når der er tale om større skilte.
- Tekst skal centreres indenfor øvre og nedre margin i det øverste felt