Opas internet animaatioihin

Opas internet animaatioihin

Animaatiot ovat yksi ihmiskunnan pitkäaikaisimmista unelmista, ainakin joidenkin historioitsijoiden mukaan. Teoria alkaa luolamaalauksilla, joissa yleisille eläimille on piirretty selvästi liian monta raajaa. Selityksiä asialle on muutamia, jotkut ovat sitä mieltä, että liikaraajat johtuivat taiteilijoiden rajoituksista poistaa virheitä, eli väärin piirretyt raajat jäivät sen takia luolien seinille ikiajoiksi. Toisten mielestä nämä olivat ensimmäisiä yrityksiä saada luotua liikkeen kuvaamista, mikä onkin yksi luonnonllisimmista tarpeista. Kaikki luonnossa liikkuu, ihmiset, eläimet, virrat, kasvit jotka avautuvat. Luonnossa ainoastaan muutos on varmaa ja vaikka se voi tapahtua joko kiduttavan hitaasti, tai salaman nopeasti, tapahtuu sitä kokoajan.

Animaatio on muutosta ja liikettä. Se on lähin tapa kuvata elämää taiteessa. Tämän takia voidaan usein kuulla lauseita kuten “animaatiot herättävät sivustomme henkiin” ja sama toistuu useissa muissa yhteyksissä. Vaikka lausetta on ehkä käytetty liian useasti, kuvaa se silti asian internet animaatioiden ydintä. Kun liikkeen kuvaaminen lisätään oikein, se pystyy kertomaan käyttäjälle, että tämä on toiminut oikein. Käyttäjät ovat olleen vuorovaikutuksessa sivuston tai ohjelman kanssa onnistuneesti ja saaneet jotain muuttumaan. Tämä laukeisee samanlaisen, tai samantyyppisen tunteen, kuin mitä koemme fyysisten kohteiden kanssa vuorovaikuttaessa. Kun animaatioita käyetään oikein, se luodaan matkimaan oikean elämän vuorovaikutusta ja tavallaan sulkee ympyrän.

Varhaiset GIFit

Netin animaatioiden historia

Animaatioilla on pitkä kehityshistoria aina alkuajoista, siihen pisteeseen missä ollaan nyt. Internet animaatiot saivat alkusta Gifeillä. Näitä nähtiin internetin varhaisina aikoina ensimmäistä kertaa vuonna 1987 ja sen jälkeen tanssivat vauvat, sekä muut painajaisia aiheuttavat hahmot, valtasivat netin. Gif animaatioiden suosio osoitti animaatoiden hyödyllisyyden nettisivuilla, vaikka tässä vaiheessa kovinkaan monen mielessä ei käynyt nettisivun käyttäjäystävällisyyden parantaminen. Ideana oli tuoda tyylikkyyttä ja elämää, muutan asteettiselle nettisivulle.

Kun Gif animaatioiden ensihuumasta oli päästy yli, eikä uusia käyttöominaisuuksia enää ollut, haluttiin uusia ja parempia tapoja lisätä animaatioita sivustoille, sekä ääntä. Äänen tullessa mahdolliseksi voitiin soittaa nettisivun avautuessa heti tunnusmusiikki, tai vaikka oma lempikappale. Flash oli se mikä mahdollisti uudet asiat, sekä oppimisen kantapään kautta. Aikanaan ohjelmisto oli hyvin vakuuttava, se oli sekä innovatiivinen että edistyksellinen. Vaikka myöhemmin siitä tulikin lähinnä vitsi, se antoi aikanaan mahdollisuuden sellaiseen internettiin, johon ei muuten päästy käsiksi. Sen avulla luovuus pääsi kukkimaan, uusi ala syntyi ja esimerkiksi netti sarjakuvat alkoivat yleistymään. Eikä pidä unohtaa sen ajan suosituimpia viihdemuotoja, Flash pelejä.

Java-päivitys

Kehittyminen jatkuu

Kehityksen myötä yhä useammat suunnittelijat siirtyivät JavaScriptin pohjalle tehtyihin animaatioihin, varsinkin pienempien asioiden kanssa. Näihin kuului alasvedettävät valikot ja muut navigaatioon liittyvät tekijät. Tämä oli helpompi ohjelmoida hakukone ystävälliseksi, kunhan se tehtiin oikein. Viimeisen vuosikymmenen keskivaiheilla W3C työskenteli sisällyttääkseen animaatioita CSS muodossa ja vuonna 2009 julkaistiin ensimmäinen vedos CSS animaatiosta. Nykyään haasteina onkin CSS animaatioiden yhdistäminen SVG tiedostoihin ja JavaScrip kirjastojen perusanimaatoiden ominaisuuksien lisääminen, sekä lukuisat muut uudet haasteet. Keskittymisen kohteena on tyylin lisääminen nettisivuille, käyttäjäystävällisyyden lisääminen, tiedon ja opetuksen antaminen käyttäjille, aina helppokäyttöisyys mielessä pitäen. Animaatiot eivät ole enää suunnittelijoiden yksityiskäytössä, vaan elokuvissa siitä tuli koko maailman tuntema tapa kertoa tarinoita ja netissä se on kaikkien toimivien sivustojen pohja.

Koskaan aikaisemmin ei ole ollut parempaa hetkeä keskittyä animaatioiden suhteeseen nettiin liittyvisttä alustoissa ja applikaatioissa. Teknologia ei ole vielä täysin kehittynyt, eikä sen kehitys tule todennäköisesti koskaan lakkaamaan. Tämä antaa mahdollisuudet keksiä uusia lähestymistapoja, jotka muuttavat sivustojen käytöstä vieläkin helpompaa ja tehokkaampaa. Mitä avoimemmalle pohjalle animaatiot luodaan, sitä useammat ihmiset pääsevät nauttimaan niistä ja tämä on tietenkin erittäin hyvä asia. Jos siis ura animaatioiden keskuudessa kiinnostaa, tai niiden käyttö omilla nettisivuilla on ajankohtaista, kannattaa asiaan tutustua enemmänkin välittömästi.

Tietenkin tulee muostaa myös, että animaatioita on hyvin useita erilaisia. Niiden tarkoituksena on sivustojen käyttäjäystävällisyyden parantaminen ja käyttökokemuksen nostaminen uusille tasoille, mutta se miten tämä toteutetaan, on kiinni monista valinnoista. Pelkästään animaatioiden lisääminen nettisivulle ja sen elementteihin ei riitä sivuston tason nostamiseen. Kuten kaikessa suunnittelussa, on tarkoin harkittava mitä ratkaisuita tehdään, sen mukaan minkälainen sivusto on kyseessä ja mitä animaatioilla halutaan saada aikaan. Animaatiot eivät voi myöskään hidastaa sivuston käyttämistä, eli jos ne ovat vaativia toimintoja, jotka haittaavat vaikka mobiili käytettävyyttä, tai jopa tietokoneella toimivaa sivustoa, pitää miettiä ratkaisut uudestaan. Lyhyesti listattuna animaatioita on olemassa seuraavanlaisia:

Elementti animaatiot

Nämä animaatiot ovat todennäöisesti kaikista yleisimpiä, eikä turhasta syystä, sillä ne ovat hyödyllisimpiä animaatioita. Näiden tehtävänä on kertoa käyttäjälle tai vierailijalle, että jokun toiminto on onnistunut, esimerkiksi klikkauksen jälkeen. Onnistumisen huomaaminen ei ole ainoastaan mukavaa, vaan välttämätöntä, sillä muuten asiakas ei tiedä käyttäneensä sivustoa oikein.

Odottava animaatio

Odottavat animaatiot

Näidenkin tehtävänä on kertoa käyttäjälle jostain informaatiosta. Useimmiten näitä animaatioita nähdään kun sivuston taustalla tapahtuu jotain, mikä vie aikaa ja tämä halutaan kertoa käyttäjälle, jottei sivustolta poistuta liian nopeasti.

Tarinan kertovat animaatiot

Näillä ei tarkoiteta sarjakuvia tai liikkuvia piirroksia, vaan esimerkiksi sivuston vuorovaikutusta vierailijan kanssa. Vuorovaikutusta voi tapahtua esimerkiksi kun selataan tiettyä sivua ylhäältä alas, tai kun sivutolla liikutaan muuten.

Tarinan kertova animaatio
Koristeelliset animaatiot

Tietenkin osa animaatioista on käytössä pelkästään koristeellisista syistä ja vaikka nämä voivatkin olla häiritseviä, on niilläkin omat käyttökohteensa.

Nämä ovat yleisimpiä animaatioiden muotoja, mitä netissä käytetään. Jokaisella on oma tehtävänsä, eikä animaatioita tulisi lisätä sivustoille vain lisäämisen innosta, vaan jokainen animaatio tulee olla tarkkaan harkittu. Jollain sivustoilla kaikkia animaatioiden tyyppejä ei välttämättä ole ollenkaan näkyvillä, mikä usein kertoo hyvin suunnitellusta sivustosta.

Vastaa

Sähköpostiosoitettasi ei julkaista. Pakolliset kentät on merkitty *