Въведение в анимацията с Hype Record
Hype има много приятна функция за начинаещия аниматор, наречена запис функция. За да използвате тази функция, просто щракнете върху големия червен бутон Запис. Това ще направим в този урок.

Както научихме, за да създадем анимация, се нуждаем само от рамка за старт и стоп. Например, за да намалим размера на правоъгълник, докато той се движи по екрана, бихме казали Hype на кой кадър да започне анимацията и на кой кадър да спре. Тъй като ние работим с анимация, базирана на времева линия, можем да говорим с Hype, като използваме ключови кадри на времевата линия. И вие се досетихте, ние ще поставим тези ключови рамки на тези две специални рамки за стартиране и спиране.

Когато Hype вижда ключов кадър, той отбелязва свойствата на обект, като правоъгълник, на екрана. Само някои от свойствата, които Hype ще отбележи, са непрозрачност, оригинал наляво, оригинал вдясно, височина на размера и ширина на размера. Тези свойства съответстват на свойствата на CSS стил в документ HTML5. Hype съхранява стойностите на тези свойства заедно със съответната позиция или рамка на времевата линия.

Първата ни стъпка в създаването на тази примерна анимация е да кажем на Hype какъв размер да направим правоъгълника и къде да го поставим на екрана в началото и в края на анимацията. Всичко това можем да направим с бутона Запис.

  1. Щракнете върху File - New, за да стартирате нов документ в Hype, като използвате настройките по подразбиране.

    Нека добавим правоъгълника към екрана.

  2. Щракнете върху иконата Elements в лентата с инструменти и изберете правоъгълник. Hype ще постави нов правоъгълник в центъра на екрана.

    Нека поставим правоъгълника там, където искаме да бъде в началото на анимацията. Ще запазим размера по подразбиране, така че всичко, което трябва да направим, е да преместим правоъгълника.

  3. Плъзнете правоъгълника към левия ръб на екрана.

  4. Обърнете внимание на инспектора по метрика. Правоъгълникът вече е 7 пиксела от левия ръб и 149 пиксела от горния ръб. Също така, тя е 102 x 102 пиксела.

Сега искаме правоъгълникът да се придвижи към десния ръб и да намали 50%. Също така искаме това да се случи в рамките на само 30 кадъра. Нека разкажем Hype тази информация чрез функцията Запис в следващия урок.

продължи


Инструкции Видео: Imagine Dragons - Natural (Lyrics) (Април 2024).