18. JOULUKUUTA 2014 AUDIOVISUAALISEN VIESTINNÄN AMMATTITUTKINTO JULKAISUGRAFIIKKA JA VERKKOVIESTINTÄ MUSTONEN TIINA NÄYTTÖTYÖN DOKUMENTAATIO

Koko: px
Aloita esitys sivulta:

Download "18. JOULUKUUTA 2014 AUDIOVISUAALISEN VIESTINNÄN AMMATTITUTKINTO JULKAISUGRAFIIKKA JA VERKKOVIESTINTÄ MUSTONEN TIINA 1349700 NÄYTTÖTYÖN DOKUMENTAATIO"

Transkriptio

1 18. JOULUKUUTA 2014 AUDIOVISUAALISEN VIESTINNÄN AMMATTITUTKINTO JULKAISUGRAFIIKKA JA VERKKOVIESTINTÄ MUSTONEN TIINA NÄYTTÖTYÖN DOKUMENTAATIO

2 SISÄLLYSLUETTELO 2 ENGLISH SUMMARY 3 CURRICULUM VITAE 4 JULKAISUGRAFIIKKA 5 PROJEKTIKUVAUS 5 LIIKEMERKIN JA ESITTEEN SUUNNITTELU: TERAPIAKESKUS PURO 5 TAUSTAA 5 Liikemerkin suunnittelu 6 ITSEARVIO 10 Esitteen, PowerPoint-teeman ja käyntikortin suunnittelu 12 ITSEARVIO 15 VERKKOVIESTINTÄ 16 PROJEKTIKUVAUS 16 INTERNET-SIVUJEN SUUNNITTELU: CHIPPEWA RANGE 16 TAUSTAA 16 TAVOITE 16 PROJEKTIN KULKU 17 Layoutin suunnittelu 17 Koodin muokkaaminen 23 Jälkihoito 25 ITSEARVIO 25 MUITA TÖITÄ 25 2

3 ENGLISH SUMMARY Logo, brochure, business card, PowerPoint-theme Terapiakeskus Puro (Therapy centre Puro) needed a logo for their web pages and brochures. During the process it turned out that other marketing material was needed too, i.e. photos, brochures and business cards and PowerPoint theme. The planning started in January 2014, the logo was ready in May 2014 and other material in October The main idea for the logo was that it needed to combine the three logos of the companies, which make together the therapy centre. The companies are Terapiamerkurius, Terapiaperhonen and Toimintaterapia Päivi Turkki. The most challenging thing in the planning process was that the logo styles differed a lot from each other. Other requirements were that the logo needed to be colourful, playful and it also needed to express the element of water, river or similar, because the name Puro means river. The logo was executed with Illustrator and the final versions (colour, black & white, grayscale and negative) were send to the customers via Dropbox. The brochure and the business card were made with InDesign and the PowerPoint theme with PowerPoint. All in all I am happy about the project, I learned a lot, although now I would do some things differently. I would question the customers more about their ideas and I would not do that many different steps and choices, for example. Web pages Chippewa Range needed updating and minor visual alterations for their web pages, because the cooperation with the earlier company was finished and they could not update the pages themselves. The main idea was to make web pages that were responsive and easy to use (both for the user and admin) and that Chippewa Range can update the pages on their own without coding. The visual idea was meant to keep similar than before, for example the logos were not allowed to be changed. The web pages were executed with WordPress and the theme is Sparkling by Colorlib. The theme was chosen because it is a clean minimal and responsive WordPress theme and well suited for travel, health, photography, personal and any other creative websites. Sparkling incorporates latest web standards such as HTML5 and CSS3 and is SEO friendly thanks to its clean structure and codebase. It was also very important that the theme enabled the usage of own fonts, colours and sliders and it was also optimized to work with Contact Form 7, Jetpack (Facebook Like Box) and other popular free and premium plugins. The fonts used in the web pages is Western and Tahoma. Banner was made in Photoshop, the logos in Illustrator. The project was interesting and very teaching experience. It also left in me a little spark of wanting to learn coding, so that someday I could make own web pages from scratch. 3

4 CURRICULUM VITAE Henkilötiedot Tiina Mustonen Kontioniementie 62 B A 1, Kontioniemi mustosen.tiina@gmail.com Suomi Koulutus Audiovisuaalisen viestinnän ammattitutkinto, PKKY Filosofian maisteri, saksan kieli ja kääntäminen, Itä-Suomen yliopisto Työkokemus Projektisihteeri, markkinointi- ja viestintä, Kolin Matkailuyhdistys ry Saksan kielen kääntäjä, Lidl Suomi Ky Lisäksi kesätöitä myyjänä, oppaana, kääntäjänä, matkailuneuvojana ja siivoojana. Kielitaito Suomi, saksa, englanti, ruotsi, japani (kohtalainen) ja venäjä (alkeet) Tietotekninen osaaminen Photoshop, InDesign, Illustrator, InfoWeb, WordPress, MS Office -työkalut (Word, Excel, PowerPoint, Outlook), käännösmuisti- ja termipankkiohjelmat (Trados, Wordfast ja Wordsmith tools) Muu työhön liittyvä osaaminen Viestintäsuunnittelu, oikoluku, typografia, valokuvaus Ajokortti B 4

5 JULKAISUGRAFIIKKA PROJEKTIKUVAUS Liikemerkin ja esitteen suunnittelu: Terapiakeskus Puro Taustaa Kolme saman katon alla toimivaa terapiayritystä halusivat selkeyttää ja yhdenmukaistaa markkinointiaan. Yritykset päättivät perustaa keskuksen, jonka nimeksi valikoitui Terapiakeskus Puro. Terapiakeskus Puron yritykset ovat Terapiamerkurius Oy, Terapiaperhonen Oy ja Toimintaterapeutti Päivi Turkki. Terapiamerkurius Oy tarjoaa puheterapiaa, kommunikaatio-ohjausta, työnohjausta, neuropsykiatrista valmennusta ja puhevammaisten tulkkauspalveluja. Terapiaperhonen Oy on erikoistunut ravintovalmennukseen ja toimintaterapiaan. Toimintaterapeutti Päivi Turkin erikoisalaa on lasten toimintaterapia. Tavoite Projektin tarkoituksena on suunnitella liikemerkki, jolla ilmennetään koko Terapiakeskus Puron toimintaa ja joka esiintyy kaikissa markkinointimateriaaleissa, mm. yhteisillä Internet-sivuilla, esitteissä, asiakirjapohjissa, käyntikorteissa, ikkunatarroissa ja valotaulussa. Lisäksi oli tarvetta uusille valokuville. Liikemerkissä täytyi tulla kaikkien kolmen yrityksen ulkoasut esille. Oman haasteensa liikemerkin suunnittelulle toi se, että kaikilla kolmella yrityksellä oli jo valmiit, tyyliltään tosistaan eriävät, liikemerkit. Projektin kulku Suunnittelu alkoi jo tammikuussa 2014, jolloin kävin tutustumassa kommunikaatio-ohjaajan työhön. Samalla näin Terapiakeskus Puron toimitilat ja kuulin liikemerkin ja esitteiden tarpeesta. Toimitiloista tarvittiin myös valokuvia muuttuvan lain takia. Puheterapia ja puhevammaisten tulkkauspalvelut ovat Kelan alaisia tehtäviä, joten Kela vaatii selonteon toiminnasta ja kuvia toimitiloista yrityksen Internet-sivuille. Ennen esitteiden tekoa sovimme kaksi valokuvauspäivää, jolloin kaikki yrittäjät ovat paikalla. Otin kaikista työntekijöistä henkilökuvat, yhteiskuvia ja kuvia tiloista sekä toiminnasta. 5

6 Liikemerkin suunnittelu Sain liikemerkin suunnitteluun vapaat kädet ja rajattomasti aikaa. Aloitin suunnittelun töhertelemällä ideoita kynällä paperille. Kevään aikana lähetin yrittäjille sähköpostitse useita ehdotuksia, alkuun ihan vain kepillä jäätä koittaen. Tarkoituksena oli saada edes jonkinlaista osviittaa siitä, millaista liikemerkkiä ja värimaailmaa halutaan. Pikkuhiljaa yhteinen sävel löytyi. Sain yritysten omat liikemerkin jpeg-tiedostoina, joten vektoroin ne Illustratorissa. Terapiaperhosen liikemerkkiin tein myös muutoksia yrittäjän toiveesta, sillä hän ei ollut aikaisempaan liikemerkkiinsä tyytyväinen. Hän halusi perhosesta kevyen, kuultavan ja terveen näköisen. Terapiaperhosen perhosta kevennettiin aikalailla entisestä. Toimintaterapian liikemerkkiä oli vaikea vektoroida, sillä sen ympärillä olevassa rinkulassa oli käytetty pensselillä vedetyn näköistä viivaa, jossa oli paljon pientä ripellystä. Kerroin asiakkaalle, että sellaista on vaikea tehdä tarraksi ja sain luvan yksinkertaistaa viivaa. Ensimmäinen ja toinen versio. Illustrator. Ensimmäisen version jälkeen sain tarkennuksia suunnitteluun. Väritoiveina oli, että värikästä ja iloista pitää olla. Puromaisuutta tai vettä elementtinä pitäisi korostaa. Liikemerkit eivät saisi olla toistensa osina, kuten parissa alimmaisessa esimerkissä on. Toiseen versioon sain jo kolmannenkin liikemerkin mukaan, jolloin suunnittelu helpottui. Toinen versio miellytti jo enemmän ja siitä haluttiin ehdottomasti säilyttää pisarat, mutta niin, että puromaisuus tulisi enemmän esiin. 6

7 Kolmannessa versiossa lähdin leikkimään puro-ajatuksella ja lisäsin mukaan purossa olevia pikkukiviä ja väritykseen sinistä korostamaan vesi-elementtiä. Neljännessä versiossa mietin sopivia fontteja. Päädyin itse Arial rounded MT Boldiin, jolla saadaan kivasti asiakkaan toivomaa leikkisyyttä esiin. Fontin pyöreät muodot sopivat muiden elementtien muotokieleen. Arial rounded MT Bold sopii myös niin printtiin kuin nettisivuille. Fonttivaihtoehtoina olivat: TERAPIAKESKUS PURO Calibri TERAPIAKESKUS PURO Arial rounded MT Bold TERAPIAKESKUS PURO Berlin Sans FB TERAPIAKESKUS PURO Century Gothic TERAPIAKESKUS PURO Isocpeur 7

8 Viidennen version kohdalla tein kaksi versiota. Toisen täsmälleen niin kuin asiakas sen halusi ja toisen, joka omasta mielestäni oli parempi. Tässä kohden alkoi jo turnauskestävyys olla kovilla. Asiakas halusi vielä vähän lisää väriä, esim. vihreän tekstin, terävän fontin sekä pisarat ja kivet vain ääriviivoina. Puolustin omaa valintaani yhtenäisyydellä: jos tekstin väriä ei ole logossa, se vaikuttaa irralliselta. Yhtenäisyys ja selkeys ovat vaarassa myös, jos pisarat ovat ääriviivoina. Kyselinkin, ovatko aiemmin niin tärkeät pisarat välttämättömiä, jos yritysten liikemerkit halutaan paremmin esiin. Päädyin siis vielä tekemään uuden version ilman pisaroita. Viimeinen versio, oikea- ja vasenlaitaiset versiot. Aineiston valmistaminen Suunnittelussa käytin Illustrator-ohjelmaa. Valmiista liikemerkistä lähetin asiakkaalle useita versioita, selittäen väriavaruuksien eroista sen, että CMYK (300 dpi) on painolaatuinen ja RGB (72 dpi) on weblaatuinen liikemerkki ja lähettäen myös liikemerkin värimääritykset. Väriprofiilit ovat oletusarvojen mukaiset Coated Fogra 39. Tein ja lähetin Dropboxin kautta värillisen, harmaansävyisen, mustavalkoisen ja nega-version liikemerkistä. Lisäksi tein liikemerkistä oikea- ja vasenlaitaiset versiot, sillä välillä sitä käytetään yhdessä joko Terapiamerkuriuksen, TerapiaPerhosen tai Toimintaterapeutti Päivi Turkki - liikemerkin kanssa. Varsinaista graafista ohjeistusta en yrityksille tehnyt, sillä sitä ei sopimukseen kuulunut. Sähköpostitse opastin kuitenkin asiakkaalle näkemystäni kuinka logoa tulisi käyttää. Tein myös jokaiselle yritykselle omat A4-lomakepohjat, joissa yrityksen ja Terapiakeskus Puron liikemerkki olivat paikallaan. Myöhemmin tuli myös muokkaustarvetta valomainosta varten, sillä liikemerkkiä haluttiin käyttää jo olemassa olevassa valokyltissä, jonka mittoja en tiennyt logoa suunnitellessani. Lopullinen liikemerkki: värillinen oikea värillinen vasen 8

9 Greyscale musta-valkoinen negatiivi Liikemerkki valomainokseen: A4-pohjat: 9

10 Itsearvio Jälkeenpäin huomasin, että olisi pitänyt pyytää tarkemmat rajat suunnittelulle ja kuulostella mielellään kasvokkain asiakkaiden kanssa mietteitä liikemerkistä. Nyt aikaa meni liian kauan ja suunnittelu oli todella hankalaa, sillä en saanut kolmesta liikemerkistä yhtä käsiini alkuun ollenkaan. Yhden elementin puuttuminen hankaloitti yleisilmeen luomista. Värien kanssa ei myöskään olisi tarvinnut harharetkiä tehdä, luulin nimittäin aluksi, että oli käytettävä Terapiamerkuriuksen liikemerkin värimaailmaa. Tein myös aivan liian monta välivaihetta. Olisi pitänyt jo alun perin tehdä valmiimpaa ja omaankin silmään miellyttävämpää materiaalia, nyt sinkosin uusia versioita menemään jo aivan keskeneräisenä ja vain vähän edellisestä muuttuneena. Fontti olisi pitänyt miettiä valmiiksi jo aiemmin. Fonttimallejakin tarjosin aivan liian monta, sillä jouduin kuitenkin runnomaan oman mielipiteeni läpi. Jos en olisi laittanut näytille ohuita fontteja tai fonttia, jossa on pienet a:n ja p:n pallot, ei minun olisi tarvinnut käyttää niin paljon aikaa Arial Rounded MT Boldin hyvien ominaisuuksien kehumiseen. Lopullisen liikemerkin ympärille olisi pitänyt jättää laajempi varoalue, ettei sitä tuupata vahingossa liian lähelle reunaa tai muita elementtejä. Tiedon kulkua vaikeutti myös se, että olin tekemisissä kolmen yrityksen kanssa, välillä palautetta sai odotella pitkäänkin. Kolmella yrittäjällä oli myös osittain eriävät mielipiteet: kaksi yritystä halusivat graafista ja pelkistettyä, yksi romanttisempaa ilmettä. Ylipäätään tällainen rajattomasti aikaa vapaat kädet maksetaan nimellinen korvaus -tyylinen toimeksianto ei pitemmän päälle ole kovin fiksu. Toimeksiannon kanssa on naimisissa aivan koko ajan, vaikkei sitä aktiivisesti tekisikään. Vapaat kädet eivät tarkoita kuitenkaan, että voisit tehdä ihan mitä vain, asiakasta on kuitenkin kuunneltava. Nimellinen korvaus ei houkuta tekemään nopeasti. Ajatukseni hinnoittelussa ja toimeksiannon laadussa onkin: Tekemäni työ on halpa, laadukas, nopea valitse näistä kaksi. 10

11 Esimerkki sähköpostista asiakkaalle: Moi, kiitoksia kommenteista, tämä viimeisin siis miellyttää kaikkia. Laitan vielä viimeiset versiot dropboxin kautta. Ilmoitelkaa, jos ette saa auki, niin laittelen sitten tulemaan sähköpostin kautta. Versioita on useita, koska: logoja on värillinen, harmaansävyinen, mustavalkoinen ja nega-versio 300 dpi -versiot ovat printteihin (näissä on käytetty CMYK-värejä) 72 dpi -versiot webbiin (näissä on käytetty RGB -värejä).ai -tiedostomuoto (eli illustrator-versio) on tarroja varten, tämä pitää laittaa eteenpäin tarrafirmalle sitten. -ja kaikkia versiota on kaksi (OIKEA ja VASEN). Logon värit: heksakoodit (eli # -merkityt) ja RGB värit ovat webiä varten, CMYK printtiin, jos joku sattuu kysymään. oranssi (tämä on sama kuin Päivin logossa) #D06828, R 208, G 104, B 40 C 0, M 69, Y 94, K 0 violetti # R 114, G56, B 136 C 60, M 90, Y 0, K 0 pinkki #C40074 R 196, G 0, B 122 C 0, M 100, Y 0, K 0 sininen # 38509A R 56, G 80, B 154 C 93, M 71, Y 0, K0 Logosta on nyt siis versiot VASEN ja OIKEA. Suosittelen käyttämään tuota VASEN versiota niissä ikkunatarroissa ja nettisivuilla (lukusuunta on meillä vasemmalta oikealle ja on yleisempää, että logo on ensin, sitten vasta firman nimi) ja sitten tuota OIKEA versiota silloin kun logo tulee paperille oikeaan laitaan tai johonkin alakulmaan. Tarranvalmistajista: Tunnen pääasiassa Joensuussa toimivia paikkoja. Hintoja ei näy minkään firman sivuilla, vaan joka paikkaan täytyy laittaa tarjouspyynnöt. Googlailin vähän ja on siellä Savonlinnan seudullakin tällainen firma: Paikallisessa firmassa on se hyvä puoli, että käyvät sitten kanssa laittamassa tarrat paikalleen (tai näin ainakin Joen Kilpituote mainosti ) Joensuussa: Terveisin, Tiina 11

12 Esitteen, PowerPoint-teeman ja käyntikortin suunnittelu Aineiston valmistaminen Esitteeseen osasin jo kysellä mielipiteitä tarkemmin. Asiakas (Terapiamerkurius) halusi toimintaansa kuvaavan yksinkertaisen esitteen, jossa on mahdollisimman paljon valkoista, tehostevärinä pinkkiä ja paljon tekstiä. Näkyville piti saada niin yrityksen oma liikemerkki kuin Terapiakeskus Purokin. Toiveena oli myös mahdollisimman halpa toteutusmuoto. Päädyin A4-haitaritaittoon (99 mm + 99 mm + 99 mm jaolla). Kuvitukseen käytin ottamiani kuvia. Esitteen suunnittelu oli liikemerkin suunnittelua kivuttomampaa, sillä pyyntönä oli hyvin pelkistettyä ilmettä ja vastapelurina oli vain yksi yrittäjä. Mielipiteet olivat selkeitä ja palautetta tuli nopeasti. Esitteen pohjalta tein myös PowerPoint-teeman ja käyntikortin yrittäjälle. Esitteen ja käyntikortin toteutin InDesignilla, kuvia muokkasin Photoshopilla, PowerPoint-teeman tein luonnollisesti PowerPointissa. Esitteen ensimmäinen versio, jota suunnittelin ilman tekstejä. InDesign. Toiseen versioon hahmottelin jo Internet-sivuilta napattuja tekstejä, sillä en ollut vielä saanut niitä asiakkaalta. Tämän version näytin jo asiakkaalle ja sain muutosehdotuksia. Kolmannessa versiossa kuvia ja tekstien paikkoja muutettiin niin, että kommunikaatio-ohjaus pääsee paremmin esille. 12

13 Neljänteen versioon sain lisää tekstejä, joten kuvien paikkoja piti muuttaa ja etusivua tiivistää. Viidennessä ja kuudennessa versiossa kuvat löysivät viimeisen paikkansa ja tekstit olivat jo melko valmiita, ne täytyi vain saada asiakkaan toivomaan järjestykseen. Kuudennessa versiossa muutettiin vain tekstejä ranskalaisille viivoille. Tajusin myös taitollisen ongelman, osoitteet eivät voi olla toisella sivulla oikealla, jos niiden on tarkoitus olla takakannessa. Sen korjasin myös viimeisiin versioihin. PowerPoint-pohja. PowerPoint. Tein ensin yhden pohjan ja hyväksynnän saatuani muokkasin saman ilmeen kaikkiin PowerPointin valmispohjiin: pinkit viivat, TerapiaMerkuriuksen ja Terapiakeskus Puron liikemerkit, päivämäärät ja fontin. Määritin myös fonttien värit. Asiakas toivoi myös, että pohjasta tehdään teema, jolloin aiemmin tehtyjä 13

14 PowerPointteja voidaan muokata helposti uuden ulkoasun mukaiseksi. En ollut sellaista tehnyt aiemmin, mutta sehän olikin helppoa, rakenne-välilehden teemat-kohdasta piti klikata nuolta alas ja painaa Tallenna nykyinen teema. 14

15 Käyntikortti, kaksipuoleinen. InDesign. Itsearvio Omaa silmääni miellytti eniten ensimmäisen ja toisen version väljyys ja neljännen version kuvien sommittelu. Tilan käytöstä ja väljyydestä keskustelimmekin asiakkaan kanssa, mutta tarpeellista oli saada koko yrityksen tarjonta samaan esitteeseen ja mahdollisimman kattavat tekstit. Tosin yhden edustustilaisuuden jälkeen asiakkaalta tuli jo palautetta, että ehkä sittenkin olisi parempi jakaa asiat vaikka kahteen erilliseen esitteeseen. Asiakkaan toive valkoisesta, mahdollisimman paljon tekstiä sisältävästä esitteestä ei ollut kovin kiitollinen tehtävä suunnittelijan kannalta. Varsinaisesta luovuuden lennosta ei tässä esitteessä voi puhua, mutten voinut asiakkaan toivettakaan täysin jättää huomioimatta. Asiakkaan mielipide on kuitenkin tärkein, heillehän esite tehdään. Sain kuitenkin tekstiä vähemmäksi ja ujutettua esitteeseen muutaman kuvan. Lopputuloksessa on mielestäni vieläkin liikaa tekstiä, ja se on vähän liian palikka mielestäni. Ehdotin aihealueiden jakamista useampaan esitteeseen, jolloin esitteistä tulisi väljempiä, ja siten luettavampia ja houkuttelevampia. Tästä ideasta asiakas ei kustannussyistä innostunut, vaikka tosin piti ajatustani hyvänä ja sanoi pitävänsä sen mielessä jatkoa ajatellen. Esittämäni ajatukset saattavat siis poikia minulle lisätöitä, joten ei pidä valittaa. PowerPoint-pohjan ja käyntikortin tekeminen olivat jo lasten leikkiä, sillä olin jo hyvinkin perillä asiakkaan näkemyksistä. Helppoa oli myös se, että molempiin pohjiin tuli hyvin vähän tekstiä, joten oli helppo tehdä hyvännäköistä. 15

16 VERKKOVIESTINTÄ PROJEKTIKUVAUS Internet-sivujen suunnittelu: Chippewa Range Taustaa Matkailu- ja hevostila Chippewa Range on vuonna 2000 perustettu kiihtelysvaaralainen perheyritys, joka tarjoaa majoitus-, kokous- ja westernhenkisiä ohjelmapalveluja, erityisesti ratsastusta. Alueella on myös oma ravintola Viimeinen Mohikaani, joka toimii kesäkaudella. Yrityksen Internet-sivut olivat päivityksen tarpeessa, sillä asiakas ei päässyt itse koodipohjaisia sivuja päivittämään, ja edellinen asiaan vihkiytynyt yhteistyökumppani oli poistunut näyttämöltä. Osa linkeistä ei myöskään toiminut, esimerkiksi valokuvagalleriaan ja Fonectan karttapalveluun ei päässyt ollenkaan. Lähtötilanne: Tavoite Koostin yrityksen toiveet sähköpostiin seuraavasti: palvelimen säilyminen samana sivujen helppokäyttöisyys (niin asiakkaalle kuin päivittäjällekin) ulkoasun pysyminen suunnilleen samana (tähdet, puupalkit, kuvat, videot jne.) hyvännäköiset sivut, fontit saatava käyttöön (ei pelkkä Arial) lisää kuvia asiakkaille kommentointimahdollisuus (TÄMÄ ON UUSI, LISÄTTY TOIVE) siivousta sivulla, tosin kaikki asiat esille (ratsastus, majoitus, saluuna, ohjelmapalvelut, saunat jne.) videoita ja valokuvia esille enemmänkin 15 vuoden tekeminen näkyviin 16

17 Ehdotin myös seuraavaa: Otetaan käyttöön WordPress-pohja, jota on helppo muokata (omat fontit, kuvat ja videot saadaan helposti käyttöön) ja päivittää. Tehdään 1 ulkoasu joka näkyy kaikilla 9 alasivulla FI/EN kuten aiemminkin (Etusivu, Aktiviteetit, Majoitus, Ohjelma, Ratsastus, Kokous- ja juhlatila Longhorn, Saluuna Viimeinen Mohikaani, Huom! (jonka vaihtaisin NEWS-otsikolle/wanted posteriin)) ja valokuva- sekä videogalleriat Videoita voisi lisätä kuten -sivulla (oikea palsta, videogalleria). Ne ovat samalla You Tubessa sekä firman sivuilla, joten mainosta tulisi kahdesta paikasta ja linkkejä olisi helppo lisätä vaikka sähköposteihin (kaikki saavat ko. videot auki). valokuvagallerian lisäksi valokuvia voisi laittaa pyörimään banneriin esim. 3 kpl/alasivu Löydettävyyttä parannetaan hakukoneoptimoinnilla Aikataulusta hahmottelin näin: Viimeistään marraskuun loppuun valmista, mahdollisesti aikaisemmin. Riippuu ihan siitä kuinka paljon uutta tekstiä ja kuvaa laitetaan sivuille ja kuinka nopeasti saisin tunnukset. Opettaja jää lomalle juhannukselta, eli ennen sitä olisi saatava projekti rullaamaan. Hintapyyntöön laiton yhden könttäsumman, mutta lisäsin myös lisäehdon: Jos sivuille halutaan vielä jotain muuta (esimerkiksi valokuvia, niin että ne käydään ottamassa paikan päällä, logoja, bannereita jne.), veloitetaan lisätyöstä x /tunti ja matkakulut 0,45 /km. Projektin kulku Layoutin suunnittelu Asiakas hyväksyi sähköpostihahmotelmani, mutta halusi kuitenkin suunnitella sivuja vielä kasvokkain. Kävin asiakkaan luona, sain hyväksynnän laatimalleni layout-suunnitelmalle, siihen muokkaustoiveita ja mukaani kuvamateriaalia. Samalla allekirjoitimme Grafian pohjalle tekemäni sopimuksen, jonka liitteeksi olin tulostanut sähköpostihahmotelmani. Asiakas toivoi, että sivut eivät näyttäisi liian kliiniseltä ja kotisivukoneella tehdyiltä. Sivuilla saisi lanta haista ja 15 vuoden tekeminen näkyä. Asiakas halusi myös välttämättä säilyttää tähti- ja kilpilogot entisellään, sillä ne ovat olleet yrityksen markkinoinnin pohja jo pitkään, ja siten siis eräänlainen brändi. Asiakas hyväksyi sivurakenteen muutoksen eli kahden sivupalkin layouttia ei tarvinnut noudattaa, mikä auttoi responsiivisen sivun tekemistä. 17

18 Layout-suunnitelma. Photoshop. Layouttia varten etsin taustan sävyyn paremmin sopivan puutekstuurin, jota käytin sivupalkissa ja headerissa. Käytin samaa puutekstuuria myös headerin bannerissa, jonka tein PhotoShopilla. Ensiksi mietin punaista fonttia, mutta päädyin kuitenkin poltetun näköiseen jälkeen. Hahmottelin myös yhden version poltetuilla raameilla, mutta asiakas halusi sahatun näköiset päädyt, ilman nauloja. 18

19 Pääosa logoista säilytettiin asiakkaan toiveesta ennallaan. Tein sivuille kuitenkin uuden logon ajankohtaisille asioille, sillä HUOM! ei ollut kovin käyttäjäystävällinen ja selkeä. Suomen kartta ei sopinut mielestäni sivujen ilmeeseen ja siihenkin tein kompassilogon. Aluksi suunnittelin kompassin ruskeaksi ja yksiulotteiseksi, sitten kokeilin kolmiulotteista mallia. Molemmissa teksti on liian pienellä ja värityskin on hieman pielessä, jotta logo kävisi yläriviin tähtilogojen rinnalle. Sitä pitää siis vielä hieman työstää. Uutta- ja kompassilogot. Illustrator. Internet-sivujen valmistaminen Materiaaleja sain lataamalla kuvia ja logoja entiseltä palvelimelta ja toisella kerralla käydessäni muistitikulla. Suuriin muokkaustoimenpiteisiin ei voinut ryhtyä, koska en saanut alkuperäisiä kuvia tai Illustrator-versioista logoista käsiini. Uusien Internet-sivujen logot ja kuvasliderit oli siis mitoitettava vanhojen kuvien mukaan (kuvat 638 x 194 px ja logot 109 x 108 px). Muiden sivulle lisättävien kuvien koko oli px, mikä helpotti vähän suunnittelua. Sivulle nämä kuvat laitettiin 300 x 225 kokoisina, mutta niitä voi klikkaamalla katsoa oikean kokoisina. Teema WordPress teemaksi valikoitui Colorlibin tekemä Sparkling (versio 1.6.0), koska se on responsiivinen jamatkailualalle soveltuva teema. Teema tukee HTML5-koodia, CSS3:a ja koko sivun levyisiä kuvaslidereita, on SEO ystävällinen ja sillä on mahdollista vaihtaa teeman layouttia, väriä, fonttia ja sliderin ominaisuuksia. Se on myös optimoitu toimimaan Jetpackin ja Contact Form 7:n ja muiden ilmaisten lisäosien kanssa. Näistä ominaisuuksista erityisesti fontin muokkaaminen oli tärkeä, sillä oman fontin saaminen sivustolle oli asiakkaalle erityisen tärkeää. Ilmaisten lisäosien toimiminen auttoi myös kovasti työn edetessä, erityisesti Jetpackin monipuolisuudesta ja kätevästä yhteydenottolomakkeesta (Contact Form 7) olin positiivisesti yllättynyt. Internet-sivujen rakenne: 19

20 Lisätyt lisäosat (moduulit) CKEditor for WordPress Mahdollistaa paremman tekstinkäsittelyn sivut- ja artikkelit kohdissa, sillä painikkeita tulee lisää. Contact Form 7 Yhteydenottolomake, tällä sivulla sijoitettiin footeriin. Google Analyticator Kävijäseurantatyökalu All In One SEO Pack Hakukoneoptimointi Huge IT Slider Slider-kuvagalleria Huge IT Image Gallery Kuvagalleria 20

21 Jetpack Monia ominaisuuksia, Chippewan sivuilla tämän avulla on saatu Facebook Like Box footeriin. Menu Icons Mahdollisti logojen käytön valikoissa. 21

22 Polylang Ilmainen kielilisäosa. Chippewa Rangen sivuille lisättiin vain englanti, venäjän kielen lisääminen on vielä mietinnässä, sekin onnistuu polylangilla. YouTube Lisäosa YouTube-videoiden näyttämiseen. Tämänkin sivuille lisäsin, vaikka vielä ei videomateriaaleja olekaan. Tulevaisuudessa ne ovat kuitenkin asiakkaan toiveissa. Kokeilin myös Simple Lightbox ja jquery Slider Carousel -kuvagallerioita, mutta Huge IT Slider osoittautui parhaaksi slider-ohjelmaksi ja Huge IT Image Gallery parhaaksi kuvagalleriaksi tämän teeman kanssa. Chippewa Range -sivuilla käytetyt värit Otsikot: tiili, #b22222 leipäteksti: tumman harmaa, #6B6B6B linkit ja header: vaalean ruskea, # footerin teksti: vaalean ruskea, #7f705f footer-väri: melkein musta (harmaa) # Sivuilla käytetyt fontit WESTERN otsikoissa Tahoma leipätekstissä 22

23 Sivun tekniset tiedot Domain Palvelin Linux Julkaisujärjestelmä Wordpress PHP-versio Tietokanta MySQL Koodin muokkaaminen Muutoksien takia, mm. fontin lisäämistä varten täytyi koodia hieman puukottaa. Muokkaamisen apuna olivat selaimeen lisättävät apuvälineet Developer Toolbar ja ColorPicker. Developer Toolbarin Inspector-osa osoittautui erittäin hyödylliseksi, sillä pystyi hiirtä sivun päällä liikuttamalla näkemään missä kohdassa koodia juuri sitä elementtiä voi muokata. ColorPickerillä tunnistin värejä, joiden avulla etsin muokattavien fonttien värit tyylitiedostosta käyttämällä Ctrl+F -toimintoa. Muokkaukset tein Ulkoasu muokkain Sparkling: Tyylitiedosto (style.css) -kohdassa: Western-fontin lisäsin { font-family: 'WEST'; src: url("/chippewarange/wp-includes/fonts/west.ttf") format('truetype'); } } h1, h2, h3, h4, h5, h6,.h1,.h2,.h3,.h4,.h5,.h6 { color: #B22222; font-weight: 700; font-family: 'WEST'; } Content -kohdassa muokkasin laatikoiden ja valikoiden välejä pienemmäksi, jotta sivupalkki on ihan sivun sisällössä kiinni. Muistin avuksi lisäilin muistutuksia: /* content-laatikon marginaalit */ }.page-content,.entry-content,.entry-summary { margin: 30px; /* content-laatikon marginaalit */ }.page-links { clear: both; margin: em; 23

24 }.main-content-area { /* valikoiden ja eri laatikoiden välit */ margin-top: 0px; margin-bottom: 0px; } Media-kohdassa, juuri ennen vimpaimia muokkasin Polylang-lisäosan lippujen järjestystä, niin että ne ovat rinnakkain eivätkä allekkain. Lisäsin myös fontin, korkeuden ja etäisyyden toisistaan. /* Polylang vimpaimen liput vaakaan */.lang-item { display: inline; font-family: 'WEST'; /* lisäsin fontin, korkeuden ja paddingin*/ line-height: 1.7; font-size: 11px; padding: 20px; } /* =Vimpaimet */ Suurimmat muutokset täytyi tehdä, että sivupalkkiin saatiin taustakuva. }.well { background-color: #fff; /*tähän vaihdetaan vasemman reunan pystylaatikon taustan väri, jos taustakuva --> lisää polku kuvaan */ background: url(/chippewarange/wp-includes/images/sivupalkki_2.png); /*background-size:180px 800px; jos haluaa muokata sivupalkkikuvan kokoa*/ padding: 20px; /* vasemman reunan alareunan läheisyys yläpuolella olevaan tekstiin/kuvaan */ border: 0px solid #DADADA; /* kehysviiva vasemman reunan pystylaatikossa, oletus 1px */ overflow: hidden; text-align:center; /* keskittää kilvet vasemman reunan palkkiin */ width: 108%;/* laatikon leveys */ clear: both; } Navigation-kohdassa muokkasin sivun ylälaidan valikkoa. Tähänkin tuli paljon muutoksia. }.navbar.navbar-default { background-color: #363636; background: url(/chippewarange/wp-includes/images/ylapalkki_tausta.png); /* Headerin ja sidebarin taustakuva */ /* background-size: 500px 100px; taustakuvan koko, jos yksi kuva, joka ei kloonaa itseään, lisää--> backgroundrepeat: no-repeat; */ margin: 0px; /* logon taustalaueen leveys, EI SAA MUUTTAA. EI TOIMI RESPONSIIVISUUS, JOS LUKU MUUTETAAN! */ font-family: 'Open Sans', serif; margin-bottom: 0; font-weight: 500; }.navbar-default.navbar-nav > li > a { /* navigointilaatikoiden tekstit, lisäsin font-familyn ja vaihdoin fonttikoon 12px */ color: #000000; line-height: 40px; font-family: 'WEST'; text-transform: uppercase; font-size: 14px; } 24

25 .navbar >.container.navbar-brand { color: #B22222; font-size: 60px; margin: 13px 0; font-family: 'WEST'; letter-spacing: -5px; } Jälkihoito Sivun toimivuutta testasin yleisimmillä selaimilla (Mozilla, Explorer, Crome) sekä erilaisilla laiteilla (tietokone, älypuhelin, tabletti). Asiakkaan käyttöön laadin yksityiskohtaiset ohjeet sivujen päivitykseen, jotta sivujen päivitys onnistuu heiltä jatkossa itse. Ohjeissa on havainnollistavat kuvat, tekstit ja punaisella merkityt korostukset. Itsearvio Aivan kuten alun perin arvelinkin, verkkoviestinnän osuus oli minulle julkaisugrafiikkaa vaikeampaa. Onneksi sain paljon ohjausta ja vinkkejä opettajalta. Toisaalta olen positiivisesti yllättynyt, että olen saanut noinkin paljon aikaiseksi ja asiakkaankin tyytyväiseksi. Projektin edetessä heräsi myös mielenkiinto koodaamiseen, olisi todella hienoa tehdä sivut ihan alusta alkaen itse. Silloin voisi rakenteen, fontit ja värit muokata heti alusta sellaiseksi kuin haluaa. WordPress on nimittäin niin kauan helppokäyttöinen, kun teemaan ei tarvitse lisätä tausta- ja bannerikuvaa enempää. Teeman mahdollistavilla muokkauksilla on vaikea saada persoonallisen näköistä jälkeä. Aikataulu venyi ja paukkui tässäkin projektissa, tosin minusta riippumattomista syistä. Odottelen vielä asiakkaan viimeisiä kommentteja ja toivon, että pääsen siirtämään sivut heidän omalle palvelimelleen piakkoin. 25

26 26

27 MUITA TÖITÄ Portfolio-sivuiltani aikolainen.pkky.fi/tiina_mustonen voi katsella muita töitäni. CV/NÄYTTÖTYÖ-sivun salasana on: harvatjavalitut Koli Freetime -esite, InDesign Koli Freetime -kartta, Illustrator Koli Freetime Suomi -kartta, Illustrator Äimäjärvi, lllustrator Votomaratoni, Illustrator Mansikka-esite, InDesign 27

Asiakas ja tavoite. Tekninen toteutus

Asiakas ja tavoite. Tekninen toteutus Asiakas ja tavoite Heikieli on vuonna 2015 perustettu yhden hengen asiantuntijayritys, joka tarjoaa käännös- ja oikolukupalveluita englannista ja saksasta suomeksi. Freelance-kääntäjiä on Suomessa paljon,

Lisätiedot

Ammattijärjestäjä Aulasvuori Www-projektin kuvaus

Ammattijärjestäjä Aulasvuori Www-projektin kuvaus Ammattijärjestäjä Aulasvuori Www-projektin kuvaus Minne Seppälä Avat 2014 Dokumentaatio 1 PROJEKTIN KUVAUS... 3 1.1 Projektin aloitus... 3 1.2 Aikataulu... 4 1.3 Kustannusarvio... 4 2 ULKOASU... 5 2.1

Lisätiedot

NETTISIVUOHJE. MUITA OHJEITA käyttäjän lisääminen, mediakirjasto, sähköpostien lisääminen

NETTISIVUOHJE. MUITA OHJEITA käyttäjän lisääminen, mediakirjasto, sähköpostien lisääminen NETTISIVUOHJE SISÄLTÖ 2 JULKAISUJÄRJESTELMÄ tietoa WordPress julkaisujärjestelmästä perustoiminnot (kirjautuminen, asetukset) 6 MUITA OHJEITA käyttäjän lisääminen, mediakirjasto, sähköpostien lisääminen

Lisätiedot

Oy Karltek Ltd internet-sivujen uusiminen. Eveliina Aaltonen

Oy Karltek Ltd internet-sivujen uusiminen. Eveliina Aaltonen Oy Karltek Ltd internet-sivujen uusiminen Eveliina Aaltonen Audiovisuaalisen viestinnän ammattitutkinto Eurajoen kristillinen opisto, 2015 1 ASIAKAS JA PROJEKTI... 3 1.1 Asiakas...3 1.2 Projektin kuvaus...3

Lisätiedot

PROJEKTIDOKUMENTAATIO PARTURI-KAMPAAJA HIUSKASTANJA. Eurajoen kristillinen opisto Media-ala Mia Salminen

PROJEKTIDOKUMENTAATIO PARTURI-KAMPAAJA HIUSKASTANJA. Eurajoen kristillinen opisto Media-ala Mia Salminen PROJEKTIDOKUMENTAATIO PARTURI-KAMPAAJA HIUSKASTANJA Eurajoen kristillinen opisto Media-ala 2016 2017 Mia Salminen 1 SYNOPSIS PROJEKTISTA... 3 1.1 Rakennesuunnitelma... 3 1.2 Sivun rakenne... 5 1.3 Grafiikka...

Lisätiedot

VERKOSTO GRAAFINEN OHJE

VERKOSTO GRAAFINEN OHJE 2018 SISÄLTÖ 3 Pikaohje 4 Tunnus ja suoja-alue 5 Tunnuksen versiot 6 Tunnuksen käyttö 7 Fontit 8 Värit 9 Soveltaminen ----- 10 Verkosto Lapset 2 suoja-alue Tunnuksen suoja-alueen sisäpuolella ei saa olla

Lisätiedot

Juricon Nettisivu Joomlan käyttöohjeet

Juricon Nettisivu Joomlan käyttöohjeet Juricon Nettisivu Joomlan käyttöohjeet Sisällysluettelo Julkaisujärjestelmä hallinta... 3 Joomla-järjestelmän ylävalikolla on seuraavia:... 3 Valikot... 4 Kategoriat ja artikkelit... 5 Lisäosat ja moduulien

Lisätiedot

SISÄLLYS JOHDANTO 5. KUVAT 1. TUNNUS - SANOMA 6. VERKKOSIVUT 2. TUNNUS - KÄYTTÖ 7. TUOTEKORTIT JA ESITTEET. 2.1 Suoja-alue. 7.

SISÄLLYS JOHDANTO 5. KUVAT 1. TUNNUS - SANOMA 6. VERKKOSIVUT 2. TUNNUS - KÄYTTÖ 7. TUOTEKORTIT JA ESITTEET. 2.1 Suoja-alue. 7. GRAAFINEN OHJEISTO SISÄLLYS JOHDANTO 1. TUNNUS - SANOMA 2. TUNNUS - KÄYTTÖ 2.1 Suoja-alue 2.2 Eri osien käyttö 2.3 Minimikoot 5. KUVAT 6. VERKKOSIVUT 7. TUOTEKORTIT JA ESITTEET 7.1 Tuotekortit 7.2 Esitteet

Lisätiedot

PROJEKTIDOKUMENTAATIO MONIPALVELU HALONEN

PROJEKTIDOKUMENTAATIO MONIPALVELU HALONEN PROJEKTIDOKUMENTAATIO MONIPALVELU HALONEN Jani Niemi Eurajoen kristillinen opisto Audiovisuaalisen viestinnän ammattitutkinto 1 ASIAKKAAN JA PROJEKTIN ESITTELY...1 1.1 Aikataulu...1 2 SUUNNITTELU...2 2.1

Lisätiedot

Arvokas. Graafinen ohjeistus

Arvokas. Graafinen ohjeistus Graafinen ohjeistus Sinä olet arvokas! -ohjelma rakentaa yhdenvertaisempaa Suomea, jossa jokaisella lähtökohdista ja elämäntilanteesta riippumatta on mahdollisuus kokea olevansa merkityksellinen osa yhteisöä

Lisätiedot

GRAAFINEN OHJEISTO OLLILA TRANS OY

GRAAFINEN OHJEISTO OLLILA TRANS OY GRAAFINEN OHJEISTO OLLILA TRANS OY Ohjeiston sisältö Tämän ohjeiston tarkoitus on antaa selkeät suuntaviivat Ollila Trans Oy:n viestinnälle. Annettuja ohjeita noudattamalla yrityksestä annetaan yhtenäinen,

Lisätiedot

Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.

Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8. Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.2012 Hakemisto 1. Sivustot internetissä... 2 2. Yleistä... 2 3.

Lisätiedot

PROJEKTIDOKUMENTAATIO OONA KARHUNEN

PROJEKTIDOKUMENTAATIO OONA KARHUNEN PROJEKTIDOKUMENTAATIO OONA KARHUNEN Emilia Ketola Eurajoen kristillinen opisto Avat 2015-2016 1 Projekti... 3 1.1 Asiakas ja kartoitus... 3 1.2 Asiakastapaaminen ja suunnittelu... 3 1.3 Toteutus... 5 1.4

Lisätiedot

Visuaalinen identiteetti. Graafinen ohjeistus

Visuaalinen identiteetti. Graafinen ohjeistus Visuaalinen identiteetti Graafinen ohjeistus MEDRIAN OY SISÄLTÖ 01 VÄRIT 04 02 03 3... CMYK ja RGB 4... HELPien värit TYPOGRAFIA 5... Ensisijainen fontti 6... Toissijainen fontti 7... WWW-sivut LOGO 8...

Lisätiedot

Veistämö Knaapi. Projektidokumentaatio

Veistämö Knaapi. Projektidokumentaatio Veistämö Knaapi Projektidokumentaatio 2015 1 Sisällysluettelo 1 Esittely... 3 1.1 Idea/Tarve... 3 1.2 Synopsis/ Projektin kuvaus... 3 1.3 Aikataulutus ja kustannusarvio... 4 2 Suunnittelu... 6 2.1 Banneri

Lisätiedot

3D TALO FINLAND OY GRAAFINEN OHJEISTO

3D TALO FINLAND OY GRAAFINEN OHJEISTO 3D TALO FINLAND OY GRAAFINEN OHJEISTO 1 SAATESANAT 3D TALO FINLAND OY 3D Talo Finland Oy on Kuopiolainen virtuaalitodellisuusteknologiaan erikoistunut yritys. Toimintamme keihäänkärkenä on suunnitella

Lisätiedot

LIITE 1. Graafinen ohjeisto 1(12) GRAAFINEN OHJEISTO. SammutinHuolto Nevanperä Ky 2011

LIITE 1. Graafinen ohjeisto 1(12) GRAAFINEN OHJEISTO. SammutinHuolto Nevanperä Ky 2011 LIITE 1. Graafinen ohjeisto 1(12) GRAAFINEN OHJEISTO SammutinHuolto Nevanperä Ky 2011 2(12) Sisältö 1. Johdanto 3 2. Tunnus 4 - Tunnuksen koko 5 - Tunnuksen suoja-alue 6 - Tunnuksen käyttö 7 3. Värimääritykset

Lisätiedot

PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI

PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI Jani Niemi Eurajoen kristillinen opisto Audiovisuaalisen viestinnän ammattitutkinto 1 ASIAKKAAN JA PROJEKTIN ESITTELY...1 1.1 Aikataulu...1 2 SUUNNITTELU...2 2.1

Lisätiedot

PROJEKTISIVUJEN PAÄ IVITTAÄ MISEN OHJEET

PROJEKTISIVUJEN PAÄ IVITTAÄ MISEN OHJEET PROJEKTISIVUJEN PAÄ IVITTAÄ MISEN OHJEET Suomen partiolaiset Finlands scouter ry 04/2013, muokattu 02/2015 Tämä ohje on tarkoitettu Suomen Partiolaisten hallinnoimien projektisivustojen sisällöntuottajille

Lisätiedot

Ohjeet Finna- julisteen PowerPoint- pohjan muokkaamiseen

Ohjeet Finna- julisteen PowerPoint- pohjan muokkaamiseen Ohjeet Finna- julisteen PowerPoint- pohjan muokkaamiseen Ennen kuin aloitat: 1. Asenna tietokoneeseesi ilmainen Miso Regular fontti, jonka saat täältä: https://www.fontspring.com/fonts/marten- nettelbladt/miso

Lisätiedot

Wordpress- ohje nettisivujen laadintaan

Wordpress- ohje nettisivujen laadintaan Wordpress- ohje nettisivujen laadintaan Leo Suomela 2 / 13 Sisältö 1 Johdanto... 3 2 Aloitusnäkymä... 3 3 Ohjausnäkymä... 4 4 Sivujen lisäys... 6 5 Etusivun määritys... 9 6 Teeman muokkaus... 13 3 / 13

Lisätiedot

Graafiset käyttöliittymät Sivunparantelu

Graafiset käyttöliittymät Sivunparantelu Graafiset käyttöliittymät Sivunparantelu Johdanto Tarkoituksenamme on parantaa Konebox.fi-verkkokaupan nettisivuja. Ensivaikutelman perusteella sivusto tuntuu todella kömpelöltä ja ahdistavalta. Sivu on

Lisätiedot

Tunnus. 10 mm. Tunnuksen minimikorkeus on 10 mm.

Tunnus. 10 mm. Tunnuksen minimikorkeus on 10 mm. Visuaalinen ohje Pohjois-Pohjanmaan maakunta- ja sote-uudistuksen valmisteluvaihe Pohjois-Pohjanmaan maakunta- ja soteuudistuksen valmisteluajan visuaalinen ohje. Ohjeessa on määritelty valmisteluaikana

Lisätiedot

Esimerkkinä http://wordpress.com/ - ilmainen blogi-julkaisujärjestelmä. WordPress:stä on myös palvelimelle asennettava versio (WordPress.

Esimerkkinä http://wordpress.com/ - ilmainen blogi-julkaisujärjestelmä. WordPress:stä on myös palvelimelle asennettava versio (WordPress. BLOGIN LUOMINEN Esimerkkinä http://wordpress.com/ - ilmainen blogi-julkaisujärjestelmä. WordPress:stä on myös palvelimelle asennettava versio (WordPress.org) Myös http://blogspot.com on ilmainen ja helppokäyttöinen

Lisätiedot

HAKUKONEMARKKINOINTI KOTISIVUJEN PÄIVITYSOHJE

HAKUKONEMARKKINOINTI KOTISIVUJEN PÄIVITYSOHJE KOTISIVUJEN PÄIVITYSOHJE 1 SISÄLLYSLUETTELO KIRJAUDU PALVELUUN...3 KÄVIJÄSEURANTA...4 SIVUJEN PÄIVITYS...5 Sisältö...6 Sisältö / Työkalut...8 Sisältö / Taulukko...9 Sisältö / Kuvien tuominen...10 Sisältö

Lisätiedot

Hittitoimiston Forte-kotisivujen päivitysohje

Hittitoimiston Forte-kotisivujen päivitysohje Hittitoimiston Forte-kotisivujen päivitysohje Forte-kotisivujen päivitysohje 2 Sisällysluettelo: Kirjautuminen 2 Ohjausnäkymä 3 Sivun lisääminen ja yleisnäkymä 4 Sivun muokkaus 5 Sivun hakusanaoptimointi

Lisätiedot

60% c92 m0 y80 k31 r102 g158 b137 60% Pantone 327 C

60% c92 m0 y80 k31 r102 g158 b137 60% Pantone 327 C Graafinen ohjeisto c92 m0 y80 k31 r0 g93 b57 Pantone 327 C 60% c92 m0 y80 k31 r102 g158 b137 60% Pantone 327 C c0 m50 y100 k0 r252 g114 b22 Pantone 151 C c0 m25 y100 k0 r255 g167 b0 Pantone 1235 C Petäjäveden

Lisätiedot

Lisätehtävät. Frantic 2015 sivu 1 www.frantic.com

Lisätehtävät. Frantic 2015 sivu 1 www.frantic.com Lisätehtävät Frantic 2015 sivu 1 www.frantic.com Fontit - Google fonts Fonttien käyttäminen verkossa ilman uusien fonttien lataamista on melko rajattua, sillä koskaan ei voi tietää mitä fontteja vastaanottajan

Lisätiedot

Graafinen ohjeistus. Lemmikkilinnut Kaijuli ry

Graafinen ohjeistus. Lemmikkilinnut Kaijuli ry Graafinen ohjeistus Lemmikkilinnut Kaijuli ry Sisältö 1. Värit 2. Fontti 3. Logo 4. Graafiset elementit 5. Ylätunnisteen käyttö 6. Lainaukset ja nostot 7. Dokumenttipohjat Värit C 81 M 58 Y 51 K 34 R 50

Lisätiedot

Kaakkois-Suomen ammattikorkeakoulun opiskelijakunta. Graafinen ohjeisto

Kaakkois-Suomen ammattikorkeakoulun opiskelijakunta. Graafinen ohjeisto Kaakkois-Suomen ammattikorkeakoulun opiskelijakunta Graafinen ohjeisto 1 Sisällys Tunnus 3 Tunnuksen suoja-alueet 4 Tunnuksen käyttö 5 Värit 6 7 Kaakkolennokit 8 Sovellukset Käyntikortit 9 Asiakirjapohja

Lisätiedot

Sisältö. Graafisen ohjeiston tarkoitus 3 Typografia 4-5 Logo ja liikemerkki 6 Värimaailma 7 Huomioitavaa logosta ja väreistä 8 Maskotti 9 Pohjia 10-12

Sisältö. Graafisen ohjeiston tarkoitus 3 Typografia 4-5 Logo ja liikemerkki 6 Värimaailma 7 Huomioitavaa logosta ja väreistä 8 Maskotti 9 Pohjia 10-12 Graafinen Ohjeisto Sisältö Graafisen ohjeiston tarkoitus 3 Typografia 4-5 Logo ja liikemerkki 6 Värimaailma 7 Huomioitavaa logosta ja väreistä 8 Maskotti 9 Pohjia 10-12 Ella Nurminen Työssäoppimisen näyttötyö

Lisätiedot

Sami Hirvonen. Ulkoasut Media Works sivustolle

Sami Hirvonen. Ulkoasut Media Works sivustolle Metropolia ammattikorkeakoulu Mediatekniikan koulutusohjelma VBP07S Sami Hirvonen Ulkoasut Media Works sivustolle Loppuraportti 14.10.2010 Visuaalinen suunnittelu 2 Sisällys 1 Johdanto 3 2 Oppimisteknologiat

Lisätiedot

Rauman nuorten työpaja

Rauman nuorten työpaja Rauman nuorten työpaja Projektidokumentaatio Työssäoppiminen 24.11. -12.12.2014 Susa Räikkälä AVAT 2014-2015 Sisältää : Kirjastokuvaus Kiitoskortti Painikkeet Joulumyyjäisten esite Ntp-Logo Uutiset Yhteenveto

Lisätiedot

KOTISIVUKONE ULKOASUEDITORI

KOTISIVUKONE ULKOASUEDITORI KOTISIVUKONE ULKOASUEDITORI Kun olet luonut itsellesi kotisivut, voit aloittaa ulkoasun yksityiskohtaisemman räätälöimisen. Kotisivukone tarjoaa helppokäyttöisen ulkoasueditorin, jonka avulla saat sivujen

Lisätiedot

Suomen Palveluskoiraliitto Graafinen ohje

Suomen Palveluskoiraliitto Graafinen ohje Suomen Palveluskoiraliitto Graafinen ohje Suomen Palveluskoiraliiton graafinen ohje Näiden ohjeiden perusteella on tehty kirjepohjia, sekä esitys- ja koulutusmateriaaleja. Sisältö Logot ja tunnukset Typografia

Lisätiedot

www.kotisivukone.fi Pikaopas kotisivujen tekoon

www.kotisivukone.fi Pikaopas kotisivujen tekoon Kotisivut helposti! www.kotisivukone.fi Pikaopas kotisivujen tekoon Näin Kotisivukone toimii Kun olet avannut kotisivut Kotisivukoneella, tulet helppokäyttöiseen ylläpitotilaan ja voit heti aloittaa kotisivujen

Lisätiedot

PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI

PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI PROJEKTIDOKUMENTAATIO ASENNUS M. NIEMI Jani Niemi Eurajoen kristillinen opisto Audiovisuaalisen viestinnän ammattitutkinto 1 ASIAKKAAN JA PROJEKTIN ESITTELY...1 1.1 Aikataulu...1 2 SUUNNITTELU...1 2.1

Lisätiedot

RATA-SM -sarjan graafinen ohjeistus Alkusanat Kuvapankki

RATA-SM -sarjan graafinen ohjeistus Alkusanat Kuvapankki GRAAFINEN OHJEISTUS RATA-SM -sarjan graafinen ohjeistus Tähän ohjeeseen on koottu RATA-SM -sarjan ulkoisessa ja sisäisessä viestinnässä käytettävien materiaalien ulkoasua koskevat ohjeet. Tärkeää on muistaa

Lisätiedot

Ohjeistus yhdistysten internetpäivittäjille

Ohjeistus yhdistysten internetpäivittäjille Ohjeistus yhdistysten internetpäivittäjille Oman yhdistyksen tietojen päivittäminen www.krell.fi-sivuille Huom! Tarvitset päivittämistä varten tunnukset, jotka saat ottamalla yhteyden Kristillisen Eläkeliiton

Lisätiedot

On instrument costs in decentralized macroeconomic decision making (Helsingin Kauppakorkeakoulun julkaisuja ; D-31)

On instrument costs in decentralized macroeconomic decision making (Helsingin Kauppakorkeakoulun julkaisuja ; D-31) On instrument costs in decentralized macroeconomic decision making (Helsingin Kauppakorkeakoulun julkaisuja ; D-31) Juha Kahkonen Click here if your download doesn"t start automatically On instrument costs

Lisätiedot

1/2016 GRAAFINEN OHJEISTO

1/2016 GRAAFINEN OHJEISTO GRAAFINEN OHJEISTO 1.1.2016 1 Sisällys 1. Tunnus... 4 2. Värit... 5 3. Suoja-alue... 6 4. Typografia... 6 5. Käyntikortti... 7 6. Lomakkeisto... 8 7. Kirjekuoret... 9 8. PowerPoint... 10 9. Ilmoittelu...

Lisätiedot

Paluumuuttajien työllistyminen Uudenmaan ja palvelut liiton GRAAFINEN OHJEISTO. Selvitystyön raportti

Paluumuuttajien työllistyminen Uudenmaan ja palvelut liiton GRAAFINEN OHJEISTO. Selvitystyön raportti Paluumuuttajien työllistyminen Uudenmaan ja palvelut liiton GRAAFINEN OHJEISTO Selvitystyön raportti Päivitetty 3/2015 GRAAFINEN OHJEISTO TUNNUS 3 TUNNUKSEN VERSIOT JA KÄYTTÖ 4 VÄRIT 5 GRAAFINEN ELEMENTTI

Lisätiedot

SISÄLLYS. Tunnus 3 Värit 5 Typografia 6 Visuaalinen elementti 7 Ilmesovellukset 8 Kuvien käyttö 11. Uusimaa hanke Graafinen ohjeistus

SISÄLLYS. Tunnus 3 Värit 5 Typografia 6 Visuaalinen elementti 7 Ilmesovellukset 8 Kuvien käyttö 11. Uusimaa hanke Graafinen ohjeistus GRAAFINEN OHJEISTUS SISÄLLYS Tunnus 3 Värit 5 Typografia 6 Visuaalinen elementti 7 Ilmesovellukset 8 Kuvien käyttö 11 Uusimaa 2019 -hanke Graafinen ohjeistus TUNNUS Uusimaa 2019 -hankkeen tunnus on kaksikielinen.

Lisätiedot

Kopiodaksesi, leikataksesi ja liittääksesi helpointa on käyttää näppäimistön pikavalintoja:

Kopiodaksesi, leikataksesi ja liittääksesi helpointa on käyttää näppäimistön pikavalintoja: Ohjeita järjestöpankin käytön tueksi Huomioitavaa:... 1 1 Sisäänkirjautuminen... 2 2 Sivun/henkilökortin muokkaaminen... 2 3 Uutisen/sivun/tapahtuman, tms. lisääminen... 3 4 Uutisen/tapahtuman saaminen

Lisätiedot

Aloita oman blogisi luominen (järjestelmä lupaa sen tapahtuvan sekunneissa ;-))

Aloita oman blogisi luominen (järjestelmä lupaa sen tapahtuvan sekunneissa ;-)) BLOGIN LUOMINEN Esimerkkinä http://wordpress.com/ - ilmainen blogi-julkaisujärjestelmä. WordPress:stä on myös palvelimelle asennettava versio (WordPress.org) Avaa http://wordpress.com/ -sivu. Aloita oman

Lisätiedot

Graafiset ohjeet. Päivitetty 27.5.2013 I LVI-TU. LVI-Tekniset Urakoitsijat LVI-TU ry I Graafiset ohjeet I 1

Graafiset ohjeet. Päivitetty 27.5.2013 I LVI-TU. LVI-Tekniset Urakoitsijat LVI-TU ry I Graafiset ohjeet I 1 Graafiset ohjeet Päivitetty 27.5.2013 I LVI-TU LVI-Tekniset Urakoitsijat LVI-TU ry I Graafiset ohjeet I 1 Sisältö Tunnus...3 Typografia...4 Värit...5 Käyntikortit ja sähköinen allekirjoitus...6 Lomakkeet

Lisätiedot

SUOMEN JOUSIAMPUJAIN LIITTO RY Graafinen ohjeisto Versio 1, Huhtikuu 2017

SUOMEN JOUSIAMPUJAIN LIITTO RY Graafinen ohjeisto Versio 1, Huhtikuu 2017 GRAAFINEN OHJEISTO Versio 1, Huhtikuu 2017 2 Sisällys: Logo, värit ja typografia Logo... 4 Logon käyttö... 5 Värimaailma... 8 Typografia... 9 3 LOGO & LIIKEMERKKI Suomen Jouosiampujain liiton logo koostuu

Lisätiedot

eportfolio ammatillisen kasvun ja oman osaamisen kuvaaminen

eportfolio ammatillisen kasvun ja oman osaamisen kuvaaminen eportfolio ammatillisen kasvun ja oman osaamisen kuvaaminen Esimerkkejä eportfolioista ja lisätietoa eportfolio /web-sivujen julkaisupalveluista Few examples of eportfolios / personal websites. (with permission

Lisätiedot

1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE VÄRILLINEN LOGO LOGO VÄRILLISELLÄ POHJALLA MUSTA LOGO 7 1.

1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE VÄRILLINEN LOGO LOGO VÄRILLISELLÄ POHJALLA MUSTA LOGO 7 1. 1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE 4 1.2 VÄRILLINEN LOGO 5 1.3 LOGO VÄRILLISELLÄ POHJALLA 6 1.4 MUSTA LOGO 7 1.5 EI NÄIN 8 3 1.1 Logo ja turva-alue neste jacobsin logo Neste Jacobsin uusi tekstilogo

Lisätiedot

CSS - tyylit. 13.11.2000 Seppo Räsänen

CSS - tyylit. 13.11.2000 Seppo Räsänen CSS - tyylit 13.11.2000 Seppo Räsänen Sivu 2 1 CSS-tyylit Dynaaminen HTML tai DHTML on standardi, joiden käyttöä tukevat uusimmat Netscapen ja Microsoftin selaimet. DHTML:n ominaisuuksia ovat tyylitiedostot

Lisätiedot

Graafinen ohjeisto. Päivitetty tammikuussa 2015

Graafinen ohjeisto. Päivitetty tammikuussa 2015 Graafinen ohjeisto Päivitetty tammikuussa 2015 Sisällys Sisällys Esipuhe Liikemerkki ja logo Värit korteille ja kirjepohjalle Typografia Fontit korteille ja kirjepohjalle Kirje- ja esityspohja Käyntikorttipohjat

Lisätiedot

Oulun yliopiston www-sivujen tekeminen

Oulun yliopiston www-sivujen tekeminen Oulun yliopiston www-sivujen tekeminen Oulun yliopiston ja sen yksiköiden www-sivuilla noudatetaan yliopiston www-politiikan peruslinjauksia sekä graafisen ohjeiston mukaista visuaalista linjaa. Yhtenäisellä

Lisätiedot

Google Sites: sivun muokkaaminen (esim. tekstin, kuvien, linkkien, tiedostojen, videoiden ym. lisääminen)

Google Sites: sivun muokkaaminen (esim. tekstin, kuvien, linkkien, tiedostojen, videoiden ym. lisääminen) Google Sites: sivun muokkaaminen (esim. tekstin, kuvien, linkkien, tiedostojen, videoiden ym. lisääminen) 1. Valitse sivu, jolle haluat lisätä sisältöä tai jota haluat muutoin muokata, ja klikkaa sitä.

Lisätiedot

Lanuti.fi Lapin nuorisotiedotus. TIETOTALO INFOCENTER OY HTC Keilaniemi Keilaranta 17, Espoo Teknotie 14 16, Napapiiri, Rovaniemi

Lanuti.fi Lapin nuorisotiedotus. TIETOTALO INFOCENTER OY HTC Keilaniemi Keilaranta 17, Espoo Teknotie 14 16, Napapiiri, Rovaniemi Lanuti.fi 2015 Lapin nuorisotiedotus TIETOTALO INFOCENTER OY HTC Keilaniemi Keilaranta 17, 02150 Espoo Teknotie 14 16, 96930 Napapiiri, Rovaniemi Y-tunnus 1008465-8 www.tietotalo.fi Päivämäärä Versio Kuvaus

Lisätiedot

Kotisivut helposti - osa 4

Kotisivut helposti - osa 4 Kotisivut helposti - osa 4 Artikkelisarjan kolmessa ensimmäisessä osassa esiteltiin Internet-siviuihin sekä XHTML- ja CSS-ohjelmointikieliin liittyviä perusteita. Tässä osassa kerrotaan, miten aiemmin

Lisätiedot

GRAAFINEN OHJEISTO KEVYT

GRAAFINEN OHJEISTO KEVYT päivitetty 25.6.2015 MESSUJEN GRAAFINEN OHJEISTO KEVYT YLEISET 21 SARKA-MESSUT 4 Messutunnukset 7 Liikemerkki / synty 8 Liikemerkki / ryhmässä 9 Liikemerkki / kuosipinta 1 10 Liikemerkki / kuosipinta 2

Lisätiedot

POWERPOINT HARJOITUKSET OMAN ESITYSPOHJAN RAKENTAMINEN

POWERPOINT HARJOITUKSET OMAN ESITYSPOHJAN RAKENTAMINEN POWERPOINT HARJOITUKSET 3.1-3.7 OMAN ESITYSPOHJAN RAKENTAMINEN Tässä harjoituksessa luomme oman perustyylin, teemme omat värit, oman fonttiteeman, mukautamme perustyyliä ja tallennamme luomuksemme. 1/5

Lisätiedot

Canva CV NÄIN PÄÄSET ALKUUN CANVA CV:N TEOSSA: Canva on graafisen suunnittelun

Canva CV NÄIN PÄÄSET ALKUUN CANVA CV:N TEOSSA: Canva on graafisen suunnittelun Canva CV Canva on graafisen suunnittelun ohjelma, jota voi käyttää niin selaimella kuin mobiiliapplikaatiollakin. Canvassa on paljon maksuttomia pohjia CV:n visualisointiin! Canvan perusominaisuuksia voit

Lisätiedot

Corporate Identity YRITYSKEHITYS FÖRETAGSUTVECKLING BUSINESS DEVELOPMENT

Corporate Identity YRITYSKEHITYS FÖRETAGSUTVECKLING BUSINESS DEVELOPMENT Corporate Identity Sisällysluettelo 2... Sisällysluettelo 3... Novago logo 4... Novago logo suoja-alue 5... Novago logopohjia 6... Novago värimaailma 7... Novago typografia 8... Tunnisteraita 9... Novago

Lisätiedot

Kun olet valmis tekemään tilauksen, rekisteröidy sovellukseen seuraavasti:

Kun olet valmis tekemään tilauksen, rekisteröidy sovellukseen seuraavasti: HENKILÖKORTTIEN SUUNNITTELUSOVELLUS SOVELLUKSEN KÄYTTÖOHJE Voit kokeilla korttien suunnittelemista valmiiden korttipohjien avulla ilman rekisteröitymistä. Rekisteröityminen vaaditaan vasta, kun olet valmis

Lisätiedot

CSS-kielen avulla määritellään HTML-dokumentin tyyli. CSS avulla voidaan tarkemmin määritellä eri elementtien ominaisuuksia.

CSS-kielen avulla määritellään HTML-dokumentin tyyli. CSS avulla voidaan tarkemmin määritellä eri elementtien ominaisuuksia. CSS1 CSS (Cascading Style Sheets) CSS-kielen avulla määritellään HTML-dokumentin tyyli. CSS avulla voidaan tarkemmin määritellä eri elementtien ominaisuuksia. Esim.

Lisätiedot

hannu hautala luontokuvakeskus Graafinen ohjeisto

hannu hautala luontokuvakeskus Graafinen ohjeisto Graafinen ohjeisto Tunnus ja värisymboliikka Merkin muoto perustuu lentävään kuukkeliin, joka on Kuusamon metsien onnea tuova seuralainen. Lennon suunta on positiivisesti ylös vasemmalle, joka on kokonaisuutta

Lisätiedot

TAMPEREEN SISU vuodesta d 1960 GRAAFINEN OHJEISTUS

TAMPEREEN SISU vuodesta d 1960 GRAAFINEN OHJEISTUS TAMPEREEN SISU vuodesta 1960 GRAAFINEN OHJEISTUS Sisällysluettelo LOGO Logo 3 Typografia. 5 Värit... 8 Lomakkeet 10 Kuvitus 12 - A KU UVITUS KEET LOMAKK TYPO GRAFI VÄRIT 2 LOGO TAMPEREEN SISU vuodesta

Lisätiedot

Kopseptisuunnittelu Verkkomultimedia ICT1tn004

Kopseptisuunnittelu Verkkomultimedia ICT1tn004 Kopseptisuunnittelu Verkkomultimedia ICT1tn004 Sivustokartta Käsikirjoitus Graafinen suunnitelma Elina Ulpovaara Konseptisuunnittelu ICT1TN004 toiminnallisuus toimintatarinat -> käyttötarinat kuvatarinat

Lisätiedot

Sähköisen Markkinoinnin Koulutus Kotisivutyöpaja. Julkaisujärjestelmän ohje

Sähköisen Markkinoinnin Koulutus Kotisivutyöpaja. Julkaisujärjestelmän ohje Sähköisen Markkinoinnin Koulutus Kotisivutyöpaja Julkaisujärjestelmän ohje 2014 2 PM-Julk aisujärjestelmän perusohjeet Julkaisujärjestelmän käyttöönotto Julkaisujärjestelämän avulla voit itsenäisesti muokata

Lisätiedot

Pedanet oppilaan ohje Aleksanteri Kenan koulu Eija Arvola

Pedanet oppilaan ohje Aleksanteri Kenan koulu Eija Arvola Pedanet oppilaan ohje Aleksanteri Kenan koulu Eija Arvola 26.8.2016 SISÄLLYSLUETTELO 1. Omat asetukset kuntoon (kaikkien tehtävä aluksi) sivut 3-5 2. Tärkeiden sivujen tilaaminen omiin linkkeihin sivut

Lisätiedot

Office 365 palvelujen käyttöohje Sisällys

Office 365 palvelujen käyttöohje Sisällys Office 365 palvelujen käyttöohje Sisällys Sisäänkirjautuminen... 2 Office 365:n käyttöliittymä... 3 Salasanan vaihto... 5 Outlook-sähköpostin käyttö... 7 Outlook-kalenterin käyttö... 10 OneDriven käyttö...

Lisätiedot

selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård

selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård CSS selectorit Elementti HTML CSS otsikko h1 { color: pink; Luokka HTML CSS

Lisätiedot

Brändiohjeisto. Nenäpäivä-säätiö

Brändiohjeisto. Nenäpäivä-säätiö Brändiohjeisto Nenäpäivä-säätiö Logo Nenäpäivä-logon kanssa voi leikkiä ja käyttää mielikuvitusta. Tunnukselle saa löytää uusia mitä merkityksellisempiä paikkoja ja sen avulla saa yllättää. Nenäpäivän

Lisätiedot

SISÄLLYS SISÄLLYS TUNNUS SUOJA-ALUE JA PIENIN KOKO VÄRIMÄÄRITYKSET TYPOGRAFIA

SISÄLLYS SISÄLLYS TUNNUS SUOJA-ALUE JA PIENIN KOKO VÄRIMÄÄRITYKSET TYPOGRAFIA Suomen Lions-liitto ry:n GRAAFINEN OHJEISTO SISÄLLYS SISÄLLYS TUNNUS SUOJA-ALUE JA PIENIN KOKO VÄRIMÄÄRITYKSET TYPOGRAFIA 2 3 4 5 6 Suomen Lions-liitto ry:n graafinen ohjeisto on tehty yhtenäistämään järjestön

Lisätiedot

Vehmaan kunta. Wordpress käyttöopas. Betta Digital Oy

Vehmaan kunta. Wordpress käyttöopas. Betta Digital Oy Vehmaan kunta Wordpress käyttöopas Betta Digital Oy 1 / 22 Sisällys 1. Kirjautuminen... 3 1.1. Sisäänkirjautuminen ei onnistu... 3 2. Hallintapaneeli... 5 2.1. Sisään kirjautuneen hallintanäkymä... 6 3.

Lisätiedot

GRAAFINEN OHJEISTO versio 1.0

GRAAFINEN OHJEISTO versio 1.0 03.11.2017 GRAAFINEN OHJEISTO versio 1.0 SISÄLLYS Graafisen ohjeiston tarkoitus on nimensä mukaisesti ohjeistaa, selkeyttää ja yhdenmukaistaa Vierailu- ja innovaatiokeskus Joen yhteydessä tapahtuvaa viestintää.

Lisätiedot

Hittitoimiston Verkkokaupan päivitysohje

Hittitoimiston Verkkokaupan päivitysohje Hittitoimiston Verkkokaupan päivitysohje Verkkokaupan päivitysohje Jaana Mäkisalo 2 Sisällysluettelo: Kirjautuminen 2 Ohjausnäkymä 3 Sivun lisääminen ja yleisnäkymä 4 Sivun muokkaus 5 Sivun hakusanaoptimointi

Lisätiedot

Munstadi Wordpress ohjeet

Munstadi Wordpress ohjeet Munstadi Wordpress ohjeet Sisällys Kirjautuminen... 4 Ohjauspaneeli... 4 Sisällön luominen... 6 1.1 Sivut... 6 1) Uuden sivun luominen (tai vanhan muokkaaminen)... 6 2) Otsikon valinta ja tekstisisällön

Lisätiedot

MmK PHOTO. Projektidokumentaatio

MmK PHOTO. Projektidokumentaatio MmK PHOTO Projektidokumentaatio 2015 1 Sisällysluettelo 1 Esittely... 3 1.1 Idea/Tarve... 3 1.2 Synopsis/ Projektin kuvaus... 3 1.3 Aikataulutus ja kustannusarvio... 4 2 Suunnittelu... 6 2.1 Banneri ja

Lisätiedot

RATKAISUT SIVU 1 / 15. Väriteemaan pääset käsiksi hieman eri tavoilla PowerPointin eri versioissa.

RATKAISUT SIVU 1 / 15. Väriteemaan pääset käsiksi hieman eri tavoilla PowerPointin eri versioissa. RATKAISUT SIVU 1 / 15 PowerPoint jatko Harjoitus 3.1-3.7: Harjoitus 3.1: Avaa ensin Harjoitustiedosto.pptx. Väriteemaan pääset käsiksi hieman eri tavoilla PowerPointin eri versioissa. Valitse joka tapauksessa

Lisätiedot

KÄYTTÖOHJE / Ver 1.0 / Huhtikuu WordPress KÄYTTÖOHJE Sotkamo 2016

KÄYTTÖOHJE / Ver 1.0 / Huhtikuu WordPress KÄYTTÖOHJE Sotkamo 2016 / / WordPress KÄYTTÖOHJE Sotkamo 2016 Sisältö Sisältö 1. Yleistä 2. Kirjautuminen ylläpitoon 2.1. Kirjaudu osoitteessa: http://sotkamo.valudata.fi/admin Myöhemmin: http://www.sotkamo.fi/admin 2.2 Salasana

Lisätiedot

Ulkoasun muokkaus CSS-tiedostossa

Ulkoasun muokkaus CSS-tiedostossa Ulkoasun muokkaus CSS-tiedostossa Nellin ulkoasun muokkaus CSS-tiedostossa Lähes kaikki on muokattavissa css-tyylitiedosta käsin. Jokaiselle kieliversiolle on oma tyylitiedostonsa: www_v_fin/metalib.css

Lisätiedot

KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018. Kurra Hockey Ry 1

KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018. Kurra Hockey Ry 1 KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018 Kurra Hockey Ry 1 Kirjautuminen ylläpitoon https://www.kurra.fi/jasen Kirjaudu sisään saamillasi tunnuksilla Kurra Hockey Ry 2 Päivitä

Lisätiedot

Jotta voit käyttää Facebookia täytyy sinun ensiksi luoda sinne käyttäjätili. Käyttäjätilin luominen onnistuu noudattamalla seuraavia ohjeita.

Jotta voit käyttää Facebookia täytyy sinun ensiksi luoda sinne käyttäjätili. Käyttäjätilin luominen onnistuu noudattamalla seuraavia ohjeita. Facebook-pikaopas Mikä Facebook on? Facebook on internetissä toimiva sosiaalinen palvelu, jonka avulla sen käyttäjät voivat olla yhteydessä ystäviinsä ja sukulaisiinsa, jakaa kuvia ja videoita sekä liittyä

Lisätiedot

KESKUSTANUORTEN NETTISIVUT- OHJEITA PIIRIYLLÄPITÄJÄLLE 1. KIRJAUTUMINEN

KESKUSTANUORTEN NETTISIVUT- OHJEITA PIIRIYLLÄPITÄJÄLLE 1. KIRJAUTUMINEN KESKUSTANUORTEN NETTISIVUT- OHJEITA PIIRIYLLÄPITÄJÄLLE 1. KIRJAUTUMINEN -Mene osoitteeseen keskustanuoret.fi/user - Kirjoita saamasi käyttäjätunnus ja salasana - Klikkaa yllä olevaa piirisi logoa niin

Lisätiedot

Office 365 OneDrive Opiskelijan ohje 2017

Office 365 OneDrive Opiskelijan ohje 2017 Digitaalisen oppimisen tiimi/ Mia Tele & Kalle Malinen 13.10.2017 Office 365 OneDrive Opiskelijan ohje 2017 Sisältö 1. OneDrive... 2 2. Miten voin ottaa OneDriven käyttöön?... 3 3. Mitä OneDrivella voi

Lisätiedot

HENKILÖKOHTAINEN SUUNNITELMA VERKKOVIESTINNÄN SUUNNITTELU JA ILMAISU

HENKILÖKOHTAINEN SUUNNITELMA VERKKOVIESTINNÄN SUUNNITTELU JA ILMAISU HENKILÖKOHTAINEN SUUNNITELMA VERKKOVIESTINNÄN SUUNNITTELU JA ILMAISU Emilia Ketola Eurajoen kristillinen opisto Avat 2015-2016 1 Johdanto... 3 2 Käsikirjoitusprosessi... 4 3 Käyttöliittymäsuunnittelu...

Lisätiedot

PROJEKTIDOKUMENTAATIO RITVAN TOIVEMATKAT

PROJEKTIDOKUMENTAATIO RITVAN TOIVEMATKAT PROJEKTIDOKUMENTAATIO RITVAN TOIVEMATKAT Emilia Ketola Eurajoen kristillinen opisto Avat 2015-2016 1 Kartoitus... 3 1.1 Asiakas ja sivujen tarve... 3 1.2 Yhteydenotto asiakkaaseen... 3 1.3 Aikataulu ja

Lisätiedot

1. ASIAKKAAN OHJEET... 2. 1.1 Varauksen tekeminen... 2. 1.2 Käyttäjätunnuksen luominen... 4. 1.3 Varauksen peruminen... 4

1. ASIAKKAAN OHJEET... 2. 1.1 Varauksen tekeminen... 2. 1.2 Käyttäjätunnuksen luominen... 4. 1.3 Varauksen peruminen... 4 1. ASIAKKAAN OHJEET... 2 1.1 Varauksen tekeminen... 2 1.2 Käyttäjätunnuksen luominen... 4 1.3 Varauksen peruminen... 4 1.4 Omien tietojen muokkaaminen... 5 1.5 Salasanan muuttaminen... 5 2. TYÖNTEKIJÄN

Lisätiedot

KVPS Tukena Oy Graafinen ohjeisto 04/2018

KVPS Tukena Oy Graafinen ohjeisto 04/2018 1 KVPS Tukena Oy Graafinen ohjeisto 04/2018 2 Graafinen ohjeisto Tervetuloa tutustumaan KVPS Tukena Oy:n graafisiin ohjeisiin. Tämä ohjeisto sisältää ohjeita ja vinkkejä brändi-identiteetin käyttöön ja

Lisätiedot

LOGO 2. LOGO. Autokeskuksen yritystunnus on Autokeskus-logo.

LOGO 2. LOGO. Autokeskuksen yritystunnus on Autokeskus-logo. 8 LOGO Autokeskuksen yritystunnus on Autokeskus-logo. Autokeskuksen logoa käytetään aina vaakamuodossa. Logoa ei saa latoa, piirtää tai asetella uudelleen. Logon mittasuhteita tai väritystä ei saa muuttaa.

Lisätiedot

Tietosuoja-portaali. päivittäjän ohje

Tietosuoja-portaali. päivittäjän ohje Tietosuoja-portaali päivittäjän ohje Maisa Kinnunen 2010 1 Sisältö PÄIVITTÄJÄN OHJE Kirjautuminen...3 Sivujen tekstin muokkaus...4 Tiedostojen lisääminen palvelimelle...9 Jos sinun pitää selvittää tiedoston/kuvan

Lisätiedot

Editorin käyttö. TaikaTapahtumat -käyttöohje

Editorin käyttö. TaikaTapahtumat -käyttöohje Editorin käyttö TaikaTapahtumat -käyttöohje Yleistä ohjelmasta etaika-järjestelmän HTML-moduuli sisältää tekstieditorin, joka on monipuolinen apuväline tehtäessä materiaalia sivustolle (esim. tapahtumakohtaiset

Lisätiedot

Ohjeita Porin Lyseon koulun yrittäjuuskasvatuksen blogin kirjoittamiseen

Ohjeita Porin Lyseon koulun yrittäjuuskasvatuksen blogin kirjoittamiseen Ohjeita Porin Lyseon koulun yrittäjuuskasvatuksen blogin kirjoittamiseen Tervetuloa mukaan rakentamaan yr-blogiamme! Lue seuraavat ohjeet ennen artikkelisi julkaisemista. Pääset kirjautumaan sisään osoitteessa

Lisätiedot

Kangasniemen yrityshakemisto KÄYTTÖOHJE YRITTÄJÄLLE. KANGASNIEMEN KUNTA yrityshakemisto.kangasniemi.fi

Kangasniemen yrityshakemisto KÄYTTÖOHJE YRITTÄJÄLLE. KANGASNIEMEN KUNTA yrityshakemisto.kangasniemi.fi 2015 Kangasniemen yrityshakemisto KÄYTTÖOHJE YRITTÄJÄLLE KANGASNIEMEN KUNTA yrityshakemisto.kangasniemi.fi 1 Sisällysluettelo 1. Sivustolle rekisteröityminen... 2 2. Yrityksen lisääminen... 3 2.1. Yritystiedot...

Lisätiedot

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE JULKAISUJÄRJESTELMÄÄN KIRJAUTUMINEN. Osoitekenttään kirjoitetaan www.domain.fi/admin. Kirjoita käyttäjätunnus: xxxxxx. Salasana:

Lisätiedot

Oma kartta Google Maps -palveluun

Oma kartta Google Maps -palveluun TAMPERE 1 (6) Oma kartta Google Maps -palveluun Google Maps palveluun on mahdollista luoda karttoja omilla paikkamerkeillä. Tilin luonti Google-palveluihin Tehdäksesi karttoja omilla paikkamerkinnöillä,

Lisätiedot

Yleistä. Suositukset. Rakenne

Yleistä. Suositukset. Rakenne Yhdistysavaimen ulkoasuohjeistus Jyty-liiton yhdistyksille 27.5.2015 Yleistä Tämä on Jytyliiton yhdistyksille laadittu ohjeistus ulkoasun rakentamisesta Yhdistysavain-julkaisujärjestelmään. Tavoitteena

Lisätiedot

Paikallisen nuorisoseuran. graafinen ohjeisto. Mikä on graafinen ohjeisto ja sisällys

Paikallisen nuorisoseuran. graafinen ohjeisto. Mikä on graafinen ohjeisto ja sisällys Paikallisen nuorisoseuran graafinen ohjeisto Mikä on graafinen ohjeisto ja sisällys Graafinen ohjeisto tukee Suomen Nuorisoseurojen visuaalista ilmettä sekä auttaa ilmeen yhdenmukaisuuden säilyttämisessä.

Lisätiedot

Tunnus. 1. Suomen Ammattiliittojen Keskusjärjestön SAK:n tunnus perusmuodossaan

Tunnus. 1. Suomen Ammattiliittojen Keskusjärjestön SAK:n tunnus perusmuodossaan Graafiset ohjeet 1 1. Suomen Ammattiliittojen Keskusjärjestön SAK:n tunnus perusmuodossaan Tunnus Suomen Ammattiliittojen Keskusjärjestön SAK:n tunnus on järjestön nimen alkukirjaimista muodostettu nimilogo,

Lisätiedot

A-KILTOJEN LI TTO RY A-Kiltojen Liitto ry - Graafinen ohjeistus 4/2019

A-KILTOJEN LI TTO RY A-Kiltojen Liitto ry - Graafinen ohjeistus 4/2019 A-KILTOJEN LIITTO RY A-Kiltojen Liitto ry Graafinen ohjeistus Tunnus, käyttö A-Kiltojen Liitto ry:n tunnuksen väri on vihreä. Tunnusta tulee pääasiallisesti käyttää valkoisella tai mahdollisimman vaalealla

Lisätiedot

Suvi Junes/Pauliina Munter Tietohallinto/Opetusteknologiapalvelut 2014

Suvi Junes/Pauliina Munter Tietohallinto/Opetusteknologiapalvelut 2014 Tietokanta Tietokanta on työkalu, jolla opettaja ja opiskelijat voivat julkaista tiedostoja, tekstejä, kuvia ja linkkejä alueella. Opettaja määrittelee lomakkeen muotoon kentät, joiden kautta opiskelijat

Lisätiedot

Tunnuksen päivitys 19.9.2012

Tunnuksen päivitys 19.9.2012 Tunnuksen päivitys 19.9.2012 2 Tampereen yliopiston tunnus Tampereen yliopiston tunnus Tuhannet ihmiset näkevät Tampereen yliopiston tunnuksen päivittäin lomakkeissa, nettisivuilla, raporteissa, esitteissä.

Lisätiedot

Epooqin perusominaisuudet

Epooqin perusominaisuudet Epooqin perusominaisuudet Huom! Epooqia käytettäessä on suositeltavaa käyttää Firefox -selainta. Chrome toimii myös, mutta eräissä asioissa, kuten äänittämisessä, voi esiintyä ongelmia. Internet Exploreria

Lisätiedot