Direktonline. GRAFISK MANUAL

Transkript

1 Visuell kommunikation Direktonline Direktonline. GRAFISK MANUAL KONTAKT Telefon: E-post: ADRESS Erik Dahlbergsgatan Göteborg ONLINE Webbplats: Sociala medier: Direktonline

2 EN WEBBYRÅ MED PERSONLIGHET SOM VÅGAR STICKA UT.

3 Direktonline Innehållsförteckning 3 Innehållsförteckning Företagsnamn... 4 Företagsnamnet i text... 4 Företagssignatur... 5 Logotyp & symbol... 6 Svart/vit logotyp... 8 Frizon & minsta storlek... 9 Felaktig användning av signatur Kulörer Företagsfärger Kompletterande färsskala Typografi Digital användning Tryck i användning Bildspråk Användning av bilder Grafiska element Bas för formgivning Layoutexempel Visitkort... 22

4 Direktonline 1. Företagsnamn 4 Företagsnamnet Hur man hanterar Direktonline i löpande text påverkar profilen och framförallt helhetsintrycket. Även om logotypen bygger på gemener så bör Direktonline skrivas med versal ingång. Direktonline förkortas DO i gemener.

5 Direktonline 2. Företagssignatur 5 FÖRETAGSSIGNATUR Visuellt kännetecken. Symbolen med dess gröna färg är vårt främsta visuella kännetecken. Denna består av initialerna av vårt företagsnamn Direktonline, som skrivs i gemener. Tillhörande visas företagsnamnet i text som logotyp, detta i typsnittet Proxima Nova Light. Tillsammans bildar dem vår företagssignatur. Signaturen har inga specifika marginaler eller mått, dock så får den inte störas av andra objekt. Den får inte ändras på något sätt annat än i storlek. Även förhållandet (inbördes storlek och placering) mellan de olika delarna är fast och får inte förändras. Bakgrunden för logotypen får vara uttrycksfull i form av foton, färg eller liknande, så länge kontrasten mot bakgrunden låter signaturen framhävas.

6 Direktonline 2. Företagssignatur 2.1 Logotyp & symbol 6 FÖRETAGSSIGNATUR Logotyp & Symbol Primär företagssymbol Den primära symbolen ska finnas med i samtliga kommunikativa sammanhang för att visa Direktonline som en tydlig avsändare.

7 Direktonline 7 2. Företagssignatur 2.1 Logotyp & Symbol FÖRETAGSSIGNATUR Logotyp & Symbol Sekundär företagssymbol Logotypen direktonline är skriven i typsnittet Proxima Nova Light och får primärt endast förekomma ihop med symbolen. Dock är symbolen inte bunden till logotypen utan kan användas för sig. Detta som utsmyckning, illlustration eller för att tydliggöra avsändaren. Använd den grå versionen mot ljusa bakgrunder och den vita mot mörka bakgrunder.

8 Direktonline 8 3. Företagssignatur 3.1 Logotyp & Symbol FÖRETAGSSIGNATUR Svart/vit logotyp Svart eller vit symbol Vit eller svart symbol används endast när det är omöjligt med färgtryck på ljus respektive mörk bakgrund, samt om vald bakgrund inte framhäver symbolen. Använd den grå versionen mot ljusa bakgrunder och den vita mot mörka bakgrunder. Vid grön bakgrund får båda alternativen användas.

9 Direktonline 3. Företagssignatur 3.2 Frizon & minsta storlek 9 FÖRETAGSSIGNATUR Frizon & minsta storlek e e e För företagssignaturen ska frizonen minst motsvara höjden av ett e från signaturen. e 15 mm För symbolen ska frizonen minst motsvara 1/2 av symbolens bredd. 30 mm Frizon Frizonen visar hur mycket luft det som minst måste finnas runt om företagssignaturen. Desto större marginaler, desto tydligare framträder den. Detta är till för att stärka signaturens tydlighet och integritet, där inga andra objekt får störa. För att signaturen ska vara läsbar finns ett minsta möjliga mått på symbolen och logotypen.

10 LJUS BAKGRUND ENFÄRGAD BAKGRUND MÖRK BAKGRUND

11 Direktonline 2. Företagssignatur 2.3 Felaktig användning av signatur 11 FÖRETAGSSIGNATUR Felaktig användning av signatur Ta bort något element i signaturen. Ändra färg på något element i signaturen utöver de primära alternativt sekundära versionerna. Använda en bakgrund där signaturen ej framhävs. Ändra proportioner på något element i signaturen. Använda en bakgrund där signaturen ej framhävs. På något sätt rotera signaturen. Sekundär företagssymbol Logotypen direktonline får endast förekomma ihop med symbolen. Dock är symbolen inte bunden till logotypen utan kan användas för sig. Detta som utsmyckning, illlustration eller för att tydliggöra avsändaren.

12 Direktonline 3. Kulörer 12 KULÖRER Företagsfärger. Direktonline arbetar grafiskt utifrån en bestämd färgskala. Den officiella färgen är den gröna kulör (DO-Grön) som finns i symbolen. Detta är den färg som främst beskriver företaget och bygger en stor del av varumärket. Den sekundära kulören är den gula som även den återfinns i symbolen. Tillsammans utgör de våra profilfärger. Vitt och ljusgrått kompletterar de föregående färgerna och bildar företagsfärgskalan. Valda nyanser av grått tillhör sedan en kompletterande färgskala.

13 Direktonline 3. Kulörer 3.1 Företagsfärger 13 KULÖRER Företagsfärgskala PRIMÄR KULÖR DO-Grön CMYK: RGB: HEX: #77c35b SEKUNDÄR KULÖR Grön-Gul CMYK: RGB: HEX: #cfde7c BASKULÖR Ljusgrå CMYK: RGB: HEX: #f2f2f2 BASKULÖR Vit CMYK: RGB: HEX: #ffffff Primär företagssymbol DO-Grön är en kulör som främst bör användas i vår visuella kommunikation för att tydliggöra Direktonline som avsändare, i exempelvis tonplattor eller detaljer. Grön-Gul kan även den användas för tonplattar och detaljer, dock ej lika genomgående. Ljusgrå och vit används som bas/bakgrund för att framhäva våra profilfärger.

14 Direktonline 3. Kulörer 3.2 Kompletterande färgskala 14 KULÖRER Kompletterande färgskala PRIMÄR KULÖR Grå CMYK: RGB: HEX: #4a4a4a BASKULÖR Mellangrå CMYK: RGB: HEX: # BASKULÖR Mörkgrå CMYK: RGB: HEX: #2b2b2a Primär företagssymbol Detta är vår kompeltterande färgskala till våra företagskulörer. Dessa används främst för texter, men även detaljer, tonplattor och betoning. Använd dessa sparsamt, då vi vill kommunicera ljus och positivt.

15 Direktonline Typografi TYPOGRAFI Våra typsnitt. Våra två huvudtypsnitt är Heuristica och Source Sans Pro. Dessa är valda för att vara tillgängliga, lättlästa, mjuka i formen och fungera på både webb och i tryck.

16 Direktonline 4. Typografi 4.1 Digital användning 16 TYPOGRAFI Digital användning Source Sans Pro Regular Aa Bb Cc Dd ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö Source Sans Pro Semibold Aa Bb Cc Dd ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö Source Sans Pro Bold Aa Bb Cc Dd ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö Typsnitt digitalt För huvudrubriker använder vi främst Source Sans Pro Bold samt Source Sans Pro Semibold för underrubriker. För brödtexter på webbsidor och andra digitala medier använder vi Source Sans Pro Regular. Detta används även på ingresser, bildtexter samt andra kortare texter.

17 Direktonline 4. Typografi 4.2 Användning i tryck 17 TYPOGRAFI Användning i tryck Heuristica Regular Aa Bb Cc ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö !@#$%^&*-=+<>?:; Source Sans Pro Italic Aa Bb Cc Dd ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö !@#$%^&*-=+<>?:; Heuristica Bold Aa Bb Cc Dd ABCDEFGHIJKLMNOPQRSTUVWXYZÅÄÖ abcdefghijklmnopqrstuvwxyzåäö !@#$%^&*-=+<>?:; Typsnitt tryck För huvudrubriker använder vi främst Source Sans Pro Bold samt Source Sans Pro Semi bold för underrubriker. Detta kan varieras med Heuristica Bold i tryck. För brödtexter avsedda för papper använder vi i huvudsak Heuristica Regular. Detta används även på ingresser, bildtexter samt andra kortare texter. Source Sans Pro Italic kan användas på ord och kortare texter för särskildring.

18 Direktonline 5. Bildspråk 18 BILDSPRÅK Användande av bilder. Vi använder bilder som ett sätt att konkretisera och förtydliga vår verksamhet. Mest arbetar vi med foton, men illustrationer och grafik är ofta väldigt goda alternativ. I dessa förekommer det ofta någon form av grönt element.

19 Direktonline 5. Bildspråk 5.1 Användningav bilder 19 FÖRETAGSSIGNATUR Användning av bilder Sekundär företagssymbol Logotypen direktonline får endast förekomma ihop med symbolen. Dock är symbolen inte bunden till logotypen utan kan användas för sig. Detta som utsmyckning, illlustration eller för att tydliggöra avsändaren.

20 Direktonline 6. Grafiska element 20 GRAFISKA ELEMENT Bas för formgivning. Det här är grafiska element som vi använder oss av. Det är givetvis inte alla. Till dessa kan också linjer och andra block tillkomma, men det här är de typer av grafiska element som ska tillhöra basen i vår formgivning. Allmänt eftersträvar vi en känsla av öppenhet, enkelhet, stabilitet och tydlighet i layouten. Vi jobbar med funktionell form snarare än dekorativ. Det gäller även bilder, som ska tillföra innehåll och inte vara i huvudsak dekoration.

21 Direktonline 6. Grafiska element 6.1 Bas för formgivning 21 GRAFISKA ELEMENT Bas för formgivning A. B. C. Grön punkt efter huvudrubriker. A. Mönster Att använda i sidfötter, som avdelare eller bakgrund till textrutor. Används företrädesvis i företagets färgskala. C. Punkter På större huvudrubriker använder vi oss av en grön punkt på slutet. Denna återkopplar till vår runda symbol. B. Linjer Linjer avgränsar och delar av. Vi använder i regel tunna linjer i den primära färgen. Minst ca 3px bred.

22 Direktonline 7. Layoutexempel 7.1 Visitkort 22 LAYOUTEXEMPEL Visitkort FÖRNAMN EFTERNAMN YRKESTITEL Erik Dahlbergsgatan Göteborg Tfn förnamn@direktonline.se Användning Detta är olika visningsexempl för Direktonlines visitkort. Informationen som visas på baksidan ska anpassas utefter varje person.

23

24