Анімовані пальми з растрової графіки

• Квітня 16, 2024

У наступних двох навчальних посібниках ми будемо анімувати пальми у Flash^R CS5. Це було частиною анімації Flash-картки, яку я створила для карт Pamela Gladding Ecards. Творчість була Луїза Макс, одна з художниць P E Eards. Памела придумала анімаційну розкладку для цієї листівки, і одним із перших завдань було оживити дві пальми на пляжі. Ця анімація триватиме протягом усієї анімації на листівці, а також після закінчення карти.

Я не бачив пальми, тому зайшов до Google і шукав відео пальм, що рухаються за вітром. Перше, що ви помітите, це те, що, якщо це не ураган, стовбур пальми рухається дуже мало. Вся дія - в долонях, які витончено гойдаються на вітрі.

Коли картину для листівки мені надіслали електронною поштою у багатошаровому файлі Photoshop, долоні пальми було скопійовано (все в один шматок) з фону і розміщено на прозорому шарі. Отже, у нас був фоновий шар, який містив все (небо, пісок та дерева) та шар із групою долонь.

У цей момент єдиним способом оживити долоні було б повернути групу долонь у шарі між рівнем тла. Однак це не виглядало б занадто реалістично. По-перше, початкова група долонь, яка все ще знаходиться у фоновому шарі, покаже, як шар долоні обертається. По-друге, у реальному житті кожна долоня рухається окремо, а не разом, як група.

Оскільки анімаційні картки для картки P G створені з растрової графіки, можливості анімації обмежені порівняно з анімацією за допомогою вастер. Тож будь-який спосіб, коли ми можемо зробити одну частину анімації більш реалістичною, допоможе загальному враженню, яке створює листівка.

Ми можемо створити більш реалістичну анімацію, переміщаючи кожну долоню самостійно. Тому першим завданням було виділити кожну з долонь і розмістити їх на власному прозорому шарі. Один з трюків, який я використовував протягом багатьох років, - це збільшити масштаб, щоб збільшити область, яку ви хочете вибрати, і використовувати інструмент Полігональний Лассо. Оскільки кольори в долонях настільки схожі, це працює краще, ніж інструмент швидкого вибору.

Як бачите, оригінальна група долонь обрізана вгорі. Цей прямий край буде проблемою, коли долоні анімовані, показуючи відсутні ділянки долонь під час обертання. Отже, наступним нашим кроком було використання окремих частин долоні, які ми маємо в наявності для заповнення пропущеної секунди цих верхніх долонь.

Нарешті, для фонового зображення ми хочемо зняти долоні та заповнити порожні отвори на небі, створені, коли ми видалили долоні з фону. Оскільки небо є майже суцільним кольором, ми можемо використовувати Content Aware Fill для легкої заміни відсутнього неба.

Тепер ми готові оживити долоні.

Далі →

Переглянути готові листівки на картках Pamela Gladding

Авторські права 2018 Adobe Systems Incorporated. Всі права захищені. Знімки екрана продуктів Adobe передруковані з дозволу Adobe Systems Incorporated. Adobe, Photoshop, альбом Photoshop, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst та Flash Paper є або є [a] зареєстрованою торговою маркою (ими), або торговою маркою (іми) Adobe Systems Incorporated у США та / або інших країнах.

Відео Інструкція: Делаю графику и анимацию для игр за 5 минут / Рисование и создание игр на Unity (Квітня 2024).