kreativ & engagerad samhällsbyggare
Inviatech Grafisk Profil V. 1.0
Inviatech Grafisk Profil V. 1.0
S. 2
Grafisk profil
Allt vi på Inviatech kommunicerar påverkar omgivningens bild av oss. För att underlätta arbetet med att spridavårt budskap och våra värderingar har vi en tagit fram en grafisk profil. Den hjälper oss att kommunicera på ettenhetligt och konsekvent sätt. Målet med vår grafiska profil är att omgivningen enkelt ska kunna känna igen informa-tion som kommer från Inviatech.
Ladda ner fler grafiska produkter på:http://www.inviatech.se/grafisk-profil/
Kontakt: Komini [email protected]
Inviatech Grafisk Profil V. 1.0
S. 3
Innehåll
Grafisk profil Kontakt
Introduktion Fyra byggstenar
Logotyp Vår logotyp Marginaler Användning
Typografi Typsnitt Viktklasser Storlekar Användning
23
45
6789
1011121314
Grafiska element Färger Typografisk indelning Avdelare Ikoner Övertoning
Bilder Bilder Användning Bildbank
151617181920
21222324
Introduktion
Inviatech Grafisk Profil V. 1.0
Inviatech Grafisk Profil V. 1.0
S. 5
Introduktion
Bilder
Logotyp
Fyra byggstenar
Inviatechs grafiska profil bygger på fyra olika element som vi kallar grafiska byggstenar. Tillsammans utgör de fundamenten i den grafiska profilen och bidrar till att skapa intern samhörighet och extern igenkänning. Byggstenarna är vår logotyp, typogra-fi, grafiska element och bilder.
Kreativ och engageradsamhällsbyggareHelhetstänkande konsult i skärningspunkten därsamhällsbyggnad, människor och affär möts.
Grafiska element
Typografi
Logotyp1/4
Inviatech Grafisk Profil V. 1.0
Inviatech Grafisk Profil V. 1.0
S. 7
Logotyp
Vår logotyp
Logotypen är Inviatechs tydligaste kännetecken. Tillsammans med vår typografi, grafiska element och bilder förstärker den bilden av Inviatech. Logotypen består av tre element: vårt namn, vår slogan och symbol. På sida 9 beskrivs hur logotypen bör använ-das i olika sammanhang. Generellt kan man emellertid säga att ju mer plats och ju större marginaler desto fler element kan användas.
kreativ & engagerad samhällsbyggare
Inviatech Grafisk Profil V. 1.0
S. 8
Logotyp
Marginaler
Inviatechs grafiska språk är enkelt och minimalistiskt. Vi undviker i största mån plotter och att ge saker och ting andrum är viktigt. Detta gäller natur-ligtvis även vår logotyp.
Se till att logotypen får luft. Använd symbolen som marginal till kanten. I vissa fall kan 1/2 av symbolen an-vändas som mått. Exempelvis för en profilbild på Facebook eller sidhuvud på hemsidan.
Inviatech Grafisk Profil V. 1.0
S. 9
Logotyp
Användning
Kontraster är viktigt. Se till att logoty-pen syns tydligt oavsett bakgrund. Till höger ser du några exempel på hur den kan användas mot olika bakgrun-der.
Inviatechs logotyp finns i två färgpa-letter: Orginal (Inviatech Grå/Inviatech Gul) och vit. Läs mer om färger på sida 16.
Vit/ljus
Färg
Bild
Typografi2/4
Inviatech Grafisk Profil V. 1.0
Source Sans Pro
HejInviatech Grafisk Profil V. 1.0
S. 11
Typografi
Typsnitt
Inviatechs typsnitt är Source Sans Pro av Paul D. Hunt.
Om Source Sans Pro:”Source® Sans Pro, Adobe’s first open source typeface family, was desig-ned by Paul D. Hunt. It is a sans serif typeface intended to work well in user interfaces.” (Google Fonts)
Inviatech Grafisk Profil V. 1.0
S. 12
Typografi
Viktklasser
Inviatech använder tre viktklasser av Source Sans Pro. Läs mer om när olika viktklasser bör användas under kapitlet Grafiska element.
Lorem ipsum 123
Lorem ipsum 123
Lorem ipsum 123
Light
Regular
Bold
Brödtext
Rubrik/ingress + navigering
Rubrik
Inviatech Grafisk Profil V. 1.0
S. 13
Typografi
12 pkt14 pkt
16 pkt
18 pkt
20 pkt
24 pkt
30 pkt
36 pkt
48 pkt
72 pkt
96 pkt
Storlekar
Inviatech använder följande storle-kar. Läs mer under kapitlet Grafiska element.
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbccccccccccccccccccccccccccccccccccccccccccccccccccccccdddddddddddddddddddddddddddddddddddddeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeefffffffffffffffffffffffffffffffffffffffffffffffffffffffggggggggggggggggggggggggghhhhhhhhhhhhhhhhhhh
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii
jjjjjjjjjjjjjjjjjjjjj
kkkkkkk
Inviatech Grafisk Profil V. 1.0
S. 14
Typografi
Bold 36 pkt
Regular 24 pkt
Regular 12 pkt
Regular 24 pkt
Regular 24 pktLight 18 pkt
Regular 12 pkt
Light 14 pkt
Light 12 pktAnvändning
Till höger finner du en skärmdump från Inviatechs hemsida samt exem-pel på hur olika viktklasser och storle-kar av Source Sans Pro kan användas.
Se inte den här manualen som en lag-bok, utan snarast som en inspiration. Var kreativ och lite på ditt eget omdö-me. Inviatechs varumärke utvecklas hela tiden och som användare av den här manualen är du med och bidrar till den processen.
Grafiska element3/4
Inviatech Grafisk Profil V. 1.0
Inviatech Grafisk Profil V. 1.0
S. 16
Grafiska element
Mörkgrå#333333R51 B51 G51C70 M61 Y57 K65
Inviatech Gul#dedc00R222 B220 G0C20 M2 Y95 K0
Vit alternativ#f2f2f2R242 B242 G242C6 M4 Y5 K0
Ljusgrå#999999R153 B153 G153C41 M32 Y33 K10
Svart#191919R25 B25 G25C78 M70 Y63 K82
Inviatech Grå#595959R89 B89 G89C60 M50 Y48 K38
Grå#666666R102 B102 G102C57 M46 Y45 K31
Färger
Vit#ffffffR255 B255 G255C0 M0 Y0 K0
Inviatech Grafisk Profil V. 1.0
S. 17
Grafiska element
Typografisk indelning
Olika viktklasser, storlekar och färger används för olika ändamål. Till höger finner du Inviatechs sex generella typografiska indelningar. Utgå från dessa och studera hemsidan vid be-hov av andra alternativ.
Lorem ipsum 123
Lorem ipsum 123
Lorem ipsum 123
Lorem ipsum 123
Lorem ipsum 123
Rubrik
Segment
Rubrik/Ingress
Brödtext
Navigering
Bold / 36-96pkt / Vit
Bold / 48-72pkt / Vit
Regular / 20-30pkt / Mörkgrå-Vit
Light / 12-18pkt / Grå-Ljusgrå-Vit
Regular / 12pkt / Mörkgrå-Vit
Inviatech Grafisk Profil V. 1.0
S. 18
Grafiska element
Avdelare
Inviatech har avdelare för olika typer av segement och kapitel. Segment-delare 1 används vid mer distinkta avdelningar och syftar till att elegant föra betraktaren från en punkt till en annan. Segment-delare 2 används för att dela upp angräns-ande segment under ett gemensamt kapitel. Kapitel-delare används för att dela upp olika kapitel. Detta kan vara olika undersidor av en hemsida eller olika kapitel i en publikation (se sidorna 4, 6, 10, 15, 20).
Segment 1
Segment 2
Kapitel
-45°
0,5-1,5pkt
2,5-5pkt
Font Awesome
Inviatech Grafisk Profil V. 1.0
S. 19
Grafiska element
Ikoner
Inviatechs ikoner kommer från Font Awesome, en av de mest populära och raffinerade ikonsamlingarna på marknaden. Ikoner används exempel-vis i listor, som på skärmdumpen till höger.
Läs mer:https://fontawesome.com/
Inviatech Grafisk Profil V. 1.0
S. 20
Grafiska element
Övertoning
I vissa fall används övertoningar på bilder som innehåller mindre text-stycken, exempelvis en enskild rubrik.
Skapa övertoning i Photoshop:1. Importera ett nytt bildlager.2. Skapa en linjär övertoning (0°).3. Gör båda färgstegen svarta.4. Flytta höger opacitetssteg till 75% och justera opaciteten till 75%.5. Klicka på OK och justera opaciteten för övertoningsfyllningen till 75.6. Skapa en ny övertoning och repe-tera processen, men ändra färgstegen till HEX-koden #dec00 (Inviatech Gul).
Exempel
Toningar
Bilder4/4
Inviatech Grafisk Profil V. 1.0
Inviatech Grafisk Profil V. 1.0
S. 22
Bilder
Resultat Ansvar Enkelhet Glädje
Bilder som visar på hur Inviatech förändrar samhället och människors vardag.
Bilder som visar på hur vi tar ansvar. Ett starkt ethos är viktigt.
Enkla, rena bilder. Undvik plotter. Bilder som förmedlar glädje och optimism.
Inviatech Grafisk Profil V. 1.0
S. 23
Bilder
Användning
Till höger finner du två exempel på hur Inviatech arbetar med bild och text. Om texten placeras i bilden är det viktigt att ta hänsyn till kontrast-skillnader. Vid behov kan en svart ruta – ett så kallat asklager – med låg opacitet (1-25%) läggas över bilden. Att placera texten bredvid bilden ger större frihet över bildens innehåll, motivets placering och intensitet.
Text i bild
Bild + textRubrik
Evelenimus, eum digeniscit molessimin
eossequiae. Et quid earunt miliquistiat eos
voluptate corrum nonecto doluptatur.
Kreativ och engageradsamhällsbyggareHelhetstänkande konsult i skärningspunkten därsamhällsbyggnad, människor och affär möts.
Inviatech Grafisk Profil V. 1.0
S. 24
Bilder
Bildbank
Som ett komplement till Inviatechs grafiska manual har vi tagit fram en bildbank. Samlingen går att ladda ner på Inviatechs hemsida. Där finner du både inspiration såväl som bilder att använda direkt.
Ladda ner via:http://www.inviatech.se/grafisk-pro-fil/
Top Related