Animacija
Upcoming SlideShare
Loading in...5
×
 

Animacija

on

  • 135 views

 

Statistics

Views

Total Views
135
Views on SlideShare
135
Embed Views
0

Actions

Likes
3
Downloads
0
Comments
3

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

13 of 3 Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Odlična prezentacija! :)
    Are you sure you want to
    Your message goes here
    Processing…
  • evo jesam :P
    Are you sure you want to
    Your message goes here
    Processing…
  • stavi možda neku slikicu :D
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Animacija Animacija Presentation Transcript

    • ANIMACIJAANIMACIJA Autor: Maja ManojlovićAutor: Maja Manojlović Kolegij: Multimedijski sustaviKolegij: Multimedijski sustavi Ljetni semestar 2013/2014Ljetni semestar 2013/2014 Odjel za informatiku RijekaOdjel za informatiku Rijeka
    • Uvod u animaciju (1/2)Uvod u animaciju (1/2)  ANIMACIJA – brzo prikazivanje nizaANIMACIJA – brzo prikazivanje niza crteža objekta koji se razlikuju po nekimcrteža objekta koji se razlikuju po nekim detaljimadetaljima  crteži = kadrovicrteži = kadrovi
    • Uvod u animaciju (2/2)Uvod u animaciju (2/2)  grafici se dodaje vremenska dimenzijagrafici se dodaje vremenska dimenzija koja određuje kada će se i koji grafičkikoja određuje kada će se i koji grafički objekt (kadar) pojaviti i koliko dugo ćeobjekt (kadar) pojaviti i koliko dugo će trajati njegovo prikaz na ekranutrajati njegovo prikaz na ekranu
    • Animacija iAnimacija i multimedija (1/3)multimedija (1/3)  način korištenjanačin korištenja:: 1.1. prikazivanje čitavih multimedijskihprikazivanje čitavih multimedijskih projekata kao animacijeprojekata kao animacije  demonstracije ili prezentacijedemonstracije ili prezentacije  ne zahtijevaju interakciju s korisnikomne zahtijevaju interakciju s korisnikom
    • Animacija iAnimacija i multimedija (2/3)multimedija (2/3) 2. uključivanje manjih animacija u veće2. uključivanje manjih animacija u veće multimedijske ili hipermedijske projektemultimedijske ili hipermedijske projekte  cilj je privući pažnju korisnika ili pojasniticilj je privući pažnju korisnika ili pojasniti neki dinamički sadržajneki dinamički sadržaj
    • Animacija iAnimacija i multimedija (3/3)multimedija (3/3)  interaktivne animacije ili simulacijeinteraktivne animacije ili simulacije –– nakon što korisnik promijeni neki odnakon što korisnik promijeni neki od zadanih parametara, mijenja se rezultatzadanih parametara, mijenja se rezultat prikaza animacijeprikaza animacije
    • Računalna animacijaRačunalna animacija (1/5)(1/5)  koristi različite tehnike kojima jekoristi različite tehnike kojima je zajedničko to što je rezultat digitalnozajedničko to što je rezultat digitalno kreirana animacija pomoću računalakreirana animacija pomoću računala  animacija se dijeli na 2-D i 3-D animacijuanimacija se dijeli na 2-D i 3-D animaciju
    • Računalna animacijaRačunalna animacija (2/5)(2/5)  2-D animacija2-D animacija  najčešće se koristinajčešće se koristi  za uređivanje i kreiranje kadrova koriste seza uređivanje i kreiranje kadrova koriste se alati za izradu 2-D bitmapa ili vektorskealati za izradu 2-D bitmapa ili vektorske grafike (npr. Flash)grafike (npr. Flash)
    • Računalna animacijaRačunalna animacija (3/5)(3/5) Slika 1: 2-D animacija konjaSlika 1: 2-D animacija konja (http://en.wikipedia.org/wiki/Traditional_animation#mediaviewer/File:Animhorse.gif)(http://en.wikipedia.org/wiki/Traditional_animation#mediaviewer/File:Animhorse.gif)
    • Računalna animacijaRačunalna animacija (4/5)(4/5)  3-D animacija3-D animacija  visina + širina + dubinavisina + širina + dubina  crta se žičani model objekta, dodaje se tekstura, acrta se žičani model objekta, dodaje se tekstura, a zatim se objekti smještaju na neku pozadinuzatim se objekti smještaju na neku pozadinu  zahtjevnija (koriste se posebni programi, npr. CAD)zahtjevnija (koriste se posebni programi, npr. CAD)
    • Računalna animacijaRačunalna animacija (5/5)(5/5) Slika 2: 3-D animacija mačke (http://rebloggy.com/post/alice-in-wonderland-3d-gif-Slika 2: 3-D animacija mačke (http://rebloggy.com/post/alice-in-wonderland-3d-gif- cheshire-meu-primeiro-gif-assim-mta-emocao-miaedit/30737653776)cheshire-meu-primeiro-gif-assim-mta-emocao-miaedit/30737653776)
    • Principi animacije (1/2)Principi animacije (1/2)  moguća zbog tromosti oka (objekt ostajemoguća zbog tromosti oka (objekt ostaje zapamćen nekoliko trenutaka nakonzapamćen nekoliko trenutaka nakon gledanja)gledanja)  više kadrova = kvalitetnija animacija (imaviše kadrova = kvalitetnija animacija (ima manje preskakanja)manje preskakanja)  minimalni broj kadrova je 10 kadrova uminimalni broj kadrova je 10 kadrova u sekundisekundi
    • Principi animacije (2/2)Principi animacije (2/2)  kontrola animacijekontrola animacije:: 1.1. pomoću vremenske osi (pomoću vremenske osi (timelinetimeline))  definira se ukupno trajanje animacije i kadadefinira se ukupno trajanje animacije i kada se koji kadar pojavljujese koji kadar pojavljuje 2.2. postavljanjem broja kadrova animacijepostavljanjem broja kadrova animacije ((frame rateframe rate))
    • Tehnike animacijeTehnike animacije (1/4)(1/4)  tradicionalna animacijatradicionalna animacija  ručno crtanje kadrova na posebnom papiruručno crtanje kadrova na posebnom papiru  celuloidna animacijaceluloidna animacija – pozadina koja se ne– pozadina koja se ne mijenja crta se posebno, a svi elementi kojimijenja crta se posebno, a svi elementi koji se pomiču crtaju se na prozirnim folijamase pomiču crtaju se na prozirnim folijama
    • Tehnike animacijeTehnike animacije (2/4)(2/4) Slika 3: Celuloidna animacija (http://everlastanimation.blogspot.com/p/tugas-5-cel-Slika 3: Celuloidna animacija (http://everlastanimation.blogspot.com/p/tugas-5-cel- animation_7721.html)animation_7721.html)
    • Tehnike animacijeTehnike animacije (3/4)(3/4)  digitalna animacijadigitalna animacija  ručno nacrtane kadrove moguće jeručno nacrtane kadrove moguće je digitalizirati i doraditi pomoću softvera ili sedigitalizirati i doraditi pomoću softvera ili se svi kadrovi mogu crtati odmah u računalusvi kadrovi mogu crtati odmah u računalu  naslijedila principe animacije pomoću folijanaslijedila principe animacije pomoću folija
    • Tehnike animacijeTehnike animacije (4/4)(4/4)  animacija se sastoji od kadrova koji moguanimacija se sastoji od kadrova koji mogu biti ili bitmape (sprema se svaki kadar ibiti ili bitmape (sprema se svaki kadar i objedinjuje ih se u datoteku) ili vektorskaobjedinjuje ih se u datoteku) ili vektorska grafika (nije potrebno spremanje svakoggrafika (nije potrebno spremanje svakog kadra, već se mogu umetati dok sekadra, već se mogu umetati dok se animacija izvršava)animacija izvršava)
    • Interpolacija iliInterpolacija ili tweening (1/4)tweening (1/4)  proces crtanja međukadrova izmeđuproces crtanja međukadrova između ključnih kadrovaključnih kadrova  kod analogne animacije, samo se ukod analogne animacije, samo se u ključnim kadrovima crtao cijeli objekt, a uključnim kadrovima crtao cijeli objekt, a u međukadrovima samo oni dijelovi koji sumeđukadrovima samo oni dijelovi koji su se micalise micali
    • Interpolcija iliInterpolcija ili tweening (2/4)tweening (2/4)  kod današnjih računalnih animacija,kod današnjih računalnih animacija, tweening označava prijelaz iz prvog utweening označava prijelaz iz prvog u zadnji kadar crtanjem (uz pomoćzadnji kadar crtanjem (uz pomoć računala) odgovarajućeg brojaračunala) odgovarajućeg broja međukadrova po određenoj putanjimeđukadrova po određenoj putanji  interpolacijainterpolacija – računanje vrijednosti– računanje vrijednosti funkcije koja leži između poznatih točakafunkcije koja leži između poznatih točaka
    • Interpolacija iliInterpolacija ili tweening (3/4)tweening (3/4)  različita primjena kod kadrova koji surazličita primjena kod kadrova koji su bitmape i kod kadrova koji su vektorskabitmape i kod kadrova koji su vektorska grafikagrafika  vektorske objekte je lakše izvesti te im sevektorske objekte je lakše izvesti te im se interpolira položaj, veličina, rotacija,interpolira položaj, veličina, rotacija, oblik, boja i prozirnost, a sama veličinaoblik, boja i prozirnost, a sama veličina datoteke je manja nego što bi bila da jedatoteke je manja nego što bi bila da je riječ o bitmapamariječ o bitmapama
    • Interpolacija iliInterpolacija ili tweening (4/4)tweening (4/4)  za interpolaciju s bitmapama koriste seza interpolaciju s bitmapama koriste se slojevi koji su ekvivalentni nekadslojevi koji su ekvivalentni nekad korištenim prozirnim folijamakorištenim prozirnim folijama  moraju se čuvati svi kadrovi izmeđumoraju se čuvati svi kadrovi između ključnih kadrova zbog čega se datotekeključnih kadrova zbog čega se datoteke veće i mogu izgubiti na kvaliteti ukolikoveće i mogu izgubiti na kvaliteti ukoliko se primjenjuje komprimiranjese primjenjuje komprimiranje
    • Vrste animacije (1/7)Vrste animacije (1/7)  animacija s različitim kadrovimaanimacija s različitim kadrovima  animacija kadar po kadaranimacija kadar po kadar  prvi i zadnji kadar se znatno razlikujuprvi i zadnji kadar se znatno razlikuju  nije moguće koristiti računalni tweeningnije moguće koristiti računalni tweening nego se svaki od serije kadrova crtanego se svaki od serije kadrova crta
    • Vrste animacije (2/7)Vrste animacije (2/7) Slika 4: Animacija kadar po kadarSlika 4: Animacija kadar po kadar (http://filmskapocetnica.restarted.hr/interaktivnaanimacija/)(http://filmskapocetnica.restarted.hr/interaktivnaanimacija/)
    • Vrste animacije (3/7)Vrste animacije (3/7)  animacija po stazi (animacija po stazi (path-basedpath-based))  animacija pokreta (animacija pokreta (motion tweenmotion tween))  objekt se pomiče po određenoj putanji priobjekt se pomiče po određenoj putanji pri čemu se ne mijenja njegov oblik nego samočemu se ne mijenja njegov oblik nego samo položajpoložaj
    • Vrste animacije (4/7)Vrste animacije (4/7)  najjednostavniji oblik jenajjednostavniji oblik je linearni pomaklinearni pomak  kod linearnog pomaka objekt se pomiče pokod linearnog pomaka objekt se pomiče po pravcu za jednaku udaljenost izmeđupravcu za jednaku udaljenost između svakog kadrasvakog kadra udaljenost = ukupna udaljenost izmeđuudaljenost = ukupna udaljenost između početnog i završnog kadra/brojpočetnog i završnog kadra/broj svih kadrova u nizusvih kadrova u nizu
    • Vrste animacije (5/7)Vrste animacije (5/7) Slika 5: Animacija po stazi (http://mrisnadi.blogdetik.com/index.php/membuat-animasi-Slika 5: Animacija po stazi (http://mrisnadi.blogdetik.com/index.php/membuat-animasi- sederhana-dengan-motion-tween/)sederhana-dengan-motion-tween/)
    • Vrste animacije (6/7)Vrste animacije (6/7)  animacija preobražavanjem (animacija preobražavanjem (morphingmorphing))  animacija oblika (animacija oblika (shape tweenshape tween))  postepeno pretvaranje jedne slike u drugupostepeno pretvaranje jedne slike u drugu  računalni program generira međuslikeračunalni program generira međuslike
    • Vrste animacije (7/7)Vrste animacije (7/7) Slika 6: Animacija preobražavanjem (http://mam3014.wordpress.com/)Slika 6: Animacija preobražavanjem (http://mam3014.wordpress.com/)
    • Proces kreiranjaProces kreiranja animacijeanimacije 1.1. kreirati slike (kadrove)kreirati slike (kadrove) 2.2. dodati zvuk (nije obavezno)dodati zvuk (nije obavezno) 3.3. snimiti animaciju u odgovarajućemsnimiti animaciju u odgovarajućem formatuformatu 4.4. provjeriti kako se animacija izvodi uprovjeriti kako se animacija izvodi u nekom programu za reprodukcijunekom programu za reprodukciju 5.5. uključiti animaciju u prezentacijuuključiti animaciju u prezentaciju
    • Formati datoteka (1/2)Formati datoteka (1/2)  animirani gif (.GIF)animirani gif (.GIF) – posebna vrsta– posebna vrsta slikovnog GIF formataslikovnog GIF formata  Windows Audio Video Interleaved (.AVI)Windows Audio Video Interleaved (.AVI) – za animacije i video na Windows– za animacije i video na Windows platformiplatformi  QuickTime (.MOV)QuickTime (.MOV) – za animacje i video– za animacje i video na Apple platformi (prenosiv i na drugena Apple platformi (prenosiv i na druge platforme)platforme)
    • Formati datoteka (2/2)Formati datoteka (2/2)  Flash (.SWF)Flash (.SWF) – 2-D animacija za Web– 2-D animacija za Web  Shockwave (.DCR)Shockwave (.DCR) – director animacije– director animacije prilagođene za Webprilagođene za Web  Virtual Reality Modeling LanguageVirtual Reality Modeling Language (.WRL)(.WRL) – 3-D objekti za Web– 3-D objekti za Web
    • Primjena na Webu (1/5)Primjena na Webu (1/5)  animirani GIF-ovianimirani GIF-ovi  kreiraju se odvojene slike (po jedna za svakikreiraju se odvojene slike (po jedna za svaki kadar) i zatim se objedinjuju u jednu GIFkadar) i zatim se objedinjuju u jednu GIF datotekudatoteku  problem veličine datoteke (kadrovi suproblem veličine datoteke (kadrovi su bitmape) i ograničen broj boja (256)bitmape) i ograničen broj boja (256)
    • Primjena na Webu (2/5)Primjena na Webu (2/5)  za pregledavanje običnih GIF datoteka nijeza pregledavanje običnih GIF datoteka nije potreban nikakav poseban programpotreban nikakav poseban program  nije moguće dodavanje interaktivnosti ninije moguće dodavanje interaktivnosti ni zvuka (za to treba koristiti Flash)zvuka (za to treba koristiti Flash)
    • Primjena na Webu (3/5)Primjena na Webu (3/5)  Flash animacijaFlash animacija  koristi se za izradu interaktivnih animacija ikoristi se za izradu interaktivnih animacija i animacija sa zvukomanimacija sa zvukom  radna datoteka je FLA formata koju jeradna datoteka je FLA formata koju je potrebno objaviti u SWF format da bi sepotrebno objaviti u SWF format da bi se napravila animacija za webnapravila animacija za web
    • Primjena na Webu (4/5)Primjena na Webu (4/5)  mogu se kreirati animacije kadar po kadarmogu se kreirati animacije kadar po kadar ((motion tweenmotion tween) i proračunavanjem) i proračunavanjem međukadrova (međukadrova (shape tweenshape tween))  datoteke su manje (koristi se vektorskadatoteke su manje (koristi se vektorska grafika)grafika)
    • Primjena na Webu (5/5)Primjena na Webu (5/5)  ostali (rjeđe) korišteni načiniostali (rjeđe) korišteni načini  animirani PNG formatanimirani PNG format  programi u JavaScriptuprogrami u JavaScriptu  korištenje SVG vektorskog formata uz JavaScriptkorištenje SVG vektorskog formata uz JavaScript  Java appletiJava appleti