Verkkopalvelujen tuottaminen ja ylläpito ✖ Presentation template by SlidesCarnivalPhotographs by UnsplashUnsplash

Aikataulu ✖ klo LÄHI TSAM A2068 ATK ✖ Etä, verkko (17-20) ✖ Etä, verkko (17-20)

Lähi- ja verkko-opetuksen keskeinen sisältö ✖ Verkkopalvelujen sisältöjen tuottaminen ✖ Verkkopalvelujen kehittäminen ja suunnittelu ✖ Verkkopalvelujen perustaminen ja ylläpito

Tehtävä: ✖ Oman työ- tai työharjoittelupaikan verkkopalvelujen suunnittelu, luonti, sisällön tuotto ja ylläpito Työssäoppimisen teema ✖ Osallistuu verkkopalvelun luomiseen, toteuttamiseen ja ylläpitoon Työssäoppimisen teema:

www-sivut Responsiivisuus? Retargetointi? Konversio?

www-sivuja varten pohdi: Mitä? Mikä on www-sivustojen ensisijainen tehtävä? (Tämä on suunnittelun lähtökohta.) Mihin muuhun tarkoitukseen verkkopalvelua hyödynnetään? Kenelle? Segmentointi: Kenelle suunnittelemasi www-sivustot on tarkoitettu Miksi? Mikä on www-sivustojen ensisijainen tavoite? Milloin? Aikataulu, välitavoitteet

Tehtävä: www-sivut WWW-sivut Teemme www-sivut aitoon tarpeeseen wix-työkalulla. ( Mieti mille yritykselle/ tapahtumalle/ yhdistykselle voisit tehdä nettisivut. Sivut voivat olla myös oma portfoliosi.

Laadukas sisältö ✖ Löytyy verkosta helposti (avainsanat!) ✖ Vastaa kysymyksiin ✖ Ohjaa kuluttajaa toimintaan ✖ Pitää linkeillä otteessaan ✖ Jakautuu laajalle yleisölle ✖ Vetää puoleensa yhä uudestaan ja uudestaan ✖ Kestää aikaa (pitkä häntä) Puro_esitys_ _Verkon-avulla-bisnesta.pdf

Trendejä: Nyt! Responsiivisuus on must! Responsiivisuus tarkoittaa verkkosivujen mukautumista eri näyttökokoihin. Responsiivinen toteutus helpottaa sivuston käyttöä etenkin matkapuhelmella ja tabletilla. Toukokuun alusta 2015 Google ei enää näytä ei-responsiivisia sivuja haussaan!

Tunnista oman yleisösi tarpeet ✖ Opi kuuntelemaan asiakkaitasi: tutki mitä yleisösi/asiakkaat verkosta etsivät ja millä sanoilla ja lauseilla he etsivät! ✖ Vastaa omalla sisällölläsi heidän tarpeisiinsa ja tarjoa ratkaisuja heidän ongelmiinsa! Puro_esitys_ _Verkon-avulla-bisnesta.pdf

Miten? Mitä asiaa aloitussivulle? ✖ Navigointi: Mitkä asiat navigointipalkkiin? max 7 asiaa ✖ Kuinka laaja kokonaisuus tulee olemaan, kasvaako se ja mihin suuntaan? ✖ Kuka verkkopalvelua ylläpitää? ✖ Mitä kuvia ja tekstiä halutaan. mitä on olemassa ja mitä täytyy hankkia? ✖ Onko kaikkiin materiaaleihin käyttöoikeudet? ✖ Aikataulu ✖ Yrityksen visuaalinen ilme ✖ Muita toiveita, tarpeita: Määrittele muut toiveet mm. väreistä, käytettävistä kuvista, päivitettävyydestä, toiminnallisuudesta ym.

wix ✖ Valitse pohja ✖ Muokkaa navigointi ✖ Lisää kuvat ✖ Lisää tekstit ✖ Lisää kartta: market/apps-made-by-w market/apps-made-by-w How to Build a Website with Wix.com (video) ix/kb/how-can-i-use-the-google-maps-1

Valokuvaus

Valokuvaustehtävä ✖ Valokuvaa henkilökuva yrityksen henkilöstön esittely www-sivulle ✖ Valokuvaa kuvituskuva (esim. maisema, luontokuva yrityksen www-sivuille, someen).

✖ Valokuvaa henkilökuva, joka tulee yrityksen www-sivulle & someen. Kuva voi olla myös omakuva. ✖ Tutkimusten mukaan asiakkaan on helpompi ottaa yhteyttä esim. puhelimella tai spostilla, kun on ensin nähnyt kuvan henkilöstä, johon on ottamassa yhteyttä. Katse kameraan (=helposti lähestyttävä, asiakaspalveluhenkinen) Mitä kuva viestii? (Harrastus, luonteenpiirre, asiallisuus, iloisuus) Teema? Miten kuvattava haluaa tulla nähdyksi? Kuvaa mielellään luonnonvalossa, puolipilvisenä päivänä. Havainnoi yritysten www-sivuja – minkälaisia henkilöstön esittelysivuja on – miten ne toimivat? Valokuvaustehtävä 1. henkilökuva

✖ Valokuvaa kuvituskuva (esim. maisema, luontokuva yrityksen www-sivuille, someen). Vaakakuva ja pystykuva. Mikä aihe sopii kuvituskuvaksi ja on tunnelmaltaan oikea? Mieti rajaus, sommittelu. Toimisiko lähikuva? Jos haluat syvyysvaikutelmaa, perspektiiviä aseta etualalle jokin objekti näin syvyysvaikutelma tulee paremmin esiin. Valokuvausstehtävä 2.

✖ 1. ✖ Valokuva muodostuu VALOSTA! Siis tarkkaile valoa! Sopiiko kuvaasi myötävalo, vastavalo, sivuvalo vai mahdollisimman tasainen valo. Eri asiat tulevat esiin – vaihtamalla kuva/valokulmaa. ✖ 2. ✖ Muotokuvissa pilvinen sää ja pilvipouta tuo kauniimmin kasvonpiirteet kuin keskipäivän auringonpaiste. Kirkkaassa valossa varjot ovat vahvat ja silmät eivät pysy auki siristelemättä. Kirkkaana päivänä hyvä kuvaspaikka saattaa löytyä varjoista. 7 vinkkiä valokuvaukseen

✖ 3. Hetki ✖ Valokuvaamalla voit ikuistaa ainutlaatuisen hetken. Silmät auki ja kamera valmiiksi. Jos et kamerasi kanssa ole valmiina juuri silloin kun näet jotain kiinnostavaa tapahtuvan, pyydä kaveria toistamaan se mitä näit esim. ”heilauta vielä hiuksiasi samalla tavalla kuin äsken” ja nappaa sitten kuva. ✖ 4. Kuvakulma. Kuva näyttää erilaiselta riippuen kovakulmasta, mitä rajaat pois, mitä näkyy varsinaisen kuvattavan ”taustalla” 5. Rajaa ihmiset oikein. Kuvan tulisi katketa nivelien välistä, kuten olkavarresta, mahasta tai reidestä. Kuvan rajaaminen esimerkiksi ranteen kohdalta saa kohteen näyttämään siltä, että häneltä puuttuu käsi. Samaa sääntöä voi soveltaa esineisiin, kuten tuolinjalkoihin. Hetki, kuvakulma

✖ 6. Sommittelu ✖ Jako kolmeen, kultainen leikkaus ✖ Sommittelun olennainen sisältö on se, että kuvan tärkeimpiä elementtejä ei tule yleensä sijoittaa keskelle. ✖ Kuvittele kuvaan kaksi näkymätöntä linjaa pystyyn ja kaksi vaakaan ja jaa kuva näin yhdeksään yhtä suureen osaan Yritä sitten sijoittaa kuvan tärkein osatekijä, esimerkiksi silmä, lähelle jotakin linjojen leikkauskohdista. Näin katsojan silmä liikkuu ympäri kuvaa. Kolmannesten sääntö pätee niin pysty- kuin vaakakuviinkin ja nostaa esiin niiden olennaisen sisällön. ✖ Lähde: jahttp://www2.amk.fi/digma.fi/ ✖ Sommittelu

✖ 7. Tila Tyhjä tila on merkityksellinen sommittelukeino. Objekti saa paljon enemmän huomiota, jos sen ympärillä on tyhjää tilaa. Katseelle ja liikkeelle suositellaan jättämään tilaa, jos tarkoituksena ei ole ahdas tai ahdistava vaikutelma. ✖ Lähde: ku1/02_kuvan_rakentamisen_keinot/02_sommittelu_te oria?C:D= &m:selres= ku1/02_kuvan_rakentamisen_keinot/02_sommittelu_te oria?C:D= &m:selres= ✖ kuvausvinkit sommittelu

vastavalo Kuva: Satu Drufva

Vastavalo, sumu Kuva: Satu Drufva

Aamuvalo, iltavalo Kuva: Satu Drufva

Iso aukko, pieni Syvyysterävyys Kuva: Satu Drufva

Henkilöstökuvia, teema Kuva: Nina Maaninka

Laajakulmalla nenä suurenee (lähin suurenee) Kuva: Satu Drufva

Luonnonvalo, ympäristö Kuva: Satu Drufva

Sosiaalinen media – viestintää ihmiseltä ihmiselle

Some-tehtävä: Kirjaudu ainakin kahteen (uuteen) some- palveluun (havainnointitehtävä markkinointiviestinnän näkökulmasta). Havainnoi, pohdi, tutki miten kanava toimisi parhaiten www-sivustosi viestinnän tukena.

Yritysten sosiaalisen median etiketti ✖ Tapa viestiä verkossa ✖ Sisältö edellä ei väline edellä Sisältömarkkinointi, etiketti ✖ Älä tuo liikaa yritystäsi esille mainostaen, vaan mieti miten voit auttaa asiakastasi! ✖ Julkaise sisältöä joka kiinnostaa asiakastasi, etsi asiakkaalle hyötyjä, Puro_esitys_ _Verkon-avulla-bisnesta.pdf

Somen käyttö Suomessa ✖ Elämme suosittelutaloudessa Lähes 80% ihmisistä luottaa eniten kaverin suositteluun tuotteiden ja palveluiden ostamisessa!! ✖ Tämän päivän kuluttaja etsii verkosta, googlaa tietoa päätöksenteon tueksi: jopa 80% kuluttajista tutustuu tuotteeseen ensin verkossa Puro_esitys_ _Verkon-avulla-bisnesta.pdf

Facebookissa on monta tapaa olla läsnä ✖ Henkilöprofiilit ✖ ✖ Asiantuntijaprofiilit ✖ Suljetut ja avoimet ryhmät (avoin) (suljettu) ✖ Yritysten ja organisaatioiden sivut ✖ ✖ Ohje- ja tukikeskus: Kohdennettu mainonta facebookissa:

Yritys somessa ✖ Facebook ✖ Instagram: Starbucks Instagramissa: ✖ Linkedin ✖ Pinterst ✖ Youtube

Credits Special thanks to all the people who made and released these awesome resources for free: ✖ Presentation template by SlidesCarnivalSlidesCarnival ✖ Photographs by UnsplashUnsplash

Kuvahausta ✖ Google Kuvahaku etsii kaikki kuvat, sillä oletuksena tekijänoikeuksille on Ei suodateta käyttöluvan perusteella. ✖ Voit kuitenkin rajata hakua käyttöoikeuksien mukaan. Valitse hakutyökalut → käyttöoikeudet TAI ratas TAI asetukset (riippuu näytöstä) ja sieltä "Tarkennettu haku". Alimpana löydät käyttöoikeudet. Oletuksena valittuna on ei suodateta käyttöluvan perusteella, mutta voit valita myös vapaasti käytettävissä...

SlidesCarnival icons are editable shapes. This means that you can: ●Resize them without losing quality. ●Change fill color and opacity. Isn’t that nice? :)

Kiitos