ABCya animacije

 

clip_image002

ABCya.com je mrežna stranica koja omogućuje brzu i jednostavnu izradu animacija uz upotrebu do maksimalno 40 okvira. Vrlo jednostavno sučelje sa svega nekoliko alata za crtanje koje učenici čak i prvog razreda osnovne škole lako i brzo savladaju. Zbog sveg navedenog ovo je idealno mjesto koje možete iskoristiti za uvođenje pojma animacije čak i u niže razrede osnovne škole.

Upoznajmo stoga najprije samu stranicu. Centralni dio stranice zauzima prostor za crtanje iznad kojeg se nalaze kartice sa brojevima okvira (frames) pomoću kojih učenici stvaraju svoje animacije. Desno od okvira nalazi se kartica Background na kojoj možete izraditi pozadinu za vašu animaciju. Primjerice može to biti neka jednostavna slika ili pak pozadina neke boje koje će učenici nacrtati.clip_image004[1]

Ispod okvira za crtanja nalaze se alati za crtanje. U odjeljku Pick a color klikom miša na boju mijenjate boju kojom crtate. U okviru Pick brush size na raspolaganju su vam četiri veličine kista. Nadalje tu je i gumb Undo pomoću kojeg ćete poništiti prethodno izvršene promjene na vašem crtežu. Posebno je zgodna činjenica da naredba Undu nije ograničena na posljednje tri radnje kao primjerice u Bojanju.

Gumb Clear frame obrisat će sve što ste nacrtali na odabranom okviru, dok vam gumb Start new pruža mogućnost krenuti od početka.

Posebno zgodna mogućnost je kopiranje okvira Copy frame. Na ovaj način učenici mogu kopirati prethodni okvir te na njemu napraviti željene promjene kako bi osmislili razne pokrete likova u svojoj animaciji.

Učenicima su na raspolaganju dva različita načina rada. Prvi je Drawing mode u kojem učenici crtaju mišem uz upotrebu kista i boja. Drugi način koji se otvara nakon što kliknete na Drawing mode, je Select mode pomoću kojeg možemo odabrati neki od nacrtanih objekata te ih povlačenjem miša pomaknuti na drugu poziciju što je vrlo zgodna mogućnost često potrebna u izradi animacija.

clip_image006[1]

Nakon što učenici izrade barem dva okvira klikom na Play moći će vidjeti kako izgleda njihova animacija, dok na gumb Stop (koji se izmjenjuje sa Play) zaustavljaju izvođenje animacije. Za izvođenje animacije u petlji, označite potvrdni okvir Loop. Na ovaj način animacija od svega nekoliko okvira se može izvoditi neprekidno, odnosno dok se izvođenje ne zaustavi na gumb Stop.

Za učenike mlađeg uzrasta velika pomoć pri izradi animacija je prikaz prethodnog okvira, u pozadini okvira na kojem se trenutno radi. Kako biste dobili prikaz prethodnog okvira na trenutnom potvrdno označite kvadratić uz Show previous frame.

image

I na kraju svakako spremite svoju animaciju klikom na Save animation. Nakon kraćeg postupka spremanja otvorit će se dijaloški okvir Spremi kao u kojem odabirete mjesto na svom računalu gdje želite spremiti svoju animaciju, po želji promijenite ime (zadano ime za spremanje je MyDrawing.gif) i kliknete na gumb Spremi. Vaša animacija će biti spremljena u .gif formatu, takozvana gif animacija, te je možete pregledati u web pregledniku ili pak ugraditi na školsku web-stranicu.

Izrada animacije

Pogledajmo sada kako izraditi jednostavnu animaciju, primjerice skakanje lopte. Ovo je inače vrlo jednostavan primjer koji sam pokazala svojoj kćeri, učenici 3. razreda koja još ne polazi nastavu informatike jer u njenoj školi nije organizirana za niže razrede L, a koji je ona kasnije upotrijebila u izradi svoje animacije. Naravno njena animacija izgleda daleko bolje od moje, pa ipak djeca su puna ideja🙂.

Krenimo stoga redom. Otvorite mrežnu stranicu www.abcya.com/animate.htm te kliknite na okvir Create na animation.

1. Korak – Nacrtajmo pozadinu animacije

imageKliknite na karticu Background i nacrtajte crtež koji želite da bude pozadina na vašoj animaciji. Ja sam upotrijebila samo zelenu kojom sam pobojala cijeli prostor za crtanje🙂. Kako biste pobojali pozadinu kliknite mišem na željenu boju, odaberite veličinu kista te držeći pritisnutu lijevu tipku miša krenite bojati.

2. Korak – Prvi okvir

imageKliknite na karticu sa brojem 1 kako biste krenuli s crtanjem prvog okvira vaše animacije. Primijetit ćete da je boja pozadine nešto svjetlija nego na kartici pozadine.
Sada nacrtajte jedan krug koji će predstavljati našu lopticu skočicu. Prilikom crtanja pokušajte ne prekinuti crtanje jer će u protivnom kod odabira biti odabran samo jedan dio loptice.

Kliknite na Copy frame, kako biste kopirali upravo nacrtani okvir.

3. Korak – Drugi okvir

Kliknite na karticu s brojem 2 te odaberite naredbu Paste frame. Sada će na drugom okviru biti vidljiva vaša loptica sa prvog okvira. Kliknite na ikonu olovke Drawing mode, kako biste se prebacili u način za odabir, te kliknite na nacrtanu lopticu. Oko loptice pojavit će se okvir, kliknite mišem na označeni dio te povlačenjem premjestite označeni dio. Označite li Show previous frame nakon što pomaknete lopticu vidjet ćete i položaj loptice na prethodnom okviru.

Napomenut ćemo da odabrani dio možete i zakretati. Postavite miša pored okvira za odabir kako bi vam se pojavila zakrivljena strelica. Držeći pritisnutu lijevu tipku miša zakrečite lik po želji.

Ovaj postupak ponavljajte, te pomičite lopticu svaki puta na novu poziciju. Nakon što izraditi određeni broj okvira klikom na Play isprobajte kako izgleda vaša animacija.

image image

4. Korak – Spremanje animacije

Kada ste izradili animaciju spremite je klikom na Save animation. Kliknite na OK, odaberite mapu na vašem računalu u koju želite spremiti vašu animaciju, upišite ime za vašu animaciju te kliknite na Spremi.

I na kraju to izgleda ovako: 

 

O autoru Gordana Sokol

Diplomirani informatičar koji posljednjih šesnaest godina predaje informatiku u OŠ Tužno. Autorica sam niza udžbenika i zbirki iz informatike za osnovne i srednje škole. Autorica sam online tečaja "Logo – online učenje programiranja". Završila sam E-learning akademiju, smjer Tutoring.
Ovaj unos je objavljen u Web 2.0. Bookmarkirajte stalnu vezu.

Odgovori

Popunite niže tražene podatke ili kliknite na neku od ikona za prijavu:

WordPress.com Logo

Ovaj komentar pišete koristeći vaš WordPress.com račun. Odjava / Izmijeni )

Twitter picture

Ovaj komentar pišete koristeći vaš Twitter račun. Odjava / Izmijeni )

Facebook slika

Ovaj komentar pišete koristeći vaš Facebook račun. Odjava / Izmijeni )

Google+ photo

Ovaj komentar pišete koristeći vaš Google+ račun. Odjava / Izmijeni )

Spajanje na %s