Aké typy animácie je možné použiť. Postup vývoja elektronických vzdelávacích zdrojov

Ministerstvo školstva a vedy Ruskej federácie

Štátna vzdelávacia inštitúcia

Vyššie odborné vzdelanie

Štátny ústav Taganrog južnej federálnej univerzity

Katedra počítačom podporovaných návrhových systémov

VYSVETLIVKA

na seminárnu prácu

Disciplína: Pokročilé informačné technológie a prostredia.

EOR na tému: „ Nástroje na podporu animácie 2 D a 3 D ».

Dokončené:

Učiteľ:

Taganrog

Zadanie kurzu:

Vytvorenie elektronického vzdelávacieho zdroja na tému: „Nástroje na podporu animácie“, kde je potrebné na niekoľkých príkladoch preukázať princíp tvorby animácie. A tiež urobte stručný prehľad niektorých technológií na vytváranie a podporu animácie 2 D a 3 D.


Úvod

Dôležitosť témy „Animácia“ je dnes nepochybná. Pred takmer storočím sa objavili prvé karikatúry, ktoré potešili všetkých. S príchodom moderných technológií sa animácia stáva jedným z hlavných prvkov multimediálnych projektov a prezentácií a čoraz viac sa vyskytuje na internetových stránkach. Animácia sa tiež veľmi často používa v televízii. Napríklad veľa vysielateľov používa šetriče obrazovky CGI. Produkcia videa tiež nie je úplná bez počítača a čoraz profesionálnejšie video využíva techniky počítačovej animácie.

Tento príspevok pojednáva o technológiách a princípoch tvorby animácie.


Animácia

Celosvetová odborná definícia „animácia“ (v preklade z latinčiny „anima“ - duša, „animácia“ - oživenie, animácia) čo najpresnejšie odráža všetky moderné technické a umelecké možnosti animovaného filmu, pretože majstri animácie nielen oživujú svoje postavy, ale vkladajú aj kúsok ich dušu do ich stvorenia ...

Animačné technológie.

V súčasnosti existujú rôzne technológie na vytváranie animácií:

Klasické (tradičné) animácia je postupná zmena obrázkov, z ktorých každý je nakreslený osobitne. Toto je časovo veľmi náročný proces, pretože animátori musia vytvárať každý snímok osobitne.

Zarážka (bábka) animácia. Objekty umiestnené v priestore sú fixované rámom, potom sa ich poloha zmení a znova zafixuje.

Sprite animácia sa realizuje pomocou programovacieho jazyka.

Morfovanie - transformácia jedného objektu na druhý generovaním určeného počtu medzisnímok.

Farebná animácia - mení iba farbu, nie polohu objektu.

3D animácia vytvorené pomocou špeciálnych programov (napríklad 3D MAX). Obrázky sa získavajú vykreslením scény a každá scéna je súborom objektov, svetelných zdrojov a textúr.

Zachytávanie pohybu (Motion Capture) - prvý smer animácie, ktorý umožňuje prenášať prirodzené, realistické pohyby v reálnom čase. Senzory sú pripojené k živému hercovi na tých miestach, ktoré budú zarovnané s kontrolnými bodmi počítačového modelu na zadávanie a digitalizáciu pohybu. Súradnice herca a jeho orientácia v priestore sa prenášajú na grafickú stanicu a animačné modely ožívajú.

Animačný softvér.

Animačný softvér umožňuje jednoduché použitie začínajúcim aj skúseným používateľom. Takéto programy majú rôzne technické vlastnosti, ktoré sú pre animátora veľmi užitočné a ľahko použiteľné. Používateľ môže kedykoľvek získať online pomoc. Takýto softvér spadá do dvoch kategórií: dvojrozmerná (2D) a trojrozmerná (3D) animácia. Na trhu je dnes obrovské množstvo a rozmanitosť programov na vytváranie animácií. Mnohé z nich sú široko dostupné a majú skúšobný režim, počas ktorého môže používateľ program používať zadarmo. Po uplynutí tohto obdobia, ak je užívateľ s programom spokojný, môže si kúpiť jeho plnú verziu na ďalšie použitie.

Vlastnosti softvéru pre 2D animáciu (2 D ):

Väčšina z týchto programov je užívateľsky príjemná a ponúka mnoho funkcií. Napríklad užitočné funkcie, ako je prispôsobiteľná mriežka a automatické vyplnenie. Automatizovaná synchronizácia videa a hlasu šetrí čas.

Knižnica šablón určená na usporiadanie, ukladanie a opätovné použitie všetkých vašich aktív a generovaných animácií môže obsahovať všetky druhy mediálnych súborov: filmy, zbierky fotografií, umelecké diela vo formátoch ako SWF, AI, PDF, JPEG, PSD, TGA a GIF.

Špeciálne softvérové ​​prvky uľahčujú proces vytvárania animácií ako jedna, dva, tri. Softvérové ​​nástroje umožňujú používateľovi vytvárať efekty pohybu, zmeny mierky, rotácie a skreslenia. K dispozícii je funkcia automatického vkladania kľúčových snímok do časovej osi.

Proces vytvárania umiestnenia bude trvať sekundy pomocou nástrojov na presúvanie a návrh umiestnenia. Funkcia vytvárania tieňa dodá animácii realistickosť. Vďaka programu sa proces vytvárania animácie stáva ľahkou úlohou bez ohľadu na to, aký zložitý je samotný nápad.

Vytvorte alebo zostavte vysoko kvalitné animácie pre web, PDA, iPod, mobilné telefóny, HDTV vrátane súborov SWF, AVI, QuickTime, DV a ďalších.

aby 2D animačný softvér fungoval:

Pre operačné systémy Mac - Power Macintosh G5, G4 (minimálne) alebo Intel® Core ™, procesor Mac OS X v10.4.7, 512 MB RAM (pamäť s náhodným prístupom) (alebo viac), 120 MB voľného miesta na pevnom disku, 24 bitový farebný monitor, s 64 MB (odporúčané) alebo 8 MB (minimálne) videopamäťou, s rozlíšením až 1024x768 pixelov.

Pre systémy PC - procesor 800 MHz Intel Pentium III (minimálne) so systémom Windows Microsoft XP alebo 2000, (odporúčané) 512 MB RAM, 256 MB (alebo viac), 120 MB voľného miesta na pevnom disku, 24-bitový farebný monitor, 32 videopamäť MB alebo viac, s rozlíšením 1024x768 pixelov.

Vlastnosti softvéru na vytváranie trojrozmernej animácie (3D):

Nástroje na 3D moduláciu, podpora písiem TrueType, import a úprava formátov súborov, export súborov 3DS, zabudovaný 3D prehliadač, editor zložených znakov, úprava objektov, vykreslenie pre vysokú kvalitu, vytváranie vysokokvalitných obrázkov, vytváranie 3D scén a animácií, podpora okrajov, nárazové transformácie, vytváranie mäkkých tieňov, bodových svetiel, hmlového efektu a oveľa viac, podpora formátov súborov BMP.GIF a .JPG, skriptovací jazyk atď.

Požadované systémové požiadavky aby 3D animačný softvér fungoval:

Windows NT 4, Win 95, Win 98, Win ME, Win 2 K alebo Win XP, grafická karta s akceleráciou OpenGL s plnou podporou ICD, (ala GeForce), minimálne 64 MB RAM, 128 MB (odporúčané) alebo 256 MB, ak používate Win XP, 300 MHz Pentium, 5 MB miesta na disku.

Niektoré z najpopulárnejších softvérov na tvorbu animácií:

Ulead Animation, Ulead GIF Animator 5, CoffeeCup Animation Software, CoffeeCup GIF Animator, CoffeeCup Firestarter, Firestarter, Reallusion Animation Software, Effect3D Studio, 3D Max, Toonboom Studio, Macromedia Flash.

GIF animácie využíva sa schopnosť tohto formátu ukladať niekoľko obrázkov do súboru - animované gify sú série snímok, ktoré sa navzájom rýchlo nahradia, vďaka čomu sa dosiahne efekt animácie. Rámy, napríklad nezávislé obrázky alebo samostatné vrstvy jedného obrázka, je možné vytvoriť v ľubovoľnom grafickom balíku - v aplikácii Adobe Photoshop, Jasc Paint Shop Pro atď. Ale zmeniť ich na animovaný súbor GIF obsahujúci nielen všetky pôvodné obrázky, ale tiež informácie o rýchlosti ich výstupu na obrazovku, aplikovanej palete, zvuku atď. (a vo vysoko komprimovanej podobe) sa vykonávajú pomocou špeciálnych programov. Dnes je vďaka takémuto rozšírenému používaniu formátu Animation GIF vo webdizajne veľmi veľa takýchto programov.

Klasifikácia programov na vytváranie gif - animácií.

Celkovo možno všetky programy na vytváranie animovaných súborov GIF rozdeliť do troch skupín:

1. Prvý obsahuje populárne balíčky dvojrozmerných grafík zamerané predovšetkým na prácu s dvojrozmernou rastrovou grafikou a zároveň umožňujúce vytvárať súbory vo formáte Animation GIF prostredníctvom ich doplnkových nástrojov. Najobľúbenejšie z nich sú Adobe Photoshop s programom ImageReady, Jasc Paint Shop Pro, ktorý sa dodáva s Animation Shop, a Ulead PhotoImpact s GIF Animator. Hlavnou výhodou aplikácií tejto skupiny je, že animačný program úzko súvisí s príslušným grafickým balíkom, a preto je možné rýchlo prepínať medzi animačným programom a grafickým editorom, ak je to potrebné, aby sa obrázok opravil. To je výhodné, iba ak rozumiete všetkým zložitostiam práce s takýmito balíkmi (všetky, najmä Adobe Photoshop, si vyžadujú dôkladnú prípravu). Z tohto dôvodu je táto možnosť vhodnejšia pre profesionálov a pre začiatočníkov je lepšie zvoliť si jeden z programov druhej skupiny.

2. V druhom skupina obsahuje balíčky určené výhradne na vytváranie animovaných gifov. Spravidla majú obmedzené možnosti kreslenia, takže zdrojové obrázky pre animáciu sa vytvárajú v ktoromkoľvek z grafických balíkov - títo gifoví animátori nie sú viazaní na konkrétnu grafickú aplikáciu. A nie je vôbec potrebné vyberať si pre prácu zložité balíčky, ako napríklad Adobe Photoshop, Jasc Paint Shop Pro a Ulead PhotoImpact. Schopnosť používať známy grafický balík možno považovať za hlavnú výhodu animátorov gif z tejto skupiny. Nezávislé programy na vývoj animovaných súborov GIF majú navyše malé distribúcie, takže je ich možné bez problémov kúpiť cez internet. Nakoniec, väčšina aplikácií v tejto skupine je veľmi jednoduchá, takže je možné ich rýchlo zvládnuť.

3. Tretia skupinu tvoria programy zamerané na tvorbu 3D grafiky (napríklad 3D Studio Max) a zároveň umožňujúce tvorbu animácie vo formáte Animation GIF (zvyčajne pomocou špeciálneho doplnku, ktorý je často súčasťou dodávky) . Grafické 3D programy sú pohodlné v tom, že nevyžadujú vykreslenie po snímkach - zvyčajne na vytvorenie súboru gif stačí nastaviť objekt nejakým spôsobom cyklicky, napríklad rotáciu okolo osi, zaznamenať výslednú animáciu ako sériu snímok a exportovať ju do animovaného gifu. Existuje však jedno „ale“ - tradičné programy na prácu s trojrozmernou grafikou vyžadujú hlboké odborné znalosti a ich použitie je náročné. Ale nezúfajte! Ak potrebujete vytvoriť napríklad animované trojrozmerné logo, potom je celkom možné vystačiť si s programom Xara3D , ktorý, aj keď je umiestnený na prácu s trojrozmernou grafikou, dokáže vytvárať animované gify a je veľmi ľahko použiteľný.

Dodávame, že skupina softvérových produktov zameraných výlučne na vytváranie animovaných gifov obsahuje balíčky, pomocou ktorých je možné vytvárať aj trojrozmerné animované tlačidlá a logá, aj keď sa ukážu nie tak efektívne ako pri použití programu Xara3D.

Uvažujme o niektorých technológiách a princípoch tvorby animácie.

Ulead GIF Animátor

Ulead GIF Animator je súčasťou grafického balíka Ulead PhotoImpact, ale je možné ho použiť aj samostatne - na vytváranie animovaných gifov na základe obrázkov vytvorených v ľubovoľnom grafickom balíku. Vďaka svojmu pohodlnému a intuitívnemu rozhraniu a bohatým funkciám je tento program dnes považovaný za jedného z najpohodlnejších a najfunkčnejších animátorov gif a výrazne šetrí čas webdizajnérovi, pretože dokáže rozpoznať zmeny vykonané v externých editoroch (PhotoImpact, Photoshop alebo Paint Shop) Pro). A automaticky aktualizuje príslušné snímky v animácii. Animovaný výkres je možné pri zachovaní vrstvenia exportovať do formátu PhotoImpact (UFO) alebo Photoshop (PSD). Okrem toho môžete vybrať ľubovoľnú vrstvu obrázka vytvorenú v grafickom editore PhotoImpact, Photoshop alebo Paint Shop Pro ako samostatný objekt pre GIF Animator.

Program poskytuje bohatú sadu nástrojov na kompozíciu, úpravy, aplikáciu špeciálnych efektov, optimalizáciu a export. Dynamická animácia vrstvených výkresov založená na plnofarebnom objektovo orientovanom modeli uľahčuje manipuláciu s viacerými objektmi vo výkrese a rýchle vytváranie viacobjektových animácií. Dynamická aktualizácia obrázkov vytvorených v externých editoroch nastavuje nový štandard integrácie. Sprievodca animáciou uľahčuje umiestnenie obrázkov na pracovnú plochu a umožňuje okamžite vyhodnotiť kvalitu vytvorenej animácie na základe jej ukážky v okne ukážky. Správca objektov vám pomôže sledovať všetky objekty vo výkrese a funkcie doplnenia automatizujú proces animácie generovaním medzipoloh pre vybrané objekty.

Ulead GIF Animator obsahuje textovú animáciu a viac ako 130 animačných efektov. Pokročilé metódy kompresie obrázkov implementované v programe umožňujú dosiahnuť výrazné zníženie veľkosti súborov animácie, automatické generovanie kódu HTML výrazne urýchľuje proces vkladania hotových animácií na webovú stránku a podporuje export do rôznych formátov vrátane Flash, AVI, MPEG a QuickTime, robí program ešte atraktívnejším.

ImageReady CS

ImageReady CS je súčasťou populárneho balíka Photoshop CS od spoločnosti Adobe a je navrhnutý tak, aby vyvíjal rôzne webové prvky vrátane animovaných gifov, čo z neho pri zohľadnení úplnej kompatibility s Photoshopom robí vynikajúci nástroj pre webdizajn pre profesionálov. Photoshop a ImageReady úzko spolupracujú a navzájom sa krásne dopĺňajú. Upravený súbor je možné počas úprav ľahko presúvať medzi programami pomocou automatického ukladania. Vytvorené animované súbory GIF je možné exportovať do formátu Macromedia Flash (SWF).

Animované gify je možné vytvárať jednak na základe viacvrstvových súborov programov Adobe Photoshop a Adobe Illustrator, jednak z jednotlivých obrázkov uložených v rôznych grafických formátoch. Pri vytváraní animácie založenej na sérii obrázkov na úpravu rámcov nemusíte načítať každý obrázok zvlášť - môžete využiť možnosť importu z priečinka, v ktorom boli predtým uložené jednotlivé rámce budúcej animácie. Je možné automaticky vygenerovať požadovaný počet medzisnímkov, čo výrazne urýchľuje príjem plynulých animácií, pretože nie je potrebné manuálne vytvárať každý snímok. V okne programu môžete okamžite zobraziť výsledok a v prípade potreby vykonať požadované zmeny.

obr jeden

ImageReady má veľkú galériu filtrov podobných mnohým zo známych filtrov Photoshopu. Preto, aby ste do rámu pridali konkrétny efekt, nemusíte vždy prepínať do Photoshopu - veľa akcií je k dispozícii aj v prostredí ImageReady.

Ak chcete prepnúť z Photoshopu na ImageReady a späť, kliknite ľavým tlačidlom myši na posledný riadok vertikálneho panela s nástrojmi - Upraviť na pripravenosť na obrázok(Open in Image Ready), alebo len podržte súčasne kombináciu klávesov Shift + Ctrl + M :

Panel Animácie je možné vyvolať pomocou príkazu Okno> Animácia(Okno> Animácia).

Animácia GIF prehráva skupinu obrazových rámcov v poradí definovanom používateľom. Pre webovú stránku môžete vytvoriť rôzne animačné efekty: nechať text alebo grafiku pohybovať sa, vyblednúť alebo sa zobraziť alebo inak zmeniť.

Ak chcete pripraviť animáciu v programe ImageReady, musíte pomocou palety Animácia zobrazenej na obrázku 1 vytvoriť viac rámcov obrázka. 3. Potom môžete upraviť jednotlivé vrstvy každého rámu pomocou palety Vrstvy (Vrstvy) obr. 4, pričom každý rámec má svoju vlastnú jedinečnú sadu nastavení v palete Vrstvy. Nakoniec musíte sekvenciu snímok uložiť ako jeden súbor GIF - animácia je teraz pripravená na interaktívne prezeranie.

obr 3

obr štyri

Efekty vrstvy

ImageReady ponúka rovnakú sadu efektov vrstiev ako Photoshop. Ale Photoshop upravuje vlastnosti vrstvy pomocou dialógového okna Štýl vrstvy a ImageReady pomocou palety možností kontextovej vrstvy.

Efekty v programe ImageReady majú rovnaké vlastnosti ako vo Photoshope: ich názvy sú zobrazené pod názvom vrstvy, na ktorú sú aplikované; efekty sa pohybujú s vrstvou; prvky palety majú šípky smerujúce doprava, pomocou ktorých môžete otvoriť alebo zatvoriť zoznam efektov. Každý efekt má svoju vlastnú ikonu na zobrazenie alebo skrytie daného efektu.

Vytvorenie efektu animácie pre obrázok.

1. Otvorte alebo vytvorte obrázok obsahujúci vrstvu pozadia a priehľadnú vrstvu s obrázkom nejakého objektu.

2. Otvorte paletu Animácia(Animácia).

3. Vyberte vrstvu na palete Vrstvy (Vrstvy).

4. S nástrojom Hýbte sa(Presunúť) Presuňte prvok obrázku k okraju hlavného okna.

5. V dolnej časti palety Animácia kliknite na tlačidlo Duplikovať aktuálny rámec(Duplikovať aktuálny rámec). Skopírovaný rám sa zvýrazní.

6. Vrstva vybraná v kroku 3 by mala zostať vybratá.

7. S nástrojom Hýbte sa(Kláves V) Presuňte prvok vrstvy na druhú stranu hlavného okna. Túto vrstvu nechajte vybratú!

8. Na palete Animácia kliknite na tlačidlo Tween(Medzisnímky) na vytvorenie medzisnímok medzi už vybranými.

9. V dialógovom okne Tween(Medzi) nastavte prepínač Vrstvy na jednu z nasledujúcich pozícií:

· Všetky vrstvy(Všetky vrstvy) na kopírovanie bodov zo všetkých vrstiev do nových rámcov.

· Vybraná vrstva(Selected Layer) na kopírovanie bodov iba vybranej vrstvy do nových snímok. Všetky ostatné vrstvy budú skryté.

Potom nastavte v skupine Parametre Začiarkavacie políčka (Parametre) tých parametrov, ktoré sa budú meniť v medzisnímkach: Pozícia(Umiestnenie), Nepriehľadnosť(Nepriehľadnosť) a / alebo Účinky(Efekty).

Z rozbaľovacej ponuky Doplniť s(Stredný rozsah snímok) vyberte režim Predchádzajúci rám(Pridanie prechodných snímok medzi vybratý a predchádzajúci snímok).

Výber možností prehrávania animácie

Z rozbaľovacej ponuky umiestnenej v ľavom dolnom rohu palety Animácia(Animácia), vyberte režim prehrávania, ktorý určuje spôsob prehrávania animácie: Raz(Raz) alebo Navždy(Priebežne v slučke). Alebo povoľte túto možnosť Iné(V opačnom prípade) zadajte počet opakovaní prehrávania animácie a potom kliknite na tlačidlo OK.

Ukážka animácie

1. V hlavnom okne vyberte kartu Originál(Pôvodný obrázok) alebo Optimalizované(Optimalizovaný obrázok).

2. Ak nie je vybraný prvý rámec, potom v dolnej časti palety Animácia(Animácia) kliknite na tlačidlo Vyberte prvý rámček(Vyberte prvý rámček).

obr 5. Duplicitný rámec animácie

3. Kliknite na tlačidlo hrať(Prehrať) - pozri obrázok 5. Animácia sa bude hrať o niečo pomalšie, ako by mala. (Ukážka je v programe ImageReady pomalšia ako v prehliadači.)

4. Kliknite na tlačidlo Prestaň(Stop), ktorá vyzerá ako štvorec, pozastaví prehrávanie.

5. Uložte súbor a potom kliknite na tlačidlo Predvolený prehliadač(Ukážka v predvolenom prehliadači) umiestnená na paneli nástrojov. Kliknite na tlačidlo späť(Späť) sa po dokončení prezerania vráti do programu ImageReady.

Krútiť sa animáciou

Tu je príklad, ako vytvoriť prvok vrstvy, aby sa krútil zo strany na stranu. Tento typ animácie ovplyvňuje body vrstvy a kopíruje sa do všetkých existujúcich snímok. Pre každú etapu pohybu je potrebné vytvoriť duplicitnú vrstvu.

Vytvorme animáciu, v ktorej sa objekt bude pohybovať určitým smerom a späť.

1. Otvorte obrázok a paletu Animácia(Animácia).

2. V dolnej časti palety Animácia kliknite na tlačidlo Duplikovať aktuálny rámec(Duplikovať aktuálny rámec). Duplicitný rámec bude teraz vybraný.

3. Na palete Animácia kliknite na tlačidlo Tween a potom začiarknite prepínač Vrstvy(Vrstvy) do polohy Všetky vrstvy(Všetky vrstvy), zadajte počet rámcov do poľa Rámy na pridanie(Pridať snímky), vytvorte animáciu a kliknite na tlačidlo Ok.

4. Kliknite na rám, kde by sa malo krútenie začínať.

5. Na palete Vrstvy(Vrstvy) vytvorte duplikát vrstvy, ktorej obraz sa bude pohybovať.

6. Upravte duplicitnú vrstvu (napríklad upravte farbu). Skryte pôvodnú vrstvu, aby ste videli svoje zmeny. Zmeny sa prejavia vo vybranom ráme na palete Animácia.

7. Vyberte nasledujúci rámec. Zviditeľniť pôvodnú vrstvu prijímača a skryť upravený duplikát.

8. Kliknite na nasledujúci rámec. Teraz ukážte upravenú duplicitnú vrstvu a skryte pôvodnú vrstvu.

Takže striedavo zobrazujte / skrývajte vrstvy pre zvyšné snímky animácie.

Otvára sa animácia GIF

Jedinou viditeľnou výhodou používania súboru GIF je možnosť aplikovať alebo upraviť nastavenia optimalizácie súborov.

1. Vykonajte príkaz Súbor> Otvoriť(Súbor> Otvoriť) alebo stlačte kombináciu klávesov Ctrl + O.

2. Vyhľadajte názov súboru s príponou .gif a kliknite naň.

3. Kliknite na tlačidlo Otvorené(Otvorené). Rámečky sekvencie animácie sa zachovajú. Paleta Vrstvy však teraz zobrazí sled vrstiev: jednu vrstvu pre každý rám. Jednotlivé prvky vrstvy už nie je možné upravovať nezávisle od ostatných rámov!

Optimalizácia animácie

1. V ponuke palety Optimalizovať(Optimalizácia) použite príkaz Optimalizujte animáciu(Optimalizovať animáciu).

2. V skupine parametrov Optimalizovať podľa Začiarknite políčko (Optimalizovať pomocou) Ohraničujúca skrinka(Ohraničovací rámček), aby sa zachoval pôvodný rám, ako aj iba tie oblasti, ktoré sa menia pri prechode z jedného rámu na druhý. V dôsledku toho sa zmenší veľkosť súboru, ale zároveň s ním nebudú môcť pracovať všetky editačné programy, ktoré akceptujú formát GIF.

Okrem týchto akcií alebo namiesto nich začiarknite políčko Redundantné odstránenie pixelov(Odstrániť nepotrebné body), ak chcete odstrániť tie body objektu alebo pozadia, ktoré sa nezmenia, to znamená, že sa znova zobrazia pri každom načítaní nového rámca. Pomôže to tiež zmenšiť veľkosť súboru.

Žiadna z týchto možností nezmení skutočný vzhľad animácie, všetky zmeny sa vykonajú v zákulisí.

Ukladá sa animácia.

Vytvorenú animáciu je možné uložiť vo formáte GIF alebo ako film QuickTime. Ostatné formáty súborov, napríklad JPEG alebo PNG, uložia iba prvý rámček obrázka, čo zabráni prehraniu celej animácie. Existuje niekoľko spôsobov, ako uložiť optimalizované animácie na použitie na webovej stránke. V ImageReady stačí zvoliť príkaz Súbor> Uložiť optimalizované(Súbor> Uložiť optimalizované), ak chcete uložiť animáciu s vybratými nastaveniami, ktoré ste naposledy uložili. Ak nejde o prvé uloženie, potom o dialógové okno Uložiť(Save) sa nezobrazí a názov súboru a parametre zostanú nezmenené predtým.

Výber tímu Súbor> Uložiť optimalizované ako(Súbor> Uložiť ako optimalizované) vám umožňuje zmeniť názov súboru a zvoliť iné umiestnenie úložiska. Okrem toho je možné zvoliť upravený parameter Uložiť ako typ(Typ súboru) z množiny dostupných hodnôt:

· HTML a obrázky(HTML a obrázky) - vygeneruje súbor HTML a uloží každý obrázok ako samostatný súbor;

· Iba obrázky(Iba obrázky) - uloží iba obrázok do samostatného súboru;

· Iba HTML(Iba HTML) - Uloží iba súbor HTML bez obrazových súborov.

Okrem toho ImageReady umožňuje vytvoriť súbor HTML pomocou príkazu Kopírovať HTML, ktorý skopíruje kód HTML do schránky a potom ho možno vložiť na webovú stránku v ľubovoľnom editore HTML. Ak sa pôvodný obrázok zmení, aktualizujte súbor HTML spustením príkazu Aktualizovať HTML s názvom aktualizovaného súboru.

Ak chcete uložiť animáciu vo formáte QuickTime, vyberte príkaz Súbor> Exportovať originál ( File> Export Initial) a vyberte hodnotu z rozbaľovacieho zoznamu QuickTime film(Bude k dispozícii, ak je vo vašom počítači nainštalovaný program QuickTime). Po zadaní názvu súboru a jeho umiestnenia kliknite na tlačidlo Uložiť(Uložiť) vytvorí súbor vybraného typu.

Ako vytvoriť animovaný dážď.

Krok 1. Otvoríme obrázok.

Krok 2. Vytvorte novú vrstvu a vyplňte ju sivou farbou. A použiť na to filter Filter - Šum - Pridajte šum a nastavte tieto nastavenia.

Potom nanesieme filter Filtrovanie - Rozostrenie - Rozostrenie pohybu

Nastaviť priehľadnosť vrstvy na 30%

Krok 3. Znovu vytvorte novú vrstvu a naplňte ju šedou farbou a naneste rovnaké filtre ako v kroku číslo dva, ale použite filter Pohybový efekt už to robí s inými nastaveniami.

a nastavte priehľadnosť vrstvy na 30%

Krok 4 ... Znova opakujeme všetko to isté, čo sme urobili v kroku 2. Filtrovať Pohybový efekt urobte to s rovnakými nastaveniami a nastavte nepriehľadnosť vrstvy na 30%.

Krok 5 ... Ísť do Čítačka obrázkov to sa deje pomocou klávesovej skratky ( Shift + Ctrl + M)

Krok 6 ... Robíme dĺžku rámu 0,1 s.

Krok 7 ... Z nášho rámu urobíme dva duplikáty.

Krok 8 ... Prejdite na prvý rám a uistite sa, že je viditeľná iba prvá vrstva s kvapkami, ktoré sme vytvorili.

Krok 9 ... Prejdite na druhý rám a uistite sa, že je viditeľná iba druhá vrstva s kvapkami, ktoré sme vytvorili.

Krok 10 ... Prejdite na tretí rám a uistite sa, že je viditeľná iba tretia vrstva s kvapkami, ktoré sme vytvorili.

Všetky naše animácie sú pripravené!

Xara3D 5.0

Na rozdiel od väčšiny programov na prácu s trojrozmernou grafikou má Xara3D jednoduché a užívateľsky prívetivé rozhranie a minimálny počet nastavení, aby na to ľahko a rýchlo prišiel aj začiatočník. A hoci je program primárne určený na vytváranie objemného textu a tlačidiel, je vhodný na získavanie animácií vo formátoch Animated GIF a AVI. Preto ho weboví dizajnéri úspešne využívajú hlavne na vytváranie profesionálnych trojrozmerných textových log.

V arzenáli programu - veľká sada typov písma a textúr na zdobenie vytvorených objektov. Poskytuje úplnú kontrolu nad vygenerovaným textom vrátane jeho polohy, zarovnania, vodenia, vyrovnania párov atď., Efektívne a flexibilné riadenie farieb a štruktúry 3D obrazu. Môžete tiež urobiť obrázky matné alebo lesklé, použiť jemný tieň rámčeka a ďalšie. Existuje široká škála efektov animácie: objekty sa môžu otáčať, postupne sa objavovať, pulzovať, krokovať, hojdať sa alebo zmiznúť. Okrem toho môžete importovať animačné prvky z jedného súboru a použiť ich na iný. Jednoduché ovládacie prvky animácie vám umožňujú nastaviť akékoľvek časové hranice, napríklad pridať pauzy v rôznych časoch alebo nastaviť vlastné charakteristiky animácie pre každý objekt.

Program podporuje import dvojrozmerných grafických súborov vo formátoch WMF, EMF, GIF a PNG a výsledky animácií je možné ukladať nielen vo formáte Animation GIF, ale podľa potreby aj vo formátoch AVI alebo SWF.

Macromedia Flash

Presnejšie povedané, Adobe Flash je prostredie na vytváranie aplikácií pre platformu Flash spolu s ďalšími nástrojmi (prostrediami):

Adobe Flex Builder

Flash Development Tool (FDT) atď.

Flashové aplikácie sa vytvárajú pomocou ActionScript - programovací jazyk. Ak zdrojový kód neobsahuje jazykové pokyny, v každom prípade sa počas kompilácie vygeneruje základný kód jazyka ActionScript (je to viditeľné pri pohľade na bajtový kód Flash). Ďalej je na pódiu základný klip, ktorý sa dedí z triedy MovieClip, ktorá sa začne hrať. Prostredie Adobe Flash je zamerané skôr na návrhárov a animátorov, aj keď je možné písať plnohodnotný kód. Flex Builder, FDT, je zameraný na programovanie a neexistujú žiadne špeciálne nástroje rozhrania pre animáciu a vizualizáciu.

Flash sa tiež používa ako názov formátu (flash filmy, flash filmy) (celé meno - Flash Movie).

Pri vytváraní produktu môžete používať zvukové a grafické súbory, vytvárať interaktívne rozhrania a plnohodnotné webové aplikácie pomocou PHP a XML.

Súbory Flash majú príponu „.swf“ a zobrazujú sa pomocou aplikácie Flash Player, ktorú je možné do prehliadača nainštalovať ako doplnok. Súbory SWF je možné zobraziť aj pomocou prehrávača Gnash. Distribuované bezplatne prostredníctvom webových stránok spoločnosti Adobe. Zdrojové súbory s príponou „.fla“ sa vytvárajú vo vývojovom prostredí Adobe Flash a potom sa kompilujú do formátu „.swf“, ktorý podporuje Flash Player.

Flash je založený na vektorovom morfovaní, teda na plynulom „toku“ z jednej kľúčovej snímky do druhej. Takto môžete vytvárať pomerne zložité kreslené scény, pričom pre každú postavu nastavíte iba niekoľko kľúčových snímok.

Flash používa programovací jazyk ActionScript založený na ECMAScript.

Technológia vektorového morfovania existuje už dávno pred programom Flash. V roku 1986 bol uvedený na trh softvér Fantavision, ktorý používal túto technológiu. V roku 1991 vyšla na tejto technológii hra Another World a o dva roky neskôr - Flashback.

História programu Flash sa začala písať v roku 1995, keď spoločnosť Macromedia po zakúpení animačného programu FutureSplash Animator uviedla na trh produkt s názvom Flash.

Spoločnosť Flash začala svoju profesionálnu kariéru vydaním konvenčného softvérového produktu na 2D animáciu. Postupom času sa všetko vyvíjalo rýchlym tempom. Flash nešetril vývojom, stal sa modernejším a dokonalým.

Dnes existujú takzvané 3D motory, napríklad:

PaperVision3D, ale ich rýchlosť a kvalita práce sú pomerne nízke, hlavne kvôli skutočnosti, že v súčasnosti nie je možnosť použiť ako súčasť prehrávača Flash nástroje DirectX alebo OpenGL, takže sa vykonáva úplná emulácia všetkých 3D algoritmov. Nechýba podpora pre hardvérové ​​zrýchlenie, viacjadrové procesory - čo tiež znižuje rýchlosť motora. Dizajnéri však často vytvárajú svoj vlastný 3d engine šitý na mieru špecifikám konkrétneho projektu (hry).

Väčšina prehliadačov má dnes špeciálne zabudovaný doplnok Macromedia Flash Player, ktorý im umožňuje prehrávať súbory Flash. Technológia Flash dominovala na internete a stala sa štandardom pre zobrazovanie vektorovej animácie na webových stránkach. Bez aplikácie Adobe Flash Player nebudú prehliadače správne zobrazovať webové stránky a vložené interaktívne webové prvky Flash.

Rozhranie Macromedia Flash.

obr

Po otvorení okna aplikácie Flash sa na obrazovke zobrazia nasledujúce prvky rozhrania:

Fáza (plocha) - oblasť na skladanie jednotlivých rámcov, vytváranie kompozície z grafických prvkov alebo importovaných bitmáp a prezeranie výsledkov animácie;

· Časová os (časová os) - okno obsahujúce zoznam jednotlivých vrstiev, na ktorých sú umiestnené grafické objekty a ich rozloženie v čase (každý časový úsek filmu je vyznačený na časovej osi);

· Symboly (symboly) - hlavné prvky filmu sa v ňom spravidla používajú opakovane;

· Knižnica - okno so zoznamom symbolov a importovaných súborov, ktoré vám umožňuje ich usporiadanie a triedenie;

· Plávajúce, dokovateľné panely (dokovateľné panely) - okná so sadou kariet slúžiace na konfiguráciu aplikácie a zmenu parametrov filmových prvkov;

· Movie Explorer (prehliadač filmov) - ďalšie nazývané okno na prezeranie štruktúry filmu.

Animácia po snímkach

Poďme sa teda opäť pozrieť na okno Flash. Keď je v ňom otvorený film, v hornej časti okna sa nachádza takzvaná časová os. Na jeho ľavej strane sú názvy vrstiev, o ktorých si povieme neskôr v tejto kapitole, a ich atribúty. A na pravej strane sú očíslované snímky videa (obr. 4). Kvôli číslovaniu snímok sa toto okno nazýva časová os - koniec koncov, snímky vo videu nasledujú jeden po druhom.

Na časovej osi je červený obdĺžnik, ktorý vždy vyberie aktuálny rámec.


Záver:

Vo svete moderných technológií sa animácia stáva jedným z hlavných prvkov multimediálnych projektov a prezentácií a čoraz viac sa vyskytuje na internetových stránkach.

V tomto príspevku sa zaoberáme najbežnejšími prostriedkami podpory a vytvárania animácie, ako aj fázami vytvárania súborov GIF, flash klipov a animovaného volumetrického textu pomocou rôznych efektov.

Xara3D - program na prácu s trojrozmerným textom má priateľské rozhranie a minimálny počet nastavení, považuje sa to za jednoduché a pohodlné.

Vďaka pohodlnému a intuitívnemu rozhraniu a bohatým funkciám je Ulead GIF Animator dnes považovaný za jeden z najpohodlnejších a najfunkčnejších programov na vytváranie súborov GIF a výrazne šetrí čas webdizajnérovi.

je popredný nástroj na vytváranie multimediálneho obsahu. Softvér integruje text, grafiku, zvuk a video a vytvára interaktívne multimediálne prostredie, ktoré poskytuje vynikajúce výsledky pre interaktívne prezentácie, marketingové materiály, zdroje eLearning a grafické používateľské rozhrania.

Macromedia Flash Professional združuje viac ako milión vývojárov a používateľov z celého sveta pomocou najrôznejších výpočtových zariadení. Technológia Macromedia Flash sa považuje za najrozšírenejšiu softvérovú grafiku.


Bibliografia:

1. Computer Press 3 '2005;

2. https://computer.damotvet.ru/software/887515.htm;

3. Ilustrovaný návod na animáciu pre internet; 2007 Skupina softvéru Dynamite.


Úvod ................................................. .................................................. .............................. 3

Animácia ................................................. .................................................. ............................ štyri

Animačné technológie ................................................ ........................................... štyri

Animačný softvér ............................................. ... ........... štyri

Vlastnosti softvéru pre 2D animáciu (2D) ..................... 5

Vlastnosti softvéru na vytváranie trojrozmernej animácie (3D) ... 5

GIF animácia ................................................ .................................................. ....................... 6

Klasifikácia programov na vytváranie gifov - animácií .......................................... . ......... 6

Z troch hlavných rekreačných funkcií (terapeutické, zlepšujúce zdravie a kognitívne) je animácia turistov navrhnutá tak, aby priamo plnila dve funkcie - športovú a zlepšujúcu zdravie a kognitívne. Nepriamo sa za vhodných podmienok vykonáva aj terapeutická funkcia.

V praxi animácie možno pri cielenom navrhovaní animačných programov rozlíšiť nasledujúce funkcie turistickej animácie:

Adaptívny, ktorý vám umožní prejsť z každodenného prostredia do voľného, ​​voľného času;

Kompenzačné, odbremenenie človeka od fyzickej a psychickej únavy z každodenného života;

Stabilizácia, vytváranie pozitívnych emócií a stimulácia duševnej stability;

Wellness zameraný na obnovu a rozvoj fyzických síl človeka, oslabený v každodennom pracovnom živote;

Informačné, ktoré vám umožňujú získať nové informácie o krajine, regióne, ľuďoch atď.;

Vzdelávacie, ktoré vám umožní získať a upevniť nové poznatky o svete okolo vás v dôsledku živých dojmov;

Kultivácia, prinášanie intelektuálnych a fyzických zlepšení;

Takáto rozmanitosť funkcií turistickej animácie viedla k rôznym druhom animačných aktivít, ako aj k širokej škále animačných programov a udalostí.

Z hľadiska systematického prístupu je turistická animácia uspokojením konkrétnych turistických potrieb v komunikácii, pohybe, kultúre, tvorivosti, príjemnom čase a zábave.

Škála týchto potrieb je veľmi široká, pretože ľudia, ktorí idú na dovolenku, majú v tomto koncepte úplne odlišné významy: pre niekoho je dovolenka cesta, pre iného - čítanie kníh, prechádzky v lese, rybolov atď. Podľa dopytu a motivácia pre cestovanie v Pri poskytovaní turistických služieb sa vytvárajú nasledujúce typy animácií, ktoré uspokojujú rôzne potreby turistov (dovolenkárov):

Animácia v pohybe - uspokojuje potrebu moderného človeka pre pohyb v kombinácii s potešením a príjemnými zážitkami;

Animácia prostredníctvom zážitku - uspokojuje potrebu pocitu nového, neznámeho, neočakávaného zoznámenia, objavov, ako aj pri prekonávaní ťažkostí;

Animácia prostredníctvom komunikácie - uspokojuje potrebu komunikácie s novými, zaujímavými ľuďmi, pri objavovaní vnútorného sveta ľudí a poznávaní samého seba prostredníctvom komunikácie;

Animácia prostredníctvom pokoja - uspokojuje potrebu psychickej úľavy ľudí od každodennej únavy prostredníctvom pokoja, samoty, kontaktu s prírodou, ako aj potrebu mieru a „nečinnosti lenivosti“;

Kultúrna animácia - uspokojuje potrebu ľudí pre duchovný rozvoj jednotlivca prostredníctvom oboznámenia sa s kultúrnymi a historickými pamiatkami a modernými vzorkami kultúry krajiny, regiónu, ľudí, národa;

Kreatívna animácia - uspokojuje potrebu tvorivosti človeka, preukázanie jeho tvorivých schopností a nadväzovanie kontaktov s rovnako zmýšľajúcimi ľuďmi prostredníctvom spoločnej tvorivosti.

Skutočné animačné programy majú najčastejšie zložitú povahu a uvedené typy animácií sú základnými prvkami týchto programov.

Animačné programy spolu s čisto rekreačnými aktivitami zahŕňajú rôzne športové hry, cvičenia a súťaže. Táto kombinácia robí tieto programy bohatšími, zaujímavejšími a užitočnejšími na posilnenie a obnovu zdravia, preto sa vo vzťahu medzi animáciou turistov a športom najčastejšie dosahuje najväčší obnovujúci a zlepšujúci účinok na zdravie.

Vyzdvihnime typy animácie, ktoré sú relevantné pre tému práce: rekreačná, turistická, hotelová.

Rekreačná animácia je druh voľnočasových aktivít zameraných na obnovenie duchovných a fyzických síl človeka. Programy voľného času realizované na rekreačné účely môžu uskutočňovať turistické aj rekreačné podniky s turistami, rekreantmi a hosťami a podniky voľného času s miestnymi obyvateľmi. Toto nám dáva právo tvrdiť, že koncept rekreačnej animácie je širší ako pojem hotel a turista. Obrázok 2 zobrazuje štruktúru turistickej animácie.

Obrázok 2 - Odrody rekreačnej animácie

Turistická animácia je turistická služba, pri poskytovaní ktorej je turista zapojený do aktívnej činnosti.

Hotelová animácia je najužší pojem z troch uvažovaných, pretože zahŕňa iba organizáciu voľného času v turistických podnikoch: turistické komplexy, hotely, hotely, kempy atď.

K dispozícii sú aj ďalšie animačné služby - animačné programy určené na „podporu“ hlavných turistických služieb uvedených v balíku zájazdov, počas technologických prestávok v dôsledku cestovania, zdržania na ceste, v prípade nepriaznivého počasia alebo nedostatku podmienok pre cieľovú zábavu.

Tabuľka 1 predstavuje turistickú animáciu s dôrazom na wellness rekreáciu.

Tabuľka 1 - Typológia animačných aktivít

V súlade s tým budú cieľmi pre každý z typov animácie cestovný ruch a turistické súťaže, športové a športové, zábavné podujatia, poznávacie a exkurzné činnosti.

o dokonalej animácii v aplikácii.

Určite ste už počuli výraz „Dobrý dizajn je okamžite viditeľný. Skvelý dizajn je neviditeľný. ““ Rovnaký princíp je možné uplatniť aj na animácie v mobilných aplikáciách: úspešná animácia skutočne robí aplikáciu pohodlnou a priťahuje pozornosť, ale neodpútava pozornosť používateľa od samotnej aplikácie. Hlavnou úlohou animácie je vysvetliť používateľovi logiku aplikácie.

Typy animácií

Ak chcete optimalizovať použitie animácií, musíte v aplikácii definovať ich miesto a funkciu. Poďme zistiť, aké typy animácií existujú.

Vizuálna spätná väzba

Vizuálna spätná väzba je nevyhnutná pre každé používateľské rozhranie. Vo fyzickom svete objekty reagujú na našu interakciu s nimi. Ľudia to očakávajú rovnako od prvkov aplikácie. Vizuálna spätná väzba, ako aj sluchová a hmatová spätná väzba, poskytujú používateľovi pocit dôvery. Vizuálna spätná väzba slúži aj na jednu jednoduchú funkciu: naznačuje, že vaša aplikácia pracuje správne! Keď sa ikona zväčší alebo sa obrázky „posunú prstom“ posunú určitým smerom, bude zrejmé, že aplikácia „reaguje“ na reakciu používateľa. Keď v nasledujúcom príklade používateľ začiarkne políčko, že je úloha dokončená, pole sa zúži a zmení farbu na zelenú.

Tinderov známy prístup prejdením prstom zľava doľava doprava sprava je tiež vizuálna spätná väzba. Túto animáciu sme implementovali do našej otvorenej knižnice Koloda:

Funkčná zmena

Tento typ animácie ukazuje, ako sa prvok mení pri interakcii používateľa s ním. Najlepšie sa to hodí, ak chcete ilustrovať, ako sa menia funkcie prvkov. Najčastejšie sa používa v tlačidlách, ikonách a iných malých dizajnových prvkoch.

V prvom príklade môžete vidieť tlačidlo, ktoré sa zmení z ikony „hamburger“ na „X“, čo znamená, že sa zmenila funkcia tohto tlačidla.

V druhom príklade sa mení ikona aj obsah.

Orientácia v priestore

Väčšina mobilných aplikácií je zložitá. V takom prípade je úlohou dizajnéra čo najviac zjednodušiť navigáciu. Animácia môže byť na splnenie tejto úlohy mimoriadne užitočná. Ak vám ukáže, kde sa prvok skrýva, nabudúce ho bude používateľ ľahšie vyhľadať. V tomto príklade vidíme ponuku na navigačnom paneli. Prevráti sa, keď používateľ klikne na tlačidlo:

V tomto príklade vidíme, ako sa ďalšie tlačidlá zobrazujú v dolnej časti obrazovky - na rovnakom mieste ako ostatné možnosti.

Hierarchia prvkov a ich vzájomné pôsobenie

Animácia je ideálna na popis častí rozhrania a na ilustráciu ich interakcie. Každý prvok má v animácii svoj vlastný účel a miesto. Napríklad, ak tlačidlo aktivuje rozbaľovaciu ponuku, je lepšie, aby sa ponuka zobrazovala pomocou tlačidla, a nie iba vyplávala z niektorého rohu obrazovky: používateľovi sa zobrazí výsledok kliknutia. Toto pomôže užívateľovi pochopiť, že tieto dve položky (tlačidlo a rozbaľovacie menu) spolu súvisia.

Všetky animácie by mali ilustrovať, ako sú prvky spojené. Táto hierarchia a interakcia prvkov je pre intuitívne rozhranie veľmi dôležitá. V prvom príklade, kde sa po kliknutí na ikonu zobrazí ponuka, z pohľadu používateľa je ponuka rovnakým prvkom, iba zväčšená.

V druhom príklade sa informácie o prvku zvyšujú po kliknutí, používateľ si uvedomí, že ide o ten istý prvok, rozdiel je iba vo veľkosti.

Vizuálne znamenie

Animácie vám povedia, ako interagovať s prvkami. Je obzvlášť dôležité ponúknuť vizuálne podnety, keď má aplikácia nepredvídateľný vzor interakcie medzi prvkami. V tomto príklade, keď používateľ otvorí blog, sa poštové schránky zobrazia na pravom okraji obrazovky a používateľ potrebuje na ich prechádzanie vodorovné potiahnutie.

Druhý príklad používa podobnú techniku, ale iba pre ikony sociálnych médií.

Stav systému

Niektoré procesy vždy prebiehajú vo vašej aplikácii: informácie sa sťahujú zo servera, vykonávajú sa výpočty atď.

Vašou úlohou je informovať používateľa o tom, že vaša aplikácia nezmrzla alebo sa nezlomila, a informovať ho o stave aktuálneho procesu. V ideálnom prípade by mal byť každý proces v aplikácii sprevádzaný samostatnou animáciou. Napríklad pri zaznamenávaní zvuku by mala obrazovka aplikácie zobrazovať dynamiku zvukovej stopy. Animovaná zvuková vlna dokáže zobraziť hlasitosť zvuku.

Jedným z najbežnejších príkladov tohto typu animácie je pull-to-refresh.

Vtipné animácie

Zábavné animácie môžu byť dobré alebo zlé. Často sa používajú nezmyselne a môžu výrazne komplikovať vývoj aplikácií. Skutočne jedinečné animácie však môžu byť pre používateľov veľmi príťažlivé a môžu vašu aplikáciu odlíšiť od ostatných. Je to jeden z tajných nástrojov, ktoré dizajnéri používajú na to, aby si používatelia svoj produkt zamilovali. Jedinečné animácie vám môžu pomôcť vybudovať rozpoznateľnú značku.

V našom príklade vyzerajú pohyblivé kruhy veľmi neobvykle a priťahujú pozornosť používateľa. Schopnosť pohybovať týmito kruhmi po obrazovke prináša radosť a zjednodušuje proces. Je to jednoduché a zábavné.

Som si istý, že funkcia „pull to refresh“ vo forme varného kotla vás nenechá ľahostajnými!

Pri vytváraní zábavných animácií musíte pamätať na dve veci: 1) uistite sa, že to nezatieni alebo nezakryje funkčnosť aplikácie. 2) nemalo by to trvať dlho.

Hlavné princípy návrhu

Prebrali sme základné typy a funkcie animácie. Pri vytváraní skutočne efektívnych animácií nezabudnite na 9 princípov, ktoré sa dajú pôvodne použiť, ale dajú sa použiť aj v dizajne používateľského rozhrania.

1. Materiál

Ukážte, z čoho pozostáva váš prvok: je to niečo ľahké alebo ťažké, pevné alebo pružné, ploché alebo objemné? Dajte používateľom vedieť, ako bude tento prvok používateľského rozhrania interagovať s ostatnými.

2. Dráha pohybu

Musíte určiť povahu pohybov. Základné princípy diktujú, že neživé mechanické objekty majú zvyčajne priamu trajektóriu pohybu, zatiaľ čo živé majú flexibilnú a nie tak priamu trajektóriu. Budete sa musieť rozhodnúť, aký dojem by malo vaše používateľské rozhranie spôsobiť, a potom sa ho držať.

3. Načasovanie

Načasovanie je pravdepodobne jedným z najdôležitejších problémov animácie. V skutočnom svete sa fyzické objekty nepohybujú podľa pravidiel priamočiareho pohybu, pretože ich zrýchlenie a spomalenie si vyžaduje určitý čas. Použite krivky, aby sa vaše objekty pohybovali prirodzenejšie.

4. Zaostrovacia animácia

Upozornite na oblasť obsahu obrazovky. Blikajúca ikona napríklad upozorní používateľa na kliknutie na zobrazenie oznámenia. Tento typ animácie sa používa v rozhraniach s množstvom detailov a prvkov, keď neexistuje iný spôsob zvýraznenia konkrétneho prvku.

Najdôležitejšie:

  • Pamätajte, kto je vaša cieľová skupina, a vytvorte svoj prototyp ako riešenie ich problémov.
  • Uistite sa, že každý prvok vašej animácie je racionálny. (Prečo on? Prečo tak? Prečo teraz?)
  • Aby váš produkt vynikol, zamerajte sa na prirodzene vyzerajúce animácie, ktoré sa podobajú pohybovým vzorom v reálnom svete.
  • Poraďte sa s vývojármi v každej fáze projektu.
  • Nebuďte chamtiví - zdieľajte svoje komponenty na GitHub.

Ak nájdete preklep, vyberte ho a stlačte Ctrl + Enter! Môžete nás kontaktovať.

"Tu sa však pozeráme späť, ale nezostávame stáť na mieste. Snažíme sa vpred, otvárame nové cesty, berieme nové veci, pretože sme zvedaví ... a zvedavosť nás ženie po nových cestách. Iba vpred."" (Walt Disney)

O technológii animácie

Niekedy medzi mnou a zákazníkom dôjde k nedorozumeniu, keď dôjde k dohode o technických vlastnostiach budúcich animovaných diel. Tento článok vám pomôže lepšie pochopiť problémy s technológiou animácie.

Na úvod by som chcel, aby som sa nenechal zmiasť, zdôrazniť 3 hlavné kritériá, podľa ktorých je možné posúdiť animáciu: typy animácie, metódy animácie a štýly animácie. Pre mnohých je to to isté, ale nie je to tak! Typom animácie je spôsob alebo forma zobrazenia karikatúry (nakreslená, bábková atď.). Animačné techniky sú technické prvky, pomocou ktorých sa animácia vytvára (animácia po snímkach, programovateľná animácia atď.). A nakoniec, štýl animácie je umelecká technika, ktorá sa používa v animácii (realizmus, anime atď.). V tomto článku sa bližšie pozriem na koncept „zobrazení animácie“ a potom k tomu pridám „metódy“ a „štýly“. To všetko dohromady je technológia animácie.

Ručne kreslená klasická animácia.

Jedným z najzaujímavejších a najbežnejších typov animácie je takzvaná klasická animácia. Klasická animácia sa vykonáva nakreslením na každý priehľadný film (alebo pauzovací papier). Potom sa tieto snímky zhromaždia v špeciálnom editovacom programe. Táto animácia je veľmi živá, plynulá, priestorová, ale drahá))). Príkladom takejto animácie môžu byť karikatúry štúdia Disney a filmu Sojuzmultfilm.

Stále z karikatúry „Snehulienka a sedem trpaslíkov“ od Disney Studios

Crossoverová animácia.

Najstarší typ animácie. Podstata tohto typu animácie spočíva v tom, že objekt nakreslený na kartóne alebo papieri sa rozreže na samostatné kúsky a tieto kúsky sa posúvajú (posúvajú) od rámu k rámu. Odtiaľ pochádza aj názov - nové kladenie! Mnoho ľudí považuje tento druh animácie za primitívny, ale v správnych rukách sa takéto karikatúry môžu ukázať ako veľmi zaujímavé. Karikatúru „Ježek v hmle“ režiséra Jurija Norshteina možno označiť za jeden z najvýraznejších príkladov reverzibilnej animácie. „Hedgehog in the Fog“ bolo svetovým spoločenstvom uznané ako NAJLEPŠÍ KARTÓN VŠETKÝCH ČASTÍ A ĽUDÍ !!! Toľko prevod ... Toľko primitív ...

Stále z karikatúry „Ježek v hmle“, ktorú režíroval Yuri Norshtein

Maľba na sklo.

Ale tu animácia určite nie je primitívna! Podstatou takejto animácie je maľba olejovými farbami na sklo. Každý rám je zároveň malebným obrázkom, ktorý je upravený ťahmi umelca. Pozoruhodným príkladom takejto animácie je dielo Alexandra Petrova „Starec a more“, ktoré bolo ocenené „Oscarom“.


Stále z animovaného filmu „Starec a more“ režiséra Alexandra Petrova.

Bábková animácia.

Rovnaká stará animácia. Všetky bábiky a ozdoby v bábkovej animácii sú vyrobené ručne, takže sú rovnako drahé ako klasická animácia. Napriek tomu je tento typ animácie veľmi populárny aj v súčasnosti (napriek rozšíreniu 3D počítačovej animácie). Úprimne povedané, ako dieťa som nemal rád bábkovú animáciu))) Ale moje zjavenie prišlo, keď som uvidel karikatúru Toma Burtona „Nočná mora pred Vianocami“.


Stále z karikatúry „Nočná mora pred Vianocami“ režiséra Toma Burtona.

Animácia z plastelíny

Názov animácia plastelíny hovorí za všetko. Iba dodám, že plastelínová animácia vyšla z bábkovej animácie a stala sa populárnou v Rusku po objavení sa kreslených filmov „Padá sneh z minulého roka“ v réžii Alexandra Tatarského.


Stále z karikatúry „Padal sneh minulého roka“ v réžii A. Tatarského.

Počítačová 2D animácia.

Či sa nám to páči alebo nie, staré typy animácií sa nahrádzajú novými. Z nejakého dôvodu je zvykom nazývať počítačovú 2D animáciu Flash animáciou a nie je to tak úplne pravda. Flash je iba jeden program. Môžete pomenovať ďalšie výkonné počítačové programy na vytváranie 2D animácií, napríklad: After Effect, Anime Studi Pro, Toon Boom Studio a mnoho ďalších platených a bezplatných programov. V súčasnosti sa takmer všetky štúdiá zaoberajú počítačovou 2D animáciou. Je to presne ten druh animácie, ktorý dnes vidíme v televíznych seriáloch, na internete, v bežných počítačových hrách atď.


Stále z animovanej série „The Simsons“

3D animácie.

3D animácia - druh animácie vytvorenej na základe počítačových 3D programov. Toto je najmladší a najsľubnejší typ animácie. S rozvojom výpočtovej techniky sa stalo možné nielen kresliť grafiku a animáciu v dvojrozmernej rovine (2D animácia), ale aj animovať trojrozmerné formy. Táto technológia je veľmi zložitá, ale ak to stručne poviete, výrobný proces vyzerá asi takto. Najskôr sa (akýmkoľvek spôsobom) nakreslí koncepčné umenie, na základe týchto výkresov sa vytvorí trojrozmerná geometria modelu. Potom textúry, ktoré zapadajú nad tvar postavy alebo objektu. Ďalej vytvorte kosti objektu a pripevnite ich k tvaru, aby sa tvar mohol pohybovať. Animátori dostanú pripravený model na pohyb a začnú ho animovať. Čím lepšie je model pripravený, tým sú jeho pohyby prirodzenejšie a pružnejšie. Po vytvorení animácie sa scéna vykreslí (preloží z 3D do bežného obrázka). Pozoruhodným príkladom takejto animácie sú karikatúry štúdia Pixar.


Stále z karikatúry „Ratatouille“ od štúdia Pixar.

Kombinovaná animácia.

Kompozitná animácia je kombináciou ľubovoľného typu animácie s videom. Skorými príkladmi takejto animácie môžu byť: film „Who Framed Roger Rabbit“, karikatúra „The Adventure of Captain Vrungel“ atď. S rozvojom 3D technológie a špeciálnymi počítačovými efektmi sa tento typ animácie nachádza v hraných filmoch viac a častejšie. Hlavnou črtou modernej kombinovanej animácie je jej úplná realita.


Stále z filmu „Jurský svet“ režiséra Stevena Spielberga

Iné typy animácie.

Okrem uvedených typov animácie existujú aj ďalšie, napríklad: piesková animácia, laserová animácia, foto animácia, ihlová animácia atď. Tieto typy sú však považované za menej populárne a v tomto článku som si dovolil ich len spomenúť.

Typy animácií v štúdiu Cardboard Tower.

Naše animačné štúdio sa špecializuje na výrobu počítačovej 2D animácie. Vďaka flexibilným možnostiam počítačových programov môžeme vytvárať crossover aj klasickú animáciu súčasne. Sme tiež schopní vytvárať a 3D animácie. Ako príklad si môžete pozrieť 3 videá z nášho portfólia:

1. Počítačová 2D animácia klasickým spôsobom.

3D Studio MAX implementuje pokročilé možnosti ovládania animácie, ukladá históriu života každého objektu, umožňuje vám vytvárať rôzne svetelné efekty a má otvorenú architektúru, to znamená, že umožňuje tretím stranám zahrnúť do systému ďalšie aplikácie.

TrueSpace - balík od Caligari určený pre 3D animáciu a vyznačuje sa ľahkým používaním, flexibilitou pri ovládaní tvaru, podporou splajnov a booleovských operácií s objektmi. Inovatívne rozhranie zobrazuje panely nástrojov priamo v 3D priestore a zarovnáva ich k objektu. Rozšírenia a otvorenosť architektúry vám umožňujú zvýšiť možnosti balíka.

Štúdio Ray Dream Studio poskytuje sadu profesionálnych nástrojov pre 3D návrh a animáciu. Používatelia môžu vytvárať rôzne modely pomocou logických operácií a deformácií. Tieto modely je možné aplikovať na rôzne textúry alebo videozáznamy a tiež ich natrieť priamo na ich povrch.

Existuje mnoho softvérových produktov na strih videa. Okrem balíčkov 3D animácií existujú vysoko špecializované programy, napríklad na vytváranie objemových písiem. Používajú tiež rôzne animačné efekty, vykresľujú obrázky a vytvárajú video súbory. Niektoré z nich sú uvedené nižšie.

Adobe Premiere je najbežnejšie používaný softvér na úpravu digitálneho videa. Má pohodlné a intuitívne rozhranie. Podporuje viac video a audio kanálov, obsahuje sadu prechodov medzi snímkami, umožňuje synchronizáciu zvuku a obrazu. Podporuje súbory MOV a AVI. Pripojenie ďalších modulov od výrobcov tretích strán rozširuje možnosti programu.

Speed ​​Razor SE je program s praktickým užívateľské rozhranie... Vďaka pokročilým nástrojom na prácu s obrazovými a zvukovými kanálmi je Speed ​​Razor vhodný na použitie v projektoch so zložitým zložením a prekrytiami. Obsahuje sadu bežne používaných špeciálnych efektov, rezanie na tupo (priame lepenie) sa vykonáva v

v reálnom čase. Multimediálne projekty vytvorené pomocou tohto programu je možné zaznamenávať na video, CD-ROM alebo zverejňovať na webových stránkach.

Ulead VideoStudio je program určený pre začínajúcich používateľov. Ponúka plnú podporu digitálnych video formátov DV a MPEG-2. Pre zvukovú stopu filmu môžete použiť hudobné súbory MP3 alebo zvukové stopy zo zvukového CD. Práca s programom je vďaka dobre premyslenému a priateľskému rozhraniu pomerne jednoduchá. Do videa môžete vkladať tituly, využívať plynulé prechody medzi jednotlivými fragmentmi a do výsledného klipu pridať hudbu alebo hudbu na pozadí.

COOL 3D je program na vytváranie 3D titulov pre prezentácie, videá, multimédiá a webové stránky od spoločnosti Ulead. Program obsahuje viac ako 100 automatických sprievodcov, mnoho efektov, ktoré výrazne zjednodušujú modelovanie a vykreslenie výslednej scény. Obsahuje tiež obrovskú knižnicu 3D objektov a materiálov a fotorealistické šablóny a textúry.

Programy pre prácu so zvukom možno zhruba rozdeliť do dvoch veľkých skupín: programy sekvencera a programy zamerané na technológie digitálneho záznamu zvuku, takzvané zvukové editory.

Sekvencery slúžia na tvorbu hudby. Sekvencery sa používajú na kódovanie hudobných diel. Používajú sa na usporiadanie, ktoré vám umožňuje „predpísať“ jednotlivé časti, priradiť tóniny nástroja, zostaviť úrovne a vyváženie kanálov (stôp), predstaviť hudobné úpravy (akcenty hlasitosti, časový posun, odchýlky od ladenia, modulácia atď.). Na rozdiel od bežného komponovania hudby si efektívne využitie sekvenceru vyžaduje špeciálne inžinierske znalosti od aranžéra skladateľa.

Programy zvukového editora vám umožňujú zaznamenávať zvuk v reálnom čase na pevný disk počítača a prevádzať ho pomocou digitálneho spracovania a kombinácie rôznych kanálov.

Zvážme niektoré programy na prácu so zvukom.

Cakewalk Pro Audio je profesionálny viacstopový sekvencer od spoločnosti Twelve Tone Systems, ktorý je populárny medzi profesionálmi. Cakewalk bol jedným z prvých softvérových produktov, ktoré poskytovali podporu pre ďalšie zásuvné moduly pre rôzne zvukové efekty vytvorené pre rozhranie DirectX. Charakteristickým rysom efektov DirectX je, že všetky pracujú v reálnom čase a všetky parametre zvoleného efektu môžete upraviť priamo počas prehrávania zvukového fragmentu.

Logic Audio Platinum je profesionálny radič od spoločnosti Emagic. Poskytuje podporu DirectX, spracovanie v reálnom čase, dokáže pracovať s viacerými zvukovými kartami. Umožňuje vám tiež nahrávať a digitálne spracovávať zvuk.

Sound Forge je program, ktorý je jedným z lídrov medzi zvukovými editormi. Má výkonné funkcie úprav, umožňuje vložiť všetky doplnky, ktoré podporujú technológiu DirectX, má pohodlné moderné rozhranie a podporuje moderné zvukové formáty vrátane RealAudio.

CoolEdit Pro je profesionálne nahrávacie štúdio od spoločnosti Syntrillium Software. Umožňuje vám nahrávať zvuk cez zvukovú kartu z mikrofónu, CD prehrávača alebo iného zdroja, čítať a zapisovať súbory v populárnom formáte MP3, upravovať výsledné zvukové súbory a pridávať k nim rôzne fantastické efekty. Poskytuje prácu s multimediálnymi stránkami.

Po vytvorení všetkých multimediálnych komponentov je potrebné ich skombinovať do jednej multimediálnej aplikácie. To vyvoláva problém výberu softvérového nástroja na jeho vývoj. Existujúce spôsoby kombinovania rôznych multimediálnych komponentov do jedného produktu možno podmienene rozdeliť do troch skupín:

  • algoritmické jazyky na priamy vývoj riadiaceho programu;
  • špecializované programy na tvorbu prezentácií a ich publikovanie na internete (rýchla príprava multimediálnych aplikácií);
  • tvorba multimediálnych nástrojov.

Výber nástroja spravidla vychádza z požiadaviek na efektívnosť multimediálnej aplikácie a rýchlosti jej vývoja. Dôležitou vlastnosťou je miera interakcie používateľa. Špecializované prezentačné programy sú zamerané predovšetkým na prenos informácií z počítača k používateľovi. Nástroje na tvorbu obsahu umožňujú vysoký stupeň interakcie a vytvárajú skutočne interaktívnu aplikáciu.

Najjednoduchšie a najrýchlejšie je použitie prezentačného softvéru, ktorého schopnosti v niektorých prípadoch postačujú na vytvorenie jednoduchej multimediálnej aplikácie. Autorské systémy sú určené na vytváranie softvérových produktov s vysokou mierou interakcie používateľa a ponúkajú špeciálny skriptovací jazyk pre vývoj používateľského rozhrania. Umožňujú vám vytvoriť konečný produkt, ktorý spája všetky multimediálne komponenty v jednom riadiacom programe. Jeho charakteristickou črtou je prítomnosť spoločného rozhrania, ktoré vám umožňuje vybrať ktorúkoľvek z multimediálnych komponentov, spustiť ich na vykonanie (počúvať zvukový súbor alebo sledovať video), organizovať hľadanie požadovaného objektu atď.

Prezentačný softvér, ktorý bol pôvodne navrhnutý na vytváranie elektronických diapozitívov na ilustráciu správy prezentujúceho, sa v poslednej dobe viac orientuje na multimédiá. Existuje veľké množstvo takýchto programov, ktoré sa líšia v množine vizuálnych a animačných efektov, niektoré z nich sú uvedené nižšie.

Power Point je prezentačný program zahrnutý v balíku Microsoft Office. Z hľadiska počtu vizuálnych a animačných efektov nie je horší ako mnohé autorské multimediálne nástroje. Obsahuje nástroje na vytváranie flexibilných prezentačných scenárov a nahrávanie zvukových stôp pre každú snímku. Prítomnosť ruskej jazykovej verzie vám umožňuje úspešne pracovať s textami v ruštine. Vstavaná webová podpora vám umožňuje ukladať prezentácie vo formáte HTML, ale animované komponenty vyžadujú inštaláciu vyhradeného doplnku PowerPoint