Animácia videohier na interaktívnej tabuli - Bézierova cesta
V tomto návode budeme pokračovať v zostavovaní jednoduchého videa na interaktívnej tabuli v aplikácii MotionR, Ďalším krokom je nakreslenie Bezierovej cesty, ktorá je základom animácie.

Nakreslíte Bézierovu cestu, ktorá bude riadiť pohyb ruky. Duplikát tejto Bezierovej cesty sa použije na vytvorenie masky, ktorá zakryje grafiku, ktorá sa nakresľuje na obrazovku, a odhalí ju, keď rameno prechádza. Pretože maska ​​je vytvorená z duplikátu Bezierovej cesty, ktorú bude nasledovať ruka, výsledkom je simulácia kresby rukou na obrazovke.

Predtým, ako nakreslíme Bezierovu cestu, musíme upraviť kotviaci bod grafiky Hand. V predvolenom nastavení Motion umiestni kotviaci bod do stredu grafiky. Tento kotviaci bod však bude nasledovať cestu. Nechceme, aby sa stred ruky kreslil na obrazovku. Chceme, aby sa špica ceruzky nakreslila na obrazovku. Opravme to.

  1. Vyberte ručnú grafiku a potom vyberte nástroj Anchor Point. Pomocou červenej a modrej šípky umiestnite kotviaci bod nad špičku ceruzky.

    Teraz sa dostávame k tejto dobrej časti.

  2. Vyberte ručnú grafickú vrstvu a potom vyberte nástroj Bézier. Prvý bod Bézierovho bodu umiestnite na koniec ceruzky. Ďalej prejdite na logo a nakreslite kľukatú cestu cez logo. Nakoniec sa vráťte do ruky a pridajte posledný bod. Nezatvárajte cestu.

  3. Ak chcete Motionovi povedať, že ste dokončili kreslenie Bézierovej cesty, vyberte nástroj pre výber / transformáciu. Na paneli Vrstvy získate novú vrstvu Bezier. Presuňte túto novú vrstvu pod vrstvu Ručné a premenujte ju na „Bezier_Logo“, pretože toto je Bezierova cesta na kreslenie obrázka loga.

    Teraz, keď máme Bezierovu cestu, môžeme do grafiky Hand pridať správanie Motion Path. Toto správanie spôsobí animáciu ruky. Chceme však, aby ruka nasledovala cestu Bezier_Logo. Takže povieme Motion, aby pre toto správanie Motion Path použil cestu Bezier_Logo.

  4. Ak chcete pridať správanie do ručnej grafiky, vyberte vrstvu ručnej grafiky na table Vrstvy. Z ponuky Správanie v pravom dolnom rohu vyberte položku Cesta pohybu. Pod vrstvou Hand sa zobrazí nová vrstva Motion Path.

  5. Vyberte vrstvu Pohybová cesta a prejdite na Inšpektor (Inšpektor - Správanie - Pohybová cesta). Nastavte ponuku Tvar cesty na Geometria. Zrušte začiarknutie možnosti Pripojiť k tvaru. Vráťte sa späť do vrstvy Bezier_Logo na table Vrstvy a kliknite / potiahnite myšou smerom k zdroju tvaru. Keď uvidíte malú šípku, uvoľnite myš.

    Ak je hracia hlava stále na prvom zábere, vyskúšajte animáciu. Ak ceruzka priamo nenasleduje cestu, podľa potreby upravte kotviaci bod na špičke ceruzky.

    Vyzerá to tak, že ruka kreslí trochu až pomaly pri animácii na tabuli? Môžeme to zrýchliť skrátením tratí Motion Path a Bezier_Logo v časovej osi.

  6. Prejdite na časovú os a nájdite purpurovo sfarbenú stopu pohybu. Potiahnite pravý okraj k ceste cesty doľava, až kým nebude na druhej druhej pozícii na časovej osi (02:00). Tento postup zopakujte pre skladbu Bezier_Logo.

OK, je čas na prestávku na kávu. V nasledujúcom návode vytvoríme masku, na ktorej bude logo.

← Späť | Ďalej →

Príklad výučby:


Apple, Motion, Autor iBooks, GarageBand, TextEdit, Pages, iMovie a Mac sú ochranné známky spoločnosti Apple Inc. registrované v USA a ďalších krajinách.
CoffeBreakBlog je nezávislá publikácia a nebola autorizovaná, sponzorovaná alebo inak schválená spoločnosťou Apple Inc. Snímky obrazovky použité na základe súhlasu.
Copyright 2018 Adobe Systems Incorporated. Všetky práva vyhradené. Snímky obrazovky produktov spoločnosti Adobe znova vytlačené so súhlasom spoločnosti Adobe Systems Incorporated. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst a Flash Paper je / sú [a] registrované ochranné známky alebo ochranné známky spoločnosti Adobe Systems Incorporated v USA a / alebo iných krajinách.