[Script Info] Title: [Events] Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text Dialogue: 0,0:00:01.11,0:00:03.19,Default,,0000,0000,0000,,Postoji nekoliko nacina da se nesto animira, Dialogue: 0,0:00:03.19,0:00:05.24,Default,,0000,0000,0000,,ali osnovni princip je uvek isti: Dialogue: 0,0:00:05.24,0:00:07.13,Default,,0000,0000,0000,,ako uzmes nekoliko crteza Dialogue: 0,0:00:07.13,0:00:09.73,Default,,0000,0000,0000,,gde je svaki malo drugaciji od prethodnog Dialogue: 0,0:00:09.73,0:00:11.46,Default,,0000,0000,0000,,i prelistas ih jako brzo Dialogue: 0,0:00:11.46,0:00:13.27,Default,,0000,0000,0000,,izgledace kao da se slika pomera. Dialogue: 0,0:00:13.27,0:00:16.17,Default,,0000,0000,0000,,U stara dobra vremena, svi crtezi su crtani rukom. Dialogue: 0,0:00:16.17,0:00:19.70,Default,,0000,0000,0000,,I trebalo je jako dugo da se napravi animacija od 3 sekunde. Dialogue: 0,0:00:19.70,0:00:22.88,Default,,0000,0000,0000,,Na nasu srecu, mi zivimo u buducnosti. Dialogue: 0,0:00:22.88,0:00:26.13,Default,,0000,0000,0000,,U sustini je vrlo lako da se kodiranjem napravi jednostavna animacija. Dialogue: 0,0:00:26.13,0:00:27.100,Default,,0000,0000,0000,,Pokazacu vam kako! Dialogue: 0,0:00:27.100,0:00:31.47,Default,,0000,0000,0000,,Na levoj strani, mozete videti slatki mali auto na lepoj zutoj pozadini. Dialogue: 0,0:00:31.47,0:00:34.96,Default,,0000,0000,0000,,Tacno, ja sam dizajnirala taj auto, hvala. Dialogue: 0,0:00:34.96,0:00:38.58,Default,,0000,0000,0000,,U svakom slucaju, ovde mi odredjujemo boju pozadine. Dialogue: 0,0:00:38.58,0:00:42.53,Default,,0000,0000,0000,,I auto nema obod, tako da pisemo noStroke() funkciju. Dialogue: 0,0:00:42.53,0:00:47.47,Default,,0000,0000,0000,,I onda ovde pravimo novu varijablu "x", pozicija auta, i dajemo joj vrednost 10. Dialogue: 0,0:00:47.47,0:00:49.46,Default,,0000,0000,0000,,Mozete videti da ako promenimo ovu vrednost, Dialogue: 0,0:00:49.46,0:00:52.10,Default,,0000,0000,0000,,to pomera auto napred nazad. Dialogue: 0,0:00:52.10,0:00:53.53,Default,,0000,0000,0000,,Stavimo 10. Dialogue: 0,0:00:53.53,0:00:57.59,Default,,0000,0000,0000,,Ovde odredjujemo boju auta, i crtamo pravougaonike koji predstavljaju auto. Dialogue: 0,0:00:57.59,0:01:00.06,Default,,0000,0000,0000,,Izgleda da je prvi pravougaonik za donji deo auta Dialogue: 0,0:01:00.06,0:01:02.48,Default,,0000,0000,0000,,a ovaj za gornji. Dialogue: 0,0:01:02.48,0:01:05.03,Default,,0000,0000,0000,,I onda ovde radimo istu stvar za tockove Dialogue: 0,0:01:05.03,0:01:06.98,Default,,0000,0000,0000,,Odredimo boju i nacrtamo dva kruga: Dialogue: 0,0:01:06.98,0:01:08.65,Default,,0000,0000,0000,,jedan na x + 25 Dialogue: 0,0:01:08.65,0:01:10.19,Default,,0000,0000,0000,,i x + 75 Dialogue: 0,0:01:10.19,0:01:12.83,Default,,0000,0000,0000,,Konacno smo dosli do novih stvari. Dialogue: 0,0:01:12.83,0:01:15.17,Default,,0000,0000,0000,,Ovo se zove definicija funckije. Dialogue: 0,0:01:15.17,0:01:16.69,Default,,0000,0000,0000,,Naucicete o tome kasnije. Dialogue: 0,0:01:16.69,0:01:19.57,Default,,0000,0000,0000,,Za sada, samo pogledajte i zapamtite kako izgleda. Dialogue: 0,0:01:19.57,0:01:24.29,Default,,0000,0000,0000,,Vazne stvari da primetite su rec "draw" i ove zagrade. Dialogue: 0,0:01:24.29,0:01:25.19,Default,,0000,0000,0000,,Ova otvorena zagrada Dialogue: 0,0:01:25.19,0:01:26.75,Default,,0000,0000,0000,,I ova zatvorena zagrada ovde. Dialogue: 0,0:01:26.75,0:01:30.53,Default,,0000,0000,0000,,Za ovo kazemo da se crtez vrti u krug, ili animacija se vrti u krug. Dialogue: 0,0:01:30.53,0:01:35.30,Default,,0000,0000,0000,,I sve sto stavite izmedju ovih zagrada se neprekidno vrti u krug vrlo, vrlo brzo. Dialogue: 0,0:01:35.30,0:01:36.70,Default,,0000,0000,0000,,Zato se zove loop - sto znaci da se bez prestanka vrti u krug. Dialogue: 0,0:01:36.70,0:01:41.79,Default,,0000,0000,0000,,A sve sto je van ovih zagrada se izvrsi samo jednom na pocetku programa. Dialogue: 0,0:01:41.79,0:01:45.53,Default,,0000,0000,0000,,Prvi korak u animaciji je da pomerite sve kodove crteza unutar zagrada. Dialogue: 0,0:01:45.53,0:01:47.83,Default,,0000,0000,0000,,Tako da ce crtez da bude nacrtan uzastopno nekoliko puta. Dialogue: 0,0:01:47.83,0:01:51.66,Default,,0000,0000,0000,,Hajmo uraditi to. Ja cu da povucem ceo ovaj kod crteza. Dialogue: 0,0:01:51.66,0:01:54.26,Default,,0000,0000,0000,,I ubacim ga ovde, izmedju zagrada Dialogue: 0,0:01:54.26,0:02:02.47,Default,,0000,0000,0000,,I da podsetim sebe da ceo ovaj kod ide unutar zagrada, malo cu da ga uvucem tako sto cu celog da ga selektujem i pritisnem tab. Dialogue: 0,0:02:02.47,0:02:05.75,Default,,0000,0000,0000,,I sada znam da je ovaj kod unutar zagrada. Dialogue: 0,0:02:05.75,0:02:10.21,Default,,0000,0000,0000,,Kao sto mozete videti sve izgleda isto, nista se nije promenilo. Dialogue: 0,0:02:10.21,0:02:17.79,Default,,0000,0000,0000,,Kada prvi put pokrenemo draw lookp, kompjuter ce da kaze "dobro, napravi novu promenljivu x, stavi vrednost 10, nacrtaj dva pravougaonika, nacrtaj dva kruga." Dialogue: 0,0:02:17.79,0:02:24.29,Default,,0000,0000,0000,,I onda ce da ide gore na pocetak i kaze, "napravi novu promenljivu x, stavi vrednost 10, narctaj dva pravougaonika, i dva kruga." Dialogue: 0,0:02:24.29,0:02:28.21,Default,,0000,0000,0000,,I onda, "napravi novu promenljivu x, stavi vrednost 10, nacrtaj…" Identicna stvar Dialogue: 0,0:02:28.21,0:02:31.15,Default,,0000,0000,0000,,Nista se nije promenilo, necete videti nikakvu animaciju. Dialogue: 0,0:02:31.15,0:02:34.66,Default,,0000,0000,0000,,Samo crta identicne pravougaonike i krugove jedan preko drugog. Dialogue: 0,0:02:34.66,0:02:40.40,Default,,0000,0000,0000,,Secate li se sta smo rekli: ako zelimo da nesto izgleda animirano, vi morate pomalo menjati crtez. Dialogue: 0,0:02:40.40,0:02:42.76,Default,,0000,0000,0000,,Tako da ako zelite da se kola pomeraju unapred Dialogue: 0,0:02:42.76,0:02:45.36,Default,,0000,0000,0000,,trebala bi da promenim vrednost od x promenljive, zar ne? Dialogue: 0,0:02:45.36,0:02:48.05,Default,,0000,0000,0000,,Da, hajmo da napravimo…11 Dialogue: 0,0:02:48.05,0:02:51.12,Default,,0000,0000,0000,,Oh! Ne! Sada ce biti 11 svaki put. Dialogue: 0,0:02:51.12,0:02:57.56,Default,,0000,0000,0000,,Kako mogu da napravim da se vrednost od x menja kada kompjuter vrti samo isti kod? Dialogue: 0,0:02:57.56,0:02:59.71,Default,,0000,0000,0000,,Dobro, gledaj ovaj magicni trik: Dialogue: 0,0:02:59.71,0:03:02.79,Default,,0000,0000,0000,,Secas se, ova "var x" napravi novu promenljivu. Dialogue: 0,0:03:02.79,0:03:08.06,Default,,0000,0000,0000,,Kada to imamo unutar ovog kruga, svaki put pravi novu promenljivu "x". Dialogue: 0,0:03:08.06,0:03:13.47,Default,,0000,0000,0000,,Sta treba uraditi je staviti ovu promeljivu van ovog kruga. Tako ce je napraviti samo jednom. Dialogue: 0,0:03:13.47,0:03:22.77,Default,,0000,0000,0000,,I onda, kada kompjuter izvrsava ovaj kod i vidi promenljivu x, upotrebice istu promenljivu koristeci poslednju vrednost koju smo joj odredili. Dialogue: 0,0:03:22.77,0:03:31.30,Default,,0000,0000,0000,,I ja cu to uraditi, uzecu ovu promenljivu, i stavicemo izvan ovog ciklusa, i sada ce praviti tu promenljivu samo jednom, Dialogue: 0,0:03:31.30,0:03:38.29,Default,,0000,0000,0000,,I svaki put kad naidje na tu promenljivu x koristice istu. Trenutno poslednja vrednost sto smo joj odredili je "11". Dialogue: 0,0:03:38.29,0:03:41.76,Default,,0000,0000,0000,,Tako da ce uvek biti 11. I sada magija nastupa. Dialogue: 0,0:03:41.76,0:03:52.98,Default,,0000,0000,0000,,Negde u ovom ciklusu cemo promeniti vrednost od x da bude malo vise nego sto je bilo pre, ovako: x ce da bude stara vrednost od x plus, recimo, 1. Dialogue: 0,0:03:52.98,0:03:54.93,Default,,0000,0000,0000,,Radi! Dialogue: 0,0:03:54.93,0:04:02.82,Default,,0000,0000,0000,,Osim sto je zamazan. Ako se pitate zasto izgleda ovako, razlog je sto smo zaboravili da nacrtamo pozadinu unutar ovog ciklusa. Dialogue: 0,0:04:02.82,0:04:07.15,Default,,0000,0000,0000,,Crta haute ali mozete videti da su stari auti ispod novih. Dialogue: 0,0:04:07.15,0:04:12.19,Default,,0000,0000,0000,,Ako premestim ovu liniju na vrh ovog ciklusa, evo ovako, Dialogue: 0,0:04:12.19,0:04:15.98,Default,,0000,0000,0000,,I pritisnem "restart" da mogu opet da vidim moj auto… Dialogue: 0,0:04:15.98,0:04:18.27,Default,,0000,0000,0000,,Perfektno! Dialogue: 0,0:04:18.27,0:04:22.39,Default,,0000,0000,0000,,Ako hocemo da auto ide brze, samo promenimo za koliko cemo povecati vrednost od x svaki put. Dialogue: 0,0:04:22.39,0:04:28.86,Default,,0000,0000,0000,,Ako stavimo 10, wow! Nestade sa ekrana! Mogu da napravim cak i negativno, "x - 10" i… Dialogue: 0,0:04:28.86,0:04:34.55,Default,,0000,0000,0000,,Evo dolazi! Stavim pozitivno opet, ups…evo. Dialogue: 0,0:04:34.55,0:04:36.55,Default,,0000,0000,0000,,Sta je vazno da se zapamti: Dialogue: 0,0:04:36.55,0:04:43.51,Default,,0000,0000,0000,,Ova stvar ovde se zove "draw loop". Treba da unutar toga stavite kod crteza kako bi se uzastopno crtao. Dialogue: 0,0:04:43.51,0:04:52.02,Default,,0000,0000,0000,,I onda, stavite promenljive van vaseg "draw loop" (ciklusa). Vazno je staviti to van "draw loop"da bi mogli da koristimo iste svaki put. Dialogue: 0,0:04:52.02,0:04:55.85,Default,,0000,0000,0000,,I onda unutar "draw loop", tacno ovde, promenicemo promenljive za malo. Dialogue: 0,0:04:55.85,0:05:02.32,Default,,0000,0000,0000,,obicno koristeci njihovu staru vrednost, plus neki broj, pozitivan ili negativan broj. Dialogue: 0,0:05:02.32,0:05:07.93,Default,,0000,0000,0000,,I na kraju, koristite vasu promenljivu negde u kodu crteza, tako da crtez svaki put izgleda drugacije. Dialogue: 0,0:05:07.93,9:59:59.99,Default,,0000,0000,0000,,I to je sve!