-verkkosivuston KUVAMAAILMAn ohjeistus
JOHDANTO Kuvat ovat tärkeä osa Espoon kaupungin viestintää, ja siksi ne on suunnitellaan ja valitaan huolellisesti. Espoo.fi-sivuston kuvat tukevat kaupungin visuaalista identiteettiä (logo, värit, kaarielementit). Ne ovat sisällöllisesti ja teknisesti laadukkaita. Sisällössä otetaan huomioon tavoitellut viestit. Teknisesti laatua ovat esimerkiksi resoluutio, kontrasti, värit ja terävyysalueet. Visuaalinen identiteetti on määritelty kaupungin graafisessa ohjeessa, joka löytyy Essistä viestinnän sivuilta. Tämä ohjeisto on tehty auttamaan ja ohjaamaan sekä sopivien olemassa olevien kuvien valintaa, että kuvasuunnittelua, kuvausten järjestelyä ja valokuvaajien ohjeistamista. Ohjeiston avulla varmistetaan sivuston laadukas ja yhtenäinen ilme. Lisätietoja kuvista ja valmiit banneripohjat löydät verkkoviestinnän sivuilta Essistä. Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 2
TAVOITE- MIELIKUVA Kuvamaailma ilmentää Espoon kaupungin tavoitemielikuvaan määriteltyjä asioita: - innovatiivisuus - edelläkävijyys - luovuus - suvaitsevaisuus - monikulttuurisuus - luonto - kestävä kehitys - hyvät palvelut - turvallisuus Kuvat korostavat: - tunnetta - kokemuksia - elämyksiä - ihmisläheisyyttä - positiivisuutta - lämpöä Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 3
KUVATYYLI Espoo on elävä, aktiivinen kaupunki. Kun kuvataan Espoota, kuvataan elämää. Kuvien tyylistä Aktiivista elämää kuvaamaan sopii liikettä korostava kuvaustyyli. Kuvissa ihmiset tekevät ja liikkuvat. Vältetään asetelmallisuutta ja poseeraamista. Tilanteet ovat mahdollisimman luonnollisia. Henkilöt eivät katso kameraan vaan heidät on kuvattu kesken tapahtuman. Epäterävyys kuvattavan kohteen etu- ja/tai taka-alalla korostaa liikettä ja vie katsojan lähemmäksi kohdetta ja koettavaa hetkeä. Mitä lähemmäksi menemme, sen voimakkaampi on kuvan tunne. Kuvien sisällöstä Rakennukset ja ympäristö eivät ole vaan materiaaleja ja muotoja. Ne ovat paikkoja, jotka mahdollistavat monenlaista toimintaa. Kun kuvataan rakennuksia tai ympäristöä, ne kuvataan siinä tarkoituksessaan mihin ne on tarkoitettu, käyttäjiensä näkökulmasta, niin että mukana on aina ihminen kokija. Espoon luontoa kuvataan luontoa arvostavien ihmisten kokemusten kautta, käytössä. Espoon palveluita kuvataan palveluiden käyttäjän näkökulmasta, kokemuksina. Espoon asukkaita kuvatessa kuvataan kaikenlaisia ihmisiä. Espoota kuvatessa korostetaan innovaatioita, uusia näkökulmia ja yllätyksellisyyttä. Asiat tuodaan esille asukkaiden, vierailijoiden ja kokijoiden näkökulmasta. Esimerkiksi arkkitehtuuria tai kuvataiteita tuodaan esille kokemuksen kautta. Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 4
KUVATYYLI - Voimakas epäterävyys etu- ja/tai takaalalla - Liikkeen tuntu - Ihminen mukana, mutta ei poseeraten, vaan kuvattuna kesken tapahtuman - Lähikuvaus ja tiukat rajaukset - Pääosassa tunne ja kokemus Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 5
KUVATYYLI EI katsota tilanteita kaukaa ja ulkopuolisena....vaan näytetään se läheltä, tilanteen sisältä. EI näytetä pelkkää tilaa ilman elämää....vaan näytetään se elämä mitä tilassa tapahtuu ja koetaan. Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 6
KUVATYYLI EI näytetä poseerauksia...vaan luonnollisia tilanteita. EI näytetä kuvia, joissa kukaan ei ole pääosassa...vaan näytetään tapahtuma selkeästi jonkun kokemuksena, jonkun näkökulmasta. Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 7
KUVATYYLI EI näytetä rakennuksia...vaan näytetään rakennuksien sisällä olevaa elämää. EI näytetä liikennettä...vaan näytetään se mitä liikenteessä tapahtuu. Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 8
ETUSIVUN PÄÄKUVAN OHJEISTUS Kuva-aihe täyttää koko bannerialueen. Etusivun kaarigrafiikkaan tehdään liikettä flash-tekniikalla. Kaarigrafiikka liikkuu hitaasti kuvan päällä asettuen joko kuvan vasempaan tai oikeaan laitaan tai alareunaan. Liike toistuu aina kun sivun lataa uudestaan. Samalla vaihtuu myös kuva-aihe. Bannerin koko: 760 x 210 px Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 9
VÄLILEHTIEN PÄÄKUVIEN OHJEISTUS Kuva-aihe täyttää koko bannerialueen. Kaarigrafiikka voidaan sijoittaa bannerin oikeaan, vasempaan tai alalaitaan. Kaarigrafiikan paikka valitaan kuvaan parhaiten sopivaksi. Bannerin koko: 760 x 210 px Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 10
Ilmoittaudu kesän uimakouluun >>> ALAREUNAN BANNERIKUVIEN OHJEISTUS, kuvallinen versio Ilmoittaudu talven luistelukouluun >>> Kuvallinen versio: Kuva sijoitetaan bannerin vasempaan laitaan. Kuvan ja pohjavärin raja tehdään saumattomasti liukuvaksi. Pohjaväriksi valitaan jokin bannerin kuudesta pohjavärivaihtoehdosta. Pohjaväri valitaan aina kuvaan sopivaksi. Kaarigrafiikka sijoitetaan bannerin oikeaan laitaan. Teksti keskitetään korkeussuunnassa bannerin korkeuden mukaan ja leveyssuunnassa bannerin pohjavärin rajaaman alueen mukaan. Otsikkofonttina on Espoon kaupungin graafisen ohjeiston mukainen Interstate Bold ja mahdollisessa linkissä käytetään saman fontin ohuempaa leikkausta Interstate Regular. Ellei Interstate-fonttia ole saatavilla, käytetään Arial-fonttia. Bannerin koko: 760 x 100 px Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 11
ALAREUNAN BANNERIKUVIEN OHJEISTUS, Graafinen versio Graafinen versio: Pohjaväriksi valitaan jokin bannerin kuudesta pohjavärivaihtoehdosta ja kaarigrafiikka sijoitetaan joko bannerin oikeaan, vasempaan tai alalaitaan (ks. väriarvot ja kaarien sijoittelumallit seuraavilta sivuilta). Teksti keskitetään korkeussuunnassa bannerin korkeuden mukaan ja leveyssuunnassa bannerin leveyden mukaan. Otsikkofonttina on Espoon kaupungin graafisen ohjeiston mukainen Interstate Bold ja mahdollisessa linkissä käytetään saman fontin ohuempaa leikkausta Interstate Regular. Ellei Interstate-fonttia ole saatavilla, käytetään Arial-fonttia. Bannerin koko: 760 x 100 px Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 12
KAARIGRAFIIKAN JA VÄRIEN KÄYTTÖ ALAREUNAN bannereissa Kaarigrafiikka bannerin alalaidassa. Pohjavärivaihtoehdot: T.SIN 0/80/187 RGB K.SIN 36/159/255 RGB V.SIN 159/193/211 RGB LIME 198/219/0 RGB KELT 255/206/0 RGB ORAN 255/115/0 RGB Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 13
KAARIGRAFIIKAN JA VÄRIEN KÄYTTÖ ALAREUNAN bannereissa Kaarigrafiikka bannerin oikeassa laidassa. Pohjavärivaihtoehdot: T.SIN 0/80/187 RGB K.SIN 36/159/255 RGB V.SIN 159/193/211 RGB LIME 198/219/0 RGB KELT 255/206/0 RGB ORAN 255/115/0 RGB Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 14
KAARIGRAFIIKAN JA VÄRIEN KÄYTTÖ ALAREUNAN bannereissa Kaarigrafiikka bannerin vasemmassa laidassa. Pohjavärivaihtoehdot: T.SIN 0/80/187 RGB K.SIN 36/159/255 RGB V.SIN 159/193/211 RGB LIME 198/219/0 RGB KELT 255/206/0 RGB ORAN 255/115/0 RGB Espoon verkkosivuston kuvamaailman ohjeistus 2/2012 15