Arkiston helmiä aiheesta:

Adobe

Photoshop-animointi: Ruutuanimaatio

Photoshop on tunnetumpi kuvankäsittelyn ominaisuuksistaan kuin animaatio-ohjelmana, mutta ohjelmassa on myös animaation tekoon tarkoitettu Aikajana-paneeli (Timeline panel). Paneelissa on mahdollista tehdä ruutu (frame) kerrallaan piirrettäviä ruutuanimaatioita tai keyframeihin perustuvia aikajana-animaatioita. Tämän ohjeen tavoiteena on antaa yksi käytännön esimerkki GIF-animaation tekemisestä Photoshopilla. Ruutuanimaation tekeminen Tässä esimerkissä käytämme osoitteesta https://freesvg.org/walking-man-figure löytyvää spritesheetia, jota sai kirjoitushetkellä käyttää ilmaiseksi. … Lue lisää

Kategoriat Photoshop Avainsanat , ,

Adobe Animate -animaation tekeminen

Tässä artikkelissa kerrotaan, miten animaatioita voi tehdä Adobe Animatella, mutta monet periaatteet soveltuvat myös muihin animaation tekemisen ohjelmiin.

Adobe Animate on animaatio-ohjelma, jolla voi tehdä esimerkiksi HTML5-bannereita tai mainosanimaatioita videotauluihin. Usein printti- tai verkkomedian puolelta tulevien tekijöiden on ollut helppoa omaksua animaation perusteita Adobe Animaten kautta. Erilaisia animaatio-ohjelmia on ladattavissa runsaasti. Animate on järkevä valinta, jos käyttäjällä on kokemusta Adoben ohjelmista ja etenkin jos Photoshop tai Illustrator on hallussa.

Kategoriat Animate Avainsanat , ,

Classic Tween -animaation tekeminen

Classic tween on Adobe Animaten tweeneistä useimmille helpoin omaksua. Sitä voi käyttää animaatioissa, joissa on suoraviivaisia ja -kulmaisia liikkeitä. Yläpuolella olevaa simppeliä lentokone-animaatiota varten on ensin tehty uusi HTML5-animaatio, jonka stagen koko on 400px 400 px. Tämän jälkeen stagelle on tuotu taustan pilvet ja etualalla liikkuva potkurikone omille layereilleen. Sen jälkeen animaation voi tehdä seuraavissa vaiheissa:  Lisää 20 framea Timelinelle klikkamalla … Lue lisää

Kategoriat Animate Avainsanat , ,

Motion Tween -animaation tekeminen

Adobe Animaten Motion Tween -animaatio soveltuu parhaiten kaareviin liikeratoihin, joissa animoidaan erikseen useita ominaisuuksia. Se on Adobe Animaten tweeneistä monipuolisin, mutta myös vaikein oppia. Yllä näkyvän yksinkertaisen raketin liikkeen voi toteuttaa Motion Tween-animaationa alla kuvatulla tavalla. Sitä varten on ensin luotu uusi HTML5-animaatio, jonka stagen leveys ja korkeus on 500 px. Tämän jälkeen stagelle on tuotu … Lue lisää

Kategoriat Animate Avainsanat , ,

Shape Tween -animaation tekeminen

Shape tween soveltuu animaatioihin, joissa vektorigrafiikan muoto muutetaan joksikin toiseksi. Tästä on käytetty myös morph-animaatio-nimitystä. Muista Adobe Animaten tweeneistä poiketen shape tweeniä käytettäessä animoitavaa grafiikkaa ei tule konvertoida symboliksi, vaan se täytyy muuntaa vektorimuotoon. Alla on yksinkertainen esimerkki, jossa tanssijan hahmo muuttuu R-kirjaimeksi. Animaatiota varten on ensin tehty uusi Animate-tiedosto, jonka stagen koko on 400px … Lue lisää

Kategoriat Animate Avainsanat , ,

Kuvankäsittelyn työvaiheet

Kuvankäsittelyohjelmia on saatavilla pilvin pimein sekä ilmaiseksi että maksusta. Usein kuitenkin käytön alkuun pääseminen on hankalaa, koska ohjelmien tarjoamat mahdollisuudet ovat rajattomia. Kuvankäsittelyn perusteet voi opetella tässä kirjoituksessa esitetyn työnkulun mukaisesti ja poiketa siitä tarvittaessa sitten, kun taidot ovat hieman kehittyneet. Artikkelissa käytän esimerkkinä Adobe Photoshopia. En kuitenkaan otsikoinut artikkelia ”Photoshop-ohjeet aloittelijoille”, koska artikkelin toiminnot … Lue lisää

Kategoriat Photoshop Avainsanat ,