Visuell identitet

Hur vi ser ut

Submeny

Om vår visuella identitet

Vårt designsystem består av flera olika byggstenar som tillsammans utgör den visuella identiteten; logo- typ, typsnitt, färger, bilder och vår finurliga linje.

Byggstenarna kan användas fristående i enlighet med våra riktlinjer.

Med den visuella identiteten vill vi skapa tydlighet och en stark igenkänning av vår mötesplats. Vi hopp- as att vi med detta verktyg kan inspirera alla som ska arbeta med Hallarna till att vilja bidra till utvecklingen på bästa sätt

Logotyp

Variant 1

Det här är vår logotyp. Den består av två delar – ordbilden med de symboliskt höjda L:en och den finurliga linjen.

De två L:en i vår logotyp för associationen till platsens karakteristiska torn.

Logotypen finns i två olika varianter, en primär och en sekundär, som visas och beskrivs närmare på följande sidor.

Logotypen är funktionell och läsbar i både stora som små storlekar.

Frizon

För att logotypen ska framträda tyd- ligt i alla sammanhang är det viktigt att respektera frizonen. Frizonen är det minsta avståndet runt logotypen som ska vara fritt från text.

Bredden av ”H” definierar en kvadrat som användas som ett mått för att hålla logotypen fri från andra element.

Variant 2

När förutsättningarna är begränsade använder vi variant 2 av vår logotyp. För den är formen på linjen alltid densamma och ändras aldrig. Linje- formen är densamma som i variant 1.

Vi använder också vår variant 2 när vi samarbetar med andra aktörer i deras ägda kanaler, te x sponsrar en specifik händelse.

Frizon

För att logotypen ska framträda tyd- ligt i alla sammanhang är det viktigt att respektera frizonen.

Frizonen är det minsta avståndet runt logotypen som ska vara fritt från text. Vi använder oss av samma frizon i variant 2 som variant 1.

Bredden av ”H” definierar en kvadrat som användas som ett mått för att hål- la logotypen fri från andra element.

Användning av logotyperna

I första hand är vår logotyp alltid
vit. När den vita logotypen används tillsammans med någon av våra pro- filfärger får vi en tydlig läsbarhet och skapar samtidig en stark igenkänning.

Vissa bakgrunder tillåter inte vit text då kontrast och läsbarhet inte blir optimal. Då kan istället svart logotyp användas. Den svarta logotypen kan också användas i de fall färgtryck inte är möjligt eller ekonomiskt försvar- bart.

Vid användning av logotypen på bilder var noga med att välja bilder med ytor där det är lätt att placera logotypen. Tänk också på kontrasten. Det är viktigt att logotyp och text framträder tydligt tillsammans med bilden.

Placering av logotyperna

I första hand placerar vi logotypen i nedre högra hörnet. En klassisk plats för en logotyp men som också tillåter vår finurliga linje att ta plats och sam- spela med logotypen.

I andra hand placerar vi logotypen är centrerad på ytan. Antingen i både höjd- och sidled alternativt bara centrerad i sidled. Vi centrerar t ex logotypen för end screens i digital kommunikation samt för format som är högsmala, exempelvis banners på webb.

Do's & Don'ts

Do

Variant 1 av vår logotyp arbetar dyna- miskt med den finurliga linjen. Linjen rör sig på ett levande och organiskt sätt över ytor och format för att skapa olika kommunikativa uttryck. Linjen ansluter alltid till ordbilden på samma sätt och med samma form som linjen i variant 2.

Don't

Den finurliga linjen ska aldrig ansluta från höger eller från båda håll.

Ladda ner

Typografi

Primärt typsnitt

Vårt primära typsnitt heter Galano Grotesque och är en sk geometrisk sans serif. Typsnittet har ett modernt uttryck och en funktionell form med bra läsbarhet i alla lägen. De geometriska formerna samspelar bra med bokstavsformerna i logotypen och den jämntjocka finurliga linjen. Typsnittet kommer med skärningar för både print och web.

Vi använder normalt vikterna Semi Bold och Regular. Vikten Semi Bold används i rubriker och kortare texter och passar bra ihop med vår finurliga linje. Vikten Regular används
vid längre texter. Variation av övriga vikter kan förekomma på exempelvis digitala applikationer för att skapa ett optiskt sammanhållet uttryck.

Sekundärt typsnitt

Vårt sekundära typsnitt heter Bressay och är anpassat för bra läsbarhet i längre texter i print och för web.

Grundläggande riktlinjer

Vi pratar tydligt och håller rubriken kort, max två rader. När vi behöver säga något mer använder vi en kort ingress/text. Öppettiderna har vi med i nedre vänstra hörn. Logotypen placeras i första hand i nedre högra hörnet. Linjen tar för sig utifrån vad det är vi vill kommunicera.

Färger

Basfärger

Våra basfärger är hämtade från grundkonceptet för ombyggnad och inredning av Hallarna. Neutrala och naturliga färgtoner, inspirerade av naturen i Halland, med svart och vitt som grund. Basfärgerna används i både permanent och mer tillfällig kommunikation.

Komplementfärger

Som komplement använder vi en betydligt mer färgstark skala som bidrar med puls och energi. Färgerna kontrasterar med huset och visar tydligt vad som är på gång. Dessa färger använder vi när vi skapar kampanjer, annonser och innehåll till våra sociala plattformar samt hemsida. Komplementfärgerna återfinns primärt i bakgrunder till grafiskt material och som fonder tilG fotografier.

Genom att använda en färggrupp (blått, grönt, gult) åt gången förenklar vi och skapar tydlighet i det som kommuniceras, se exempel på följande sidor.

Komplementfärger digitalt

För att skapa en dynamisk och användarvänlig upplevelse online har vi definierat ett urval av kompletteringsfärger som endast används på webbplatsen. Dessa färger kompletterar vår huvudpalett och hjälper till att lyfta fram specifika element, skapa kontrast och guida användaren genom digitalt innehåll.

Kompletteringsfärgerna används sparsamt och strategiskt för att säkerställa att webbplatsens design förblir tydlig och i linje med vår visuella identitet. De stärker upplevelsen utan att konkurrera med huvudfärgerna, vilket upprätthåller ett konsekvent och harmoniskt uttryck.

Bakgrund (Primär) och Text (Sekundär)
HEX: #ffffff

Bakgrund (Sekundär) och Bakgrund (Alt. 3)
HEX: #F6F4F1

Text (Primär), Rubrik, knapp och svart
HEX: #222222

Rubrik 2
HEX: #C5A183

Knapp (Hover), tagg och Text länk
HEX: #2078E9

Header, Footer och Text (Hover)
HEX: #BFB19F

Border
HEX: #0000001A

Image Overlay
HEX: #00000066

Material

Färgen/materialet brons används till exempelvis ljusskyltar vid entréer.

Ladda ner

Grafiskt element

Den finurliga linjen

Den finurliga linjen är en av våra viktigaste identitetsbärare. Den har alltid en framträdande roll i våra kanaler och är ett smart verktyg för att skapa stark igenkänning. Linjen bidrar med energi, lekfullhet och hjälper till att skapa tydlighet i vår kommunikation. Linjen används i nära relation med logotypen men används också fristående.

Dynamisk variation

Vår finurliga linje kan ta en mängd olika skepnader och uttryck.
Vi delar in användningen inom tre olika kategorier:

Abstrakt

Linjen är del i Hallarnas logotyp och är ett bra verktyg för att skapa energi och finurlighet. Primärt använder vi oss av en mjuk böljande linje. Beroende på kampanjtema finns utrymme att ibland kontrastera med andra uttryck som t ex rakare, kanti- gare eller snabbare linjer.

Illustrativ

Linjen kan med fördel användas för att skapa illustrationer som förstärker budskapet och kampanjteman.

Vägledande

Linjen används på våra permanenta enheter, t ex skyltning, cykelställ, lek- eller parkeringsplatser och har då som syfte att vägleda våra besökare rätt och förtydliga kommunikation på ett dynamiskt sätt.

Don'ts

  • Variera inte färg på linjen.
  • Variera inte tjocklek på linjen.
  • Använd inte linjen för att skriva ord eller bokstäver.
  • Förlora inte finurligheten i linjen genom att vara statisk.

Animationsmanér

Den finurliga linjen är tacksam att ani- mera vilket bidrar med ytterligare en dimension i vår berättelse om Hallarna.

Linjens rörelse kan animeras snabbt eller långsamt, mjukt eller ryckigt, försiktigt eller kraftfullt – den upplevda känslan i animationen kan varieras utefter vilken historia som ska berättas. Grundreglerna för vårt animations- manér är:

Böljande linje

Långsammare, mjuk animation.

Kantig linje

Snabbare, ryckigare animation. Animationer är ett användbart verktyg för digitala skärmar inne i och utanför byggnaden, på vår hemsida samt i våra sociala kanaler.

Ladda ner

Bildspråk

Bildspråk med människor

När vi skapar imagebilder med människor fotar vi i studio mot bakgrundsfärger från vår färgskala. De enkla och rena bakgrunderna möjliggör för vår finurliga linje att addera energi, förtydliga och engagera. Människorna vi fotograferar är från många olika åldersgrupper och klasser. De utstrålar värme och har ett naturligt och okonstlat uttryck.

Bildspråk för produktfoto

Produkter fotar vi i studio mot bakgrundsfärger från vår färgskala. De enkla bakgrunderna möjliggör för vår finurliga linje att skapa energi, förtydliga och engagera. Vi använder en färggrupp åt gången, dvs bilden har en blå/grön/gul/naturfärgad bas. Produkterna i bilden kan komplettera eller kontrastera, men bör inte konkurrera ut bakgrundsfärgen.

En viss ordningssamhet i stylingen av produkterna krävs för att den dynamiska linjen ska få utrymme.

Fågelperspektiv

Som dessa exempel visar så är ett rakt-uppifrån-perspektiv smart och flexibelt för produktfoto med en enkel färgad bakgrund.

Perspektiv med djup

För vissa produkter och vid vissa tillfällen finns behov av ett perspek- tiv med djupverkan, och dessa bilder intill visar exempel på det.

Återigen, de enkla bakgrunderna möjliggör för vår finurliga linje att skapa energi, förtydliga och engagera. I vissa fall kan en bakgrundsfond ersättas av ett färgat material som beskärs vid utfallet.

Exempel på bildhantering

Perspektiv med djup

För vissa produkter och vid vissa tillfällen finns behov av ett perspek- tiv med djupverkan, och dessa bilder intill visar exempel på det.

Återigen, de enkla bakgrunderna möjliggör för vår finurliga linje att skapa energi, förtydliga och engagera. I vissa fall kan en bakgrundsfond ersättas av ett färgat material som beskärs vid utfallet.

Piktogram

Våra ikoner är framtagna för att vara tydliga och lätta att känna igen samtidigt som de speglar och kompletterar logotypen och typsnittet i mötet mellan runda och skarpa former.

Våra egna ikoner

I största möjliga mån, försöker vi att rita egna ikoner som är unika för C4. De används tillexempel på skyltar i fysisk miljö samt i annonser mm.

Ikoner från Noun Project

I största möjliga mån, försöker vi att rita egna ikoner som är unika för C4. De används tillexempel på skyltar i fysisk miljö samt i annonser mm.

Ladda ner