Varumärket. Vi bygger varumärket Folkhögskola.nu tillsammans

Transkript

1

2 Varumärket Vi bygger varumärket tillsammans, såväl genom vårt erbjudande som hur vi bemöter och kommunicerar med vår omvärld. Lyckad kommunikation bygger på att avsändaren är tydlig med sitt budskap. Vilka är vi? Folkhögskolornas informationstjänst (FIN) ansvarar för den samlade informationen om landets folkhögskolor. Vårt uppdrag är att skapa en tydlig bild av folkhögskolan som skolform och bidra till att rekrytera kursdeltagare. Vi är även folkhögskolornas gemensamma funktion för kommunikation, marknadsföring och studievägledning. Vår vision Att alla vet vad folkhögskolan ger, gör och skapar och att FIN är den självklara vägen till den samlade informationen om landets folkhögskolor och deras kursutbud. Detta innebär att vi måste kunna svara på frågor som: vad ger det att gå på folkhögskola, vad gör folkhögskolan för skillnad och vad skapar folkhögskolan i jämförelse med andra skolformer? Huvudbudskap Folkhögskolan är en skolform där människor får lära, växa, mötas och agera för att få behörighet till högre studier, utveckla ett intresse eller utbilda sig till ett yrke. Målgrupper Huvudmålgruppen för vår kommunikation är unga vuxna, år. Sekundär målgrupp är studie- och yrkesvägledare inom utbildnings- och arbetsmarknadsområdet. Vårt varumärke Varumärket är en spegling av hur vi är idag och ska ge en bild av det varumärke vi vill bli. Varumärket är således både en bild av vår befintliga verksamhet lika mycket som vår ambition. Vi bygger varumärket Folkhögskola.nu tillsammans Så arbetar vi med vårt varumärke Vårt varumärke ska avspeglas i allt vi gör. Vi bygger varumärket om folkhögskolan tillsammans, såväl genom vårt erbjudande som hur vi bemöter och kommunicerar med vår omvärld. Lyckad kommunikation bygger på att avsändaren är tydlig med sitt budskap. Tänk på att lyckad kommunikation inte begränsar sig till trycksaker eller vår webbplats. Hur vi bemöter vår målgrupp i det dagliga arbetet är centralt i hur vårt varumärke uppfattas. En tydlig identitet ger en klar bild av vad vi gör och vad vi vill med vår verksamhet, nu och i framtiden. Därför är det viktigt att vi alla beskriver oss på samma sätt och ger samma bild av vilka vi är. Vi vill skapa en samlad och tydlig bild av folkhögskolan, laddad med positiva värden. När vi har skapat en stark bild kommer den att hjälpa oss att utvecklas i framtiden. Samtidigt blir det dagliga arbetet enklare. All kommunikation ska utgå ifrån våra grunder och ledord med anpassade budskap beroende på produkt och målgrupp. Läs mer om vårt uppdrag, inriktningsmål och ledord i vår Kommunikationsplattform. 2

3 Innehåll Grafisk identitet tillämpningar Logotyp sid 4 Katalog sid 25 Färgpalett sid 10 Faktablad sid 26 Typografi sid 13 Brevmallar sid 27 Bilder sid 18 Webbplats sid 28 Grafiskt element sid 21 Nyhetsbrev sid 29 Pappersval sid 23

4 Logotyp Ord som legat till grund för logotypen är att den ska kännas seriös samtidigt som den är lekfull. Vi har även arbetat kring orden levande, tydlig och personlig och strävat efter det uttrycket i skapandet av vår logotyp. 4

5 Logotyp Grundläggande Logotypens utseende är unikt och är en central del i vår kommunikation. Den ska alltid återges på det sätt som visas i denna manual. Logotypen är den huvudsakliga avsändaren av vår identitet och det är därför viktigt att man lätt kan identifiera den. Bokstäverna i logotypen är tecknade för just detta ändamål. Logotypen får inte ändras. Den får heller inte användas i löpande text. I löpande text skriver vi webbplatsens namn som en del av texten; Folkhögskola.nu. Basprinciper Behandla logotypen som en enhet, proportionerna får inte förändras, bytas ut eller skifta plats. Logotypen får endast återges i de färgställningar som beskrivs här i manualen. UTAN pay-off Positiv och negativ återgivning. MEd pay-off Positiv och negativ återgivning. För andra språkversioner än svenska, använd varianten utan pay-off. 5

6 Logotyp Återgivning Nedan ser du de korrekta återgivningarna av logotypen. Logotypen får användas i tre olika färger ur vår färgpalett, utöver svart. Om bakgrunden är en mörkare, färgad platta eller en bild så återges logotypen alltid som svart (positiv) eller vit (negativ). Välj den färgsättning som är mest lämplig och ger bäst läsbarhet för ditt ändamål. Vit eller ljus bakgrund Logotypen får återges i svart, ljusgrön, rosa eller orange på vit bakgrund eller mycket ljus bakgrund. Se färgvärden för logotypen under kapitlet Färgpalett. Mörkare bakgrund eller bild Logoypen återges alltid i vit (negativ) färgställning vid en mörkare färgad platta eller en mörk bild. 6

7 Logotyp Frizon För att logotypen ska vara lätt att uppfatta behöver den en omgivande frizon. En frizon är en minimimarginal, fri från text, symboler, bilder med mera som annars kan störa logotypen. 2x 2x 2x x 2x frizon Logotyp med och utan pay-off har samma frizon. X-et mellan a och n bestämmer proportionen på frizonen och följer skalenligt med oavsett storlek på logotyp. 2x 2x x 2x 2x 7

8 x Logotyp Placering och storlek Hur vet man var en logo bör placeras på en trycksak eller på webben? Hur stor bör den vara? På till exempel ett broschyromslag så är det lämpligt att ha en logotyp både på framsidan och på baksidan. I annonser så lägger man logotypen exempelvis nedtill på ytan för att man som läsare förväntar sig en avsändare på den delen av sidan. På utställningsmaterial kan man tänka på att placera logotypen högt upp på roll-ups eller liknande, så att avsändaren syns om det rör sig mycket folk kring utställningen. I digitala sammanhang är det knepigare att kontrollera hur användaren upplever logotypen. Alla tittar på olika skärmar och har därmed olika inställningar, upplösningar mm. En mobil enhet skiljer sig från en stationär. Man kan utgå från att placering av logo ska ske i början/starten av något. På banners bör den exempelvis ligga med hela tiden om en banner animeras i övrigt. 4x 5.7x Exempel trycksaker Lämplig storlek på ett vanligt A4-dokument är att logotypens bredd är 50 mm. Gäller med och utan pay-off. 50 mm Marginal oavsett trycksak är att ta hjälp av måttet x för att kunna skala lätt upp och ner. I exemplet till vänster, ett utsnitt ur ett A4-format, så är 4x i ytterkant lämpligt med en topp- eller bottenmarginal som är något större, i det här fallet är 5.7x lämpligt. Testa dig fram vad som passar bäst för din trycksak. Minsta tillåtna storlek 36 mm / 310 px 20 mm / 110 px Trycksaker Logotyp med pay-off har minsta tillåtna bredd på 36 mm Utan pay-off så är 20 mm minsta tillåtna bredd. digitalt Logotyp med pay-off har minsta tillåtna bredd på 310 px. Utan pay-off så är 110 px minsta tillåtna bredd. 8

9 Ikon Favicon och avatar Vi har tagit fram en ikon som ska kunna representera oss i digitala kanaler. En favicon är den lilla bild som finns i webbläsarens adressfält intill webbadressen. En avatar är den profilbild som används i olika sociala medier och forum, exempelvis Facebook och Twitter. Ikonen används som huvudbild på vår egna profilsida och hamnar automatiskt som en liten bild intill vårt namn där vi väljer att göra inlägg, statusuppdateringar eller liknande. I båda fallen är den lilla storleken en utmaning och vår ordinarie logotyp fungerar inte i så små format. Ikonen ska inte användas i andra sammanhang än som avatar eller favicon. favicon och avatar Du kan även se faviconen i adressfältet på vår webbplats och avataren kan du se på vår Facebook- eller Twitter-sida. Exempel facebook exempel twitter 9

10 Färgpalett Det är tacksamt att använda färger när man vill kommunicera ett visst budskap eller förmedla en speciell känsla av ett varumärke. Våra är starka, glada och många! 10

11 Färgpalett Trycksaker Färgerna i vår palett är rosa, ljusgrön, orange, lila, röd och grön. Vi jobbar även i nyanser av våra färger där det är lämpligt. Många starka färger ihop kan bli rörigt, särskilt om de konkurrerar med texter och bilder. Tänk därför på mottagaren av den produkt du ska göra och hur folkhögskola.nu bäst kommunicerar sitt budskap och varumärke. En färg kan variera något beroende på om den trycks på bestruket eller obestruket papper, eller på andra underlag som till exempel textil eller plast. Vi rekommenderar att man utgår från de färgställningar för bestruket papper (PMS och CMYK) som visas härintill, vid tryck på obestruket eller matt papper så får man efterlikna det bestrukna resultatet. Vid färginställningar för webben och dokument som ska visas på skärmen rekommenderas de RGBinställningar som visas på nästa sida. primärfärger sekundärfärg Rosa ljusgrön orange ljusgrå Bestruket papper Pantone: 226 C Cmyk: 0,100,2,0 Bestruket papper Pantone: 382 C Cmyk: 34,0,100,0 Bestruket papper Pantone: 158 C Cmyk: 0,65,95,0 Bestruket papper Pantone: finns ej Cmyk: 0,0,1,5 LILA grön RÖD Bestruket papper Pantone: 234 C Cmyk: 18,100,4,18 Bestruket papper Pantone: 376 C Cmyk: 59,0,100,0 Bestruket papper Pantone: 186 C Cmyk: 2,100,82,6 11

12 Färgpalett Digitalt Den ljusgröna färgen använder vi på webben som färg för bakgrund men även som ett komplement för att förstärka vissa detaljer. Den rosa färgen använder vi på webben som färg för toppen på moduler men även som ett komplement för att förstärka vissa detaljer. På webbplatsen finns ett större behov av färger och nyanser än vad som ryms inom paletten för profilfärger. Anledningen till att en utökad palett används är för att webben är mer dynamisk för att det visuella intrycket inte ska bli platt krävs att vi använder toningar och nyanser. Exempelvis har en grå färg använts för ramverket, bakgrunder och plattor. En blå färg används till länkar för att skapa tydlighet för användaren. Värdena nedan används även för dokument i PowerPoint och Word. primärfärger sekundärfärg Rosa LJUSGrön orange ljusgrå Rgb: 254,0,114 Hex: #fe0072 Rgb: 158,208,17 Hex: #9ed011 Rgb: 255,91,0 Hex: #ff5b00 Rgb: 238,238,238 Hex: #eeeee LILA grön RÖD Rgb: 170,0,94 Hex: #aa005e Rgb: 75,187,45 Hex: #4bbb2d Rgb: 229,0,23 Hex: #e

13 Typografi Vår typografi är en av de mest framträdande profilbärarna i vår grafiska profil. Vilka typsnitt vi använder och hur vi använder dem är avgörande för att skapa en tydlig kommunikation som andas folkhögskolan och bygger vårt varumärke. Vi vill bland annat uppfattas som seriösa, glada, personliga och kontrastrika, vilket har legat till grund för valet av typografi. Vi använder oss främst av två olika typsnitt; ITC Century och ITC Berranger Hand. Century är en så kallad serif/antikva och Berranger Hand är ett typsnitt med handskriven känsla. Vi använder även ett typsnitt som heter FF Milo, det används till texter som innehåller mycket information som ska få plats på en begränsad yta, exempelvis i våra kataloger. Undantag På webbplatsen används Helvetica i texter och menyer, läs mer på sidan Typografi Helvetica. Generella typografiska principer Löpande text sätts vänsterställd ej marginaljusterad. Löpande text sätts även alltid med en liten överkägel, dvs att radavståndet är större än textstorleken. All text har stor inledningsbokstav följt av små bokstäver. Rubrik och ingress Rubriker på framsidor eller huvudsidor kan varieras, arbeta gärna med en blandad typografi, Berranger Hand och Century tillsammans skapar fina kontraster. En huvudrubrik i en inlaga sätts i Berranger Hand och har då stor inledningsbokstav följt av små bokstäver. Rubriken får gärna ta lite plats, särskilt effektfullt blir det ihop med ITC Century Condensed i ingressen som här ovan. Kontraster i typografin blir spännande och oftast god läsbarhet. Vid underrubrker så används ITC Century Condensed i skärningen Bold, följt av Book vid behov. Exempel finns på nästa sidas rubrik. Rubriker överlag bör anpassas efter formatet de ska rymmas inom såklart, det som visas här utgår från ett A4-format. Mellanrubrik Är aktuell vid längre texter, såsom denna. Det finns två nivåer av en mellanrubrik, dels en fetare som används till de flesta mellanrubriker och dels en som används om det är ytterligare en dimension under den första mellanrubriken. Mellanrubrikerna har samma radavstånd och storlek som brödtexten, mer visas på sidan som visar ITC Century i detalj. Brödtext löpande text Löpande text, eller brödtext som den ofta kallas, sätts i ITC Century Light och Light Italic (vid behov). Till skillnad från rubriker så kan inte en löpande text skalas upp och ner alltför mycket. Vi mindre format är detta extra känsligt, här används 9 pt med 11.7 pt i radavstånd för att skapa bra läsbarhet. Minsta storlek i längre löpande texter rekommenderas till 8,5/11 pt. 13

14 Typografi ITC Century Ett klassiskt typsnitt med ett brett användningsområde. Typsnittet är välarbetat med mycket hög läsbarhet. Det ger ett trovärdigt och seriöst intryck och klarar av allt från små grader till större utan att förlora i kvalitét och estetik. ITC Century är vårt typsnitt som vi använder oss av mest i vår kommunikation. Det används främst i ingresser, löpande texter, faktatexter och i vissa rubriker. De kondenserade vikterna är mycket lämpliga i rubriker och de regulära passar väldigt bra i brödtext. Tips! Ha alltid kerningen inställd på optisk / optical på din text, valet görs inne i Adobes program. Då blir avstånden automatiskt mellan alla tecken mest lämplig och läsbarheten bäst. I ett bra kernat typsnitt upplevs bokstavsmellanrummen mellan varje tecken som lika. Designat av: Tony Stan, ITC är tillverkaren av just denna Centuryskärning. Förkortning för International TypeFace Corporation. Light Condensed Book Condensed Bold Condensed Light Book Bold används i mellanrubriker, faktatexter mm. används i ingresser, mellanrubriker, faktatexter och vissa rubriker mm. används i vissa rubriker och faktatexter mm. används främst till längre texter. används främst till längre texter och som high-lighter till text satt i Light. används sparsamt och isåfall för att high-lighta en text i en löpande text. Italic Italic Italic Italic Italic Behov av kursiv text? Använd då Italic-varianterna till den skärning du jobbar med. 14

15 Typografi ITC Berranger Hand Ett handskrivet typsnitt som knyter an till.nu i vår logotyp. Typsnittet funkar bra både i stora rubriker och små faktatexter. Vi använder Berranger Hand som ett komplement till Century, de kontrasterar fint ihop och skapar ett personligare och något lekfullare intryck. Tillsammans ger de en fin balans. Berranger Hand används versalgement i större rubriker och endast i versaler vid mindre texter. Tips! Rubriker ställer högre krav på dig som sätter typografin. Man behöver ibland justera avståndet mellan ett bokstavspar genom att kerna manuellt. Rubriker med Berranger Hand bör ha en knipning på -15, kerning på optisk och sen bör man kerna manuellt mellan bokstavsparen. Designat av: Éric de Berranger, ITC är tillverkaren, förkortning för International TypeFace Corporation. Regular Regular används till huvudrubriker. används i ingresser, kortare texter och faktatexter. 15

16 Typografi FF Milo FF milo är ett idealiskt typsnitt för mycket text som ska få plats på en begränsad yta. Det ÄR lättläst, tydligt och snyggt även i mycket små grader. folkhögskolekatalogen och sommarkatalogen. Typsnittet innehåller många skärningar så det är lätt att skapa hög läsbarhet. Vi använder främst Milo till de texttunga delarna i i bakre delen av Designat av: Michael Abbink, FF är tillverkaren, förkortning för FontFont. Light Regular Medium Bold används som grund i alla listningar och brödtext. används för att high-lighta text. används för att high-lighta text. används för att high-lighta text. Italic Italic Italic Behov av kursiv text? Använd då Italic-varianterna till den skärning du jobbar med. 16

17 Typografi Helvetica för att vi ska vara säkra på att mottagaren upplever en webbplats eller nyhetsbrev på samma sätt som vi SÅ krävs vissa justeringar av typografin. Detta beror på att våra egna typsnitt inte finns i alla webbläsare och för att vår webbplats ska förbli snabb att ladda och behålla sin struktur så behöver vi anpassa oss. Idag används ett typsnitt som kan läsas av de allra flesta, oavsett webbläsare och plattform. Vi har valt att arbeta med Helvetica som är ett så kallat standardtypsnitt. Helvetica används i rubriker, ingresser, löpande text, listningar och länkar både i nyhetsbrev och på webbplatsen. Anledningen till att vi inte använder standardtypsnitt i vår övriga kommunikation beror på att standardtypsnitten är begränsade i antal skärningar, variationer och urval. Designat av: Max Miedinger, 1957 Regular Oblique Bold Bold Oblique används i rubriker, menyer, löpande text och länkar. används sparsamt och bara för att high-lighta något. används för att visa markerade länker, länkrubriker och i huvudmenyer används sparsamt och bara för att high-lighta något. 17

18 Bilder Valet av bilder påverkar bilden av folkhögskolan. Bilderna ska ge liv och värme åt identiteten. Vi arbetar med illustrationer och foton. Ett enhetligt bildspråk är ett väsentligt redskap för att ge en klar och distinkt uppfattning av oss. Det innebär att bildval inte kan göras enbart utifrån personlig smak. Det är istället viktigt att tänka efter vad bilden ska uttrycka och hur den kan förstärka ett budskap och vår identitet. Våra bilder är ärliga, tydliga, representativa och lättsamma. Om människor är med i bilderna så ska de ha olika åldrar, kön, etnicitet och geografisk bakgrund läs mer i vår kommunikationsplattform. Illustrationer Vi har flera illustrationer som vi arbetar med i all vår kommunikation. De skildrar folkhögskolans vardag, möten mellan människor och detaljer som symboliserar folkhögskolornas kurser. Fotografier Bilderna som används ska kännas naturliga och äkta. De ska ge känslan av att bilderna är tagna här och nu, som ett klipp ur någons vardag på en folkhögskola. Bilderna berättar hur det är, med en dokumentär känsla. Bilderna är både detalj-, porträtt-, när- och helhetsbilder. Rätt färg i tryck För att färgerna i bilden ska bli bra så måste bilden sparas med rätt cmyk-inställning (ICC-profil). Denna inställning fås av det tryckeri som ska anlitas. Professionell repro rekommenderas på alla foton innan tryck. Rätt färg på webben Gör illustrationerna i rätt rgb-värden och spara alla bilder med färginställningen srgb. 18

19 Bilder Illustrationer Våra illustrationer är handritade och sen arbetade med digitalt för att få en bra känsla. Illustrationer som vi arbetar med skildrar folkhögskolans vardag, olika möten mellan människor och detaljer som symboliserar folkhögskolornas kurser. Människorna är i olika åldrar, har olika kön och etnisk bakgrund. Illustrationerna passar att ha mot en ljus bakgrund men även mot bakgrunder i olika färger. 19

20 Bilder Fotografier Aktiva foton ur folkhögskolans vardag och verkliga situationer. Tänket kring motiven är detsammma som i illustrationerna. Fotografierna ska ge känslan av att bilderna är tagna här och nu ett ostylat och ärligt uttryck i motiven. Manéret i bildredigeringen har skarpa kontraster, en mättad känsla i färgerna och ett något gultonad filter över sig. Redigeringen tillåter bilder med olika färger och ljus att få ett mer konskvent resultat. Bilderna lämnar en varm känsla med attityd och en tydligare avsändare i fotona. Toppbilder på undersidor på webbplatsen Bilder på webbens alla undersidor har en storlek på 580x184 pixlar. 20

21 Grafiskt element För att skapa dynamik i formen och för att kunna bryta ut budskap, citat eller fakta från övrig text har vi tagit fram olika unika boxar som lyfter fram dessa texter. 21

22 Grafiskt element Urval boxarna knyter an till de övriga delarna i profilen med handritad känsla. De används till kortare texter. Texten i boxarna är densamma som här ovan i ingressen, Berranger Hand i versaler. Boxarna finns i våra sex profilfärger, svart och vitt. 22

23 Papper Ett bra papper lyfter självklart fram text och bild på ett bra sätt. Men ett bra papper ska även ge en trycksak något extra. Faktablad Vid utskrift av faktablad använder vi ett matt papper med ytvikten 115 g. Kataloger Kurskatalogerna är den produkt där vi valt papper med omsorg. De båda katalogerna trycks i en upplaga om ex. respektive ex. och vi ställer höga krav på papperet. Folkhögskolekatalogen Inlagan är tryckt på Graphomatt 65 g. Det är ett matt bestruket och läsvänligt tryckpapper som används när tryckkvalitet och bildåtergivning är särskilt viktigt. Omslaget är tryckt på Arctic Silk 150 g. Det är ett fullbestruket papper med en silkeslen, slät yta som återger bild och text perfekt. Båda papperskvaliteterna är svensktillverkade och den totala produktionen av folkhögskolekatalogen är FSC-märkt. FSC är en oberoende, internationell medlemsorganisation som verkar för ett miljöanpassat, socialt ansvarstagande och ekonomiskt livskraftigt bruk av världens skogar. FSC är en förkortning av Forest Stewardship Council. Sommarkurskatalogen Inlagan är tryckt på Solaris Press 51 g. och den låga ytvikten är den främsta orsaken till att vi trycker på detta papper. Papperet är lättbestruket. Omslaget är även det tryckt på Arctic Silk 150 g. 23

24 Tillämpningar På följande sidor hittar du olika exempel, både tryckta och digitala, som kan guida dig vid framtagandet av nya enheter. 24

25 Broschyr Folkhögskolekatalogen framsida Exempel på hur man kan variera typografin och hur man kan integrera logotypen i formen utan att inkräkta på frizonen. inlaga Exempel på två olika uppslag men som båda följer manualens riktlinjer. Typografin på uppslaget längst till vänster är den typografi som är mest återkommande i vår kommunikation. Den återfinns här i manualen och även på informationsblad, brevmallar mm. 25

26 Informationsblad Om folkhögskolan på flera språk blad Typografin är helt i svart så att det lämnas utrymme att kunna trycka bladen på olika färgade ark. 26

27 Brevmall Intern och extern brev Utseendet är detsamma för våra externa och interna brevmallar, förutom en viss skillnad i informationen i sidfoten. Breven kan användas utan citat eller faktarutor. Brevet är detsamma och har samma marginaler, se nedan. 27

28 Webbplats Startsida Sidan bygger på olika moduler som skapar en balanserad helhet. 28

29 Webbplats Moduler startsida Exempel blå länkning Hela fältet för en nyhet (till vänster) eller intervju (nedan) är länkat. Den blå länken Läs mer länkar till en ny sida. Denna typ av blå länkning används alltid när det är en längre text som inte får plats i ytan, jämför med skillnaden nedan kring användningen av en grön pil. Exempel grön pil Hela fältet länkar till respektive ämne. För att förtydliga att det är en länkning så har vi använt en grön pil. Den gröna pilen används bara vid kortare underrubriker som länkar till en ny sida, till skillnad från den blå länkningen, se ovan. 29

30 Webbplats Moduler undersidor Exempel blå länkade rubriker Används endast i listningar Exempel vänstermoduler Rubriker och tillhörande undernivåer använder enbart svart färg i text och länkning. Exempel knappar 30

31 Webbplats Illustrationer illustrationer för ämnesområden och kurskategorier Till vår webbplats har vi tagit fram bilder baserade på våra illustrationer. Dessa symboliserar en kurstyp eller ett ämnesområde. Se mer på webbplatsen. Toppbilder undersidor Bilder på webbens alla undersidor har en storlek på 580x184 pixlar, vilket även dessa illustrationer har. 31

32 Frågor kring manualen? Kontakta Lina Remnert på: eller tel: Folkhögskolornas informationstjänst, FIN Postadress: Box , Stockholm Tel: E-post: