Ungdomsmottagningens varumärkesmanual Version Varumärkesmanual

Transkript

1 Ungdomsmottagningens varumärkesmanual Version Varumärkesmanual Betaversion

2 Ungdomsmottagningens varumärkesmanual Version Innehåll Om du har frågor eller vill ha mer information, kontakta: Lotta Nordh Rubulis, Marknadsenheten liselotte.nordh@sjukvardsradgivningen.se Ett starkt varumärke Varumärket UMO Namnet 1177-familjen Kort om oss Våra gemensamma budskap Stil och ton Vår visuella kommunikation 9 Logotypen Logotypens varianter Logotypens friyta Brandline Undvik att.. 14 Färger Färgpaletten Accentfärger, toningar 17 Typografi Profiltypsnitt Vardagstypsnitt Webbtypsnitt 22 Pappersval 23 Stationaries Visitkort Brevpapper A4 Kuvert C4 och C5 Korrespondenskort Word-mall A4 29 Appliceringar Exempel 1, Annons Exempel 2, Typografi 32 Webbplatsen Riktlinjer

3 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke 1 Starka varumärken baserar sin kommunikation på tydliga budskap och en genomtänkt varumärkesstrategi. En grafisk profil säkerställer att den visuella kommunikationen stödjer varumärket på ett enhetligt och effektivt sätt. Varumärkesmanualen beskriver grunden för vårt gemensamma varumärke och vår visuella identitet. Här finns riktlinjer för hur namn, logotyp, färger och typografi används samt exempel på hur det kan se ut när man applicerar de grafiska riktlinjerna i såväl tryckta som digitala medier. Se manualen som ett stöd i arbetet att skapa en stark och enhetlig visuell kommunikation.

4 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke Varumärket UMO Namnet UMO.se är en nationell webbplats där unga mellan 13 och 25 år kan få råd om hälsa, sex och relationer. Här kan tjejer och killar få svar på frågor som kan upplevas svåra eller känsliga. UMO har utvecklats av Sjukvårdsrådgivningen SVR AB i nära samarbete med en ungdoms-panel, landets ungdomsmottagningar, landsting, regioner och kommuner. Att skapa förutsättningar för lika villkor och ett ökat handlingsutrymme för unga är utgångspunkten i vårt arbete med ungdomsmottagninen.se. Med UMO vill vi förbättra ungas hälsosituation och öka deras kunskap, genom att erbjuda pålitlig och lättillgänglig information. Vi vill också stärka och stödja tjejer och killar i deras identitetsutveckling och ge dem goda förutsättningar att utveckla sunda relationer. Vårt formella namn är Ungdomsmottagningen.se. Det namnet har vi valt för att vi vill vara en länk och en ingång till de fysiska ungdomsmottagningarna. Vi vill underlätta kontakten med de fysiska mottagningarna och vi behandlar delvis samma frågor och ämnesområden som man kan få hjälp med på sin ungdomsmottagning. UMO är vårt tilltalsnamn. Det är det namn som vi i vardagligt tal använder och det namn som är ordbilden för varumärket. UMO är ett namn som är lätt att komma ihåg och har en enkel och ljudenlig stavning. UMO associerar till JämO och HomO och för tankarna till en rättighetsorganisation för unga. UMO uttalas som ett namn, inte som tre bokstäver i en förkortning. UMO kan förekomma med brandline: UMO.se, din ungdomsmottagning på nätet.

5 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke 1177-familjen UMO tillhör 1177-familjen där bland annat webbplatsen 1177.se och telefonrådgivningen 1177 Sjukvårdsrådgivning ingår. Vi delar i grunden samma värden och till utseendet kan man se att vi hör ihop är föräldern, den rådgivande och seriösa, och UMO är den bångstyriga tonåringen som vill uttrycka sig på sitt eget fria vis. Kanske kommer även i framtiden en morförälder i form av äldremottagningen.se att tillhöra familjen. De olika webbplatserna fyller olika behov för olika målgrupper men vilar på samma tanke om en kvalitetssäkrad icke-kommersiell tjänst som alla landsting och regioner gemensamt står bakom. Rent praktiskt kommer i framtiden umo.se och 1177.se att vila på samma tekniska plattform och det ska vara enkelt att ta sig mellan del olika webbplatserna inom familjen.

6 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke Kort om oss Mission UMO ska främja ungas hälsa och lika villkor samt stärka deras självkänsla. Vision UMO ska vara det självklara valet för unga i frågor om sex, hälsa och relationer. Verksamhetsidé UMO är en aktuell och levande och trovärdig webbplats för unga som söker information och dialog om sex, hälsa och relationer. Kärnidentitet Kärnidentiteten är varumärkets tidlösa hjärta och ska beskriva det som gör UMO unikt och värdefullt för vår målgrupp. Vår kärnidentitet är Empowerment. Med det menar vi att vi vill stärka ungas tilltro till den egna förmågan och öka deras handlingsutrymme genom att erbjuda dem kunskap ur ett normkritiskt perspektiv. Kärnvärden Kärnvärdena är vår utvidgade identitet. Den beskriver det vi står för, vår personlighet och våra egenskaper, det som är unikt för oss. Empatisk Normmedveten Respektfull Dynamisk Trovärdig Öppen

7 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke Nyckelord för kommunikationen Äkta och relevant Vi ska vara en tillförlitlig källa som tar ungas frågor och funderingar. - Rak och seriös UMO.se ska vara trovärdiga. Därför undviker vi att använda ungas språk och ungdomliga uttryck. - Informativ Vi krånglar inte till det utan är tydliga och informativa. Identitet Vem är UMO? UMO är någon du kan lita på när du undrar om sex, hälsa och relationer. Hur är UMO? UMO är öppen och nyfiken. UMO lyssnar. UMO är rättfram och vågar säga som det är. Vilken relation har UMO till besökaren? Personlig men inte privat, när men inte kompis. Stil och tonalitet Stil Rak, ärlig, enkel Tonalitet Beskrivande, saklig, korrekt.

8 Ungdomsmottagningens varumärkesmanual Version Ett starkt varumärke Vår visuella kommunikation Det här avsnittet innefattar riktlinjer för illustrationer, fotografier, animationer och filmer som används på UMO.se eller för att marknadsföra UMO. Materialet ska ha en visuell ton som tilltalar och skapar igenkänning hos målgruppen. Materialet ska upplevas inkluderande. Undvik stereotypa och uteslutande normativa återgivningar av verkligheten. Det som visualiseras ska återges ur den unga målgruppens egna perspektiv. Så använder vi visuellt material på UMO.se Vi har ett grafiskt manér där illustrationer är den mest förekommande bildsättningen, i syfte att ge webbplatsen en personlig och sammanhållen stil. Illustrationer används både som information (till exempel en anatomisk bild) och dekoration (exempelvis hjärta med pil genom). Fotografier används när det behövs tydligare och mer verklighetstrogen information. Allt visuellt material ska ha ett inkluderande perspektiv genom att på ett balanserat sätt återge personer med olika kroppsform, sexuell läggning, etnicitet, kön, stil, ålder, religiositet och funktionalitet. Materialet ska också uttrycka respekt och empati för användaren samt så ofta som möjligt lustfylldhet och lekfullhet. Tillgänglighetsanpassning UMO eftersträvar hög tillgänglighet. Kontrastvärdena i bilder ska därför granskas i enlighet med de internationella riktlinjerna för tillgänglighet WCAG (Web Content Accessibility Guidelines). Informationsbärande delar skall vara i god kontrast mot bakgrunden. Kontrastskillnaden ska vara minst 50 procent om man gör om en illustration till svartvitt. Granskning kan göras med hjälpverktyget Contrast Analyzer BD 2.0. Varumärken i visuellt material Återgivande av varumärken i visuellt material ska i den mån det går undvikas på UMO.se. I vissa fall kan det vara svårt att undvika att varumärken kommer med, till exempel i fotografier av preventivmedel. I dessa fall ska minst två olika varumärken visas.

9 Ungdomsmottagningens varumärkesmanual Version Logotypen Logotypen är en mycket viktig del av den visuella identiteten och fungerar som avsändare i all kommunikation. Logotypen är särskilt ritad för UMO och får aldrig reproduceras eller manipuleras. Använd alltid godkända filer från produktionspaketet som är anpassade för just det du ska använda den till.

10 Ungdomsmottagningens varumärkesmanual Version Logotypen Logotypens varianter Logotypen får aldrig reproduceras. Använd alltid godkända orginalfiler. Logotyp Logotypen ska användas i all vår kommunikation; hemsidor, annonsmaterial, brevpapper, presentationer etc. I första hand återges logotypen i UMO Orange eller vitt (inverterad logotyp). Den svarta logotypen används mycket sparsamt och då främst av tekniska skäl. För t ex svartvita tryck som faxblad och dagspress. Logotypknapp Logotypknappen används i sammanhang där avsändaren behöver sticka ut lite extra. Som i t ex annonser eller mot en rörig bakgrund. Logotypknappen finns i alla palettens färger.

11 Ungdomsmottagningens varumärkesmanual Version Logotypen Logotypens friyta Logotypen ska alltid fungera som en tydlig avsändare. För att visuellt skydda och stärka logotypen ska den alltid omges av en fri yta där inga andra element får finnas. Här visas minsta tillåtna friyta. Använd logotypen effektivare med en mer generös friyta såvida inte logotypen ska kopplas till ett särskilt budskap. Friytan baseras på ordmärkets höjd och den principen gäller för alla varianter av logotypen.

12 Ungdomsmottagningens varumärkesmanual Version Logotypen Logotyp med brandline Logotypen kan även kombineras med vår brandline UMO.se, din ungdomsmottagning.. Brandline skrivs alltid versalgement med Proxima Nova Condensed, Semibold. I UMO orange, svart eller vitt. Brandline placeras med logotypen enligt anvisningarna på den här sidan, men kan även kommuniceras ensamt, dock ska alltid logotypen finnas med som avsändare någonstans. UMO.se, din ungdomsmottagning.

13 Ungdomsmottagningens varumärkesmanual Version Logotypen Undvik att.....återge logotypen med annan färg eller mönster än vad som anges i detta avsnitt...återge logotypen med kantlinjer...rotera eller förändra logotypens proportioner...beskära logotypen. Välkommen till: Lorem ipsum dolor sit amet consectetuer adipiscing elit. Vestibulum vehicula ut posuere semper ipsum cursus mi vitae feugiat...rama in logotypen...inkräkta på logotypens friyta...använda logotypen som företagsnamn i löpande text...placera logotypen mot en bakgrund som gör den otydlig.

14 Ungdomsmottagningens varumärkesmanual Version Färger Färg är ett effektivt verktyg för att skapa ett enhetligt uttryck i vår kommunikation. Vår färgpalett specificeras i färgformaten Pantone, CMYK och RGB, för att så långt som det är möjligt säkertställa att färgerna upplevs lika i alla kanaler. För CMYK-tryck bör alltid en PANTONE -färgreferens bifogas för att säkerställa önskat resultat.

15 Ungdomsmottagningens varumärkesmanual Version Färger Färgpaletten Våra färger är indelade i huvudfärg och accentfärger. Huvudfärgen är den färg som UMOs närmast ska förknippas med och som därför alltid ska dominera accentfärgerna i t ex annonser, omslag på foldrar och broschyrer. Accentfärgerna och deras toner är speciellt framtagna för att fungera väl med huvudfärgen. Huvudfärg PANTONE 485 U CMYK RGB Accentfärger PANTONE 211 U CMYK RGB PANTONE 305 U CMYK RGB PANTONE 382 U CMYK RGB PANTONE Cool Gray 10 U CMYK RGB Använd färger, toner och toningar med gott omdöme. Sträva efter ett lekfullt och varierat uttryck utan att intrycket blir rörigt. PANTONE Black U CMYK RGB 0.0.0

16 Ungdomsmottagningens varumärkesmanual Version Färger Accentfärger, toningar Att använda toner och toningar är ett sätt att göra stora färgytor mjukare. Extra användbart i digital produktion. Accentfärgerna är lämpliga för att utmärka viss information. För att öka användbarheten är det tillåtet att använda deras toner. 100% 80% 60% 40% 20% RGB RGB RGB RGB RGB RGB

17 Ungdomsmottagningens varumärkesmanual Version Typografi 4 Med ett textuttryck som skiljer sig från andra aktörer kan ett företag kännas igen på sin typografi lika mycket som för sin logotyp. Typografi blir en röd tråd i uttryck och tonalitet i all vår kommunikation. Det ger en enhetlig och trovärdig bild av UMO. Vi skiljer på profiltypsnitt som används för all extern kommunikation som annonser, broschyrer, trycksaker m.m. Vardagstypsnitt för intern korrespondens som dokument och presentationer. Samt Webbtypsnitt som används på webbplatsen.

18 Ungdomsmottagningens varumärkesmanual Version Typografi Profiltypsnitt Profiltypsnitten används främst av leverantörer vi samarbetar med för att producera professionellt tryckt material. Som t ex annonser, broschyrer, utställningsmaterial m.m. Vi använder tre olika typsnittsfamiljer som kompletterar varandra och bidrar till god läsbarhet och igenkänning. I avsnittet Appliceringar finns typografiskt exempel. Jubilat abcdefghijklmnopqrstuvwxyzåäö ,.;:-!?=&%/() Jubilat är ett karaktärsfullt rubrikstypsnitt som sticker ut och präglar tonen i tilltalet på ett sätt som passar UMO. Jubilat Darden Typeface Design Studio Proxima Nova FontShop Adobe Garamond Pro Adobe Proxima Nova abcdefghijklmnopqrstuvwxyzåäö ,.;:-!?=&%/() Proxima Nova är ett mycket flexibelt typsnitt som bl a passar bra för kortare texter, ingresser och mellanrubriker. Adobe Garamond Pro abcdefghijklmnopqrstuvwxyzåäö ,.;:-!?=&%/() Adobe Garamond Pro är ett klassiskt serif-typsnitt som passar utmärkt för längre löpande text.

19 Ungdomsmottagningens varumärkesmanual Version Typografi Jubilat ExtraLight Jubilat Extra LightItalic Jubilat Light Jubilat LightRegular Jubilat Regular Jubilat RegularItalic Jubilat Medium Jubilat MediumItalic Jubilat Bold Jubilat BoldItalic Jubilat Black Jubilat BlackItalic Proxima Nova Thin Proxima Nova Light Proxima Nova Regular Proxima Nova Semibold Proxima Nova Bold Proxima Nova Extrabold Proxima Nova Black Proxima Nova Condensed Thin Proxima Nova Condensed Light Proxima Nova Condensed Regular Proxima Nova Condensed Semibold Proxima Nova Condensed Bold Proxima Nova Condensed Extrabold Proxima Nova Condensed Black Proxima Nova Extra Condensed Thin Proxima Nova Extra Condensed Light Proxima Nova Extra Condensed Regular Proxima Nova Extra Condensed Semibold Proxima Nova Extra Condensed Bold Proxima Nova Extra Condensed Extrabold Proxima Nova Extra Condensed Black Adobe Garamond Pro Regular Adobe Garamond Pro Italic Adobe Garamond Pro Semibold Adobe Garamond Pro Semibold Italic Adobe Garamond Pro Bold Adobe Garamond Pro Bold Italic Välj eller kombinera skärningar beroende på tonen i budskapet. Undvik att sätta rubriker med enbart versaler. Proxima Nova Extra Condensed ska användas sparsamt men kan passa för t ex formulär och tabeller som ställer krav på mycket text på liten yta.

20 Ungdomsmottagningens varumärkesmanual Version Typografi Vardagstypsnitt Intern och extern korrespondens via exempelvis brev, PM, fax och digitala presentationer skrivs i Arial och Garamond. Dessa typsnitt finns installerade i alla system och på alla datorer och på så vis underlättas hanteringen av denna typ av dokument. Tahoma abcdefghijklmnopqrstuvwxyzåäö Tahoma används för rubriker Garamond abcdefghijklmnopqrstuvwxyzåäö ,.;:-!?=&%/() Garamond används främst för löpande text

21 Ungdomsmottagningens varumärkesmanual Version Typografi Webbtypsnitt För webbtypografi använder vi de webbsäkra typsnitten Tahoma och Arial som finns installerade i alla system och på alla datorer. Tahoma abcdefghijklmnopqrstuvwxyzåäö Tahoma används för rubriker. Arial abcdefghijklmnopqrstuvwxyzåäö Arial används för löpande text.

22 Ungdomsmottagningens varumärkesmanual Version Pappersval 5 Pappret är en viktig del av upplevelsen. Vi använder alltid naturvitt och obestruket Scandia 2000, eller motsvarande. En annan papperstyp, t ex helvitt eller bestruket påverkar upplevelse och färgåtergivning och bör undvikas. Vid CMYK-tryck bör alltid en PANTONE -färgreferens bifogas för att säkerställa önskat resultat. Detta är extra viktigt för vår röda huvudfärg. Scandia 2000 tillverkas av Klippan AB, som är kvalitetssäkrat enligt ISO Papperet är TCFmärkt (Totally Chlorine-Free) och åldersbeständigt. För Svanenmärkning krävs att såväl papper som tryckeri är godkänt ur miljösynvinkel. Scandia 2000 uppfyller dessa delkrav. En fullständig miljövarudeklaration finns att hämta på

23 Ungdomsmottagningens varumärkesmanual Version Stationaries Korrespondens är en viktig bärare av UMOs varumärke och ska ha ett enhetligt utseende. För varje trycksak finns en dokumentmall som ska användas för reproduktion.

24 Ungdomsmottagningens varumärkesmanual Version Stationaries Visitkort Liselotte Nordh Rubulis Kommunikatör liselotte.nordh@sjukvardsradgivningen.se Direkt Mobil Sjukvårdsrådgivningen SVR AB Hornsgatan 15, Stockholm Växel Fax UMO.se, din ungdomsmottagning. Visitkort Papper: Scandia 2000, 270g Format: 90x55mm Färger: Svart + Pantone Orange 021 U Typsnitt: Jubilat Bold, Proxima Condensed, Regular Mall: Stationaries/Visitkort/Visitkort.indd

25 Ungdomsmottagningens varumärkesmanual Version Stationaries Brevpapper Ungdomsmottagningen Hornsgatan 15, Box Stockholm Vxl Fax Telefontid vardagar E-post info@umo.se Hemsida Ungdomsmottagningen Hornsgatan 15, Box Stockholm Vxl Fax Telefontid vardagar E-post info@umo.se Hemsida Brevpapper A4 Papper: Scandia 2000, 105g Format: 210x297mm Färger: Svart + Pantone Orange 021 U Typsnitt: Proxima Condensed, Regular Mall: Stationaries/Brevpapper/Brevpapper_A4.indd

26 Ungdomsmottagningens varumärkesmanual Version Stationaries Kuvert Ungdomsmottagningen Hornsgatan 15, Box Stockholm Ungdomsmottagningen Hornsgatan 15, Box Stockholm Kuvert C4 Papper: Scandia 2000, 115g Format: 324x229mm Färger: Svart + Pantone Orange 021 U Typsnitt: Proxima Condensed, Regular Mall: Stationaries/Kuvert/Kuvert_C4.indd Ungdomsmottagningen Hornsgatan 15, Box Stockholm Ungdomsmottagningen Hornsgatan 15, Box Stockholm Kuvert C5 Papper: Scandia 2000, 115g Format: 229x162mm Färger: Svart + Pantone Orange 021 U Typsnitt: Proxima Condensed, Regular Mall: Stationaries/Kuvert/Kuvert_C5.indd

27 Ungdomsmottagningens varumärkesmanual Version Stationaries Korrespondenskort Ungdomsmottagningen Hornsgatan 15, Box Stockholm Vxl Fax Telefontid vardagar E-post info@umo.se Hemsida Ungdomsmottagningen Hornsgatan 15, Box Stockholm Växel Fax Telefontid vardagar E-post info@umo.se Hemsida Korrespondenskort Papper: Scandia 2000, 270g Format: 150x105mm Färger: Svart + Pantone Orange 021 U Typsnitt: Proxima Condensed, Regular Mall: Stationaries/Korrespondenskort/Korrespondenskort.indd

28 Ungdomsmottagningens varumärkesmanual Version Stationaries Word-mall Ungdomsmottagningen Hornsgatan 15, Box Stockholm Vxl Fax Telefontid vardagar E-post info@umo.se Hemsida Word-mall Format: A4 Typsnitt: Tahoma Mall: Stationaries/Word-mallar/Brevpapper_A4.doc

29 Ungdomsmottagningens varumärkesmanual Version Appliceringar Avsnittet illustrerar hur den grafiska profilen kan appliceras för en tydlig och enhetlig visuell identitet. Se inte avsnittet som ett regelverk utan som stöd och inspiration. Detta avsnitt kommer växa i takt med att fler produktioner slutförs med vår nya grafiska profil. Du kan alltid hämta den senaste versionen av manualen på vår webbplats.

30 Ungdomsmottagningens varumärkesmanual Version Appliceringar UMO.se, din ungdomsmottagning.

31 8 Appliceringar Ungdomsmottagningens varumärkesmanual Version

32 Ungdomsmottagningens varumärkesmanual Version Webbplatsen Här sammanfattas några riktlinjer för webbplatsen.

33 Ungdomsmottagningens varumärkesmanual Version Webbplatsen Riktlinjer webbplats Färger UMO.se:s sidhuvud är i huvudfärgen orange RGB Den används också i grafiska element såsom puffen Hitta din ungdomsmottagning och Panikknappen. Den används i undermenyerna som bakgrundsfärg och är därmed den färg som präglar UMO.se starkast. De andra färgerna som primärt används är: Grön RGB Bakgrundsfärg till rubriker på artikelpuffar på startsidan, puffen Läsarnas berättelser och ämnestexternas rubriker. Blå RGB Puffen Nyheter från UMO.se, puffen Välj ord för könen. Grå RGB Grafiska element på startsidan/ ikoner för funktioner på UMO.se: Se avsnittet Färger för mer information. Informationsrutor i ämnestexter I ämnestexter kan det förekomma informationsrutor som lyfter fram viss text. Informationsrutor är egna textkomponenter. För två informationsrutor har bakgrundsplattor skapats med varsin färg: Grön används i bakgrundsplattan till textkomponenten Faktaruta. Blå används i bakgrundsplattan till textkomponenten Statistik. Riktlinjerna för alla typer av informationsrutor i texter är att de ska ha den färg som motsvarar 20% av någon av accentfärgerna och 5 pixlar rundade hörn. Foton och illustrationer på startsidan Illustrationer och foton som inte är frilagda rundas i hörnen med 5 pixlars rundning. Bilder i Nyheter från UMO.se ska vara max 52 pixlar i bredd. Bilder i puffytorna till vänster på startsidan ska vara max 230 pixlar i bredd. Bilder i puffblocket till höger på startsidan ska vara max 230 pixlar i bredd (till exempel bild till Filmtips). Foton och illustrationer i texter Illustrationer och foton som inte är frilagda rundas i hörnen med 5 pixlars rundning. Foton som inte är helt frilagda och som har vit bakgrund ges en grå ram (RGB ) som har 5 pixlars rundning i hörnen. Bilder som ligger inuti text (höger- eller vänsterjusterad) ska vara max 300 pixlar breda. Bilder som ligger centrerade mellan två textstycken bör vara minst 300 pixlar breda. Knappar Tahoma Bold 10,5pt Indrag 20pt 10px Knapptext 10px 10px» Sök 10px Menyknappar Tahoma Bold 10,5pt Indrag 20pt 10px Menyval 10px Marginalen på 10px justeras vid behov för att fylla ut hela menyraden som är 912px. Typografi Rubriker Tahoma Bold 18pt/20pt Indrag 20pt Brödtext Arial Artikelpuffar Tahoma Bold 15pt/20pt Indrag 20pt Se avsnittet Typografi för mer information.

34 Ungdomsmottagningens varumärkesmanual Version Du hittar manualen och alla filer vi hänvisar till på internet, Produktion: Sjukvårdsrådgivningen SVR AB, Marknadsenheten Grafisk design och orginal : Deasign AB Typografi: Jubilat och Promixa Nova Condensed Sjukvårdsrådgivningen SVR AB 2008