Движение текста на модификаторах
Добавлено: 05.12.2010, 04:08
Хотел попроще и понагляднее, а получилось... модификаторы на одной строке посложнее, чем в блоке Star Wars...
правда, всего на четырёх цифрах - 2010 (для начала).
Цель урока - создать синхронное движение числа "2010" в "перспективе" с помощью модификаторов.
Для чего нам необходимы четыри отдельных текстовых строки, спозиционированных в одну линию
по оси "Х", т.е. - горизонтально. Напомню, что координатная ось для текста, в отличии от изображений,
расположена не в центре, а в левом верхнем углу с нулевой точкой. Её положительные оси расположены
по левому и верхнему краям экрана.
Проект
На закладке "Надпись" устанавливаете параметры для текста по умолчанию, кроме выравнивания -
оно должно быть по центру, шрифт Arial размер 130 pt. Добавляете в первую строку цифру 2 и
несколькими пробелами после неё - сдвигаете цифру 2 к левому краю. Остановимся пока на одной
строке с цифрой 2, "отработаем" на ней все необходимые модификаторы, а затем продублируем
три раза - с небольшой коррекцией позиционирования в дубликатах.
Специально приготовил для урока сетку перспективы, линии которой будем использовать, как
направляющие для движения цифр. Модификаторы применим к размеру шрифта и панорамированию
по "Y" - движению по вертикали. Нам нужно получить равномерное линейное
движение цифры 2 от нижнего края к верхнему и равномерное уменьшение размера шрифта.
Для этой цели воспользуемся функциональным значением модификатора - "Линейное нарастание".
Из контекстного меню для панорамирования по "Y" выбираем "Добавить модификатор",
в открывшемся окне добавим к модификатору постоянное значение, равное 55, в сумме с
начальным значением 50 - мы получим стартовую позицию цифры 2 по оси "Y" на отметке 105,
т.е. - немного ниже нижнего края экрана. Затем добавляем ещё одно действие модификатора,
выбираем для него значение из функции "Линейное нарастание" со значением равным 20 и
старт с КК.
Примечание: Как-то уже говорил, что главное, при работе с модификаторами -
научиться "читать график диаграммы", цветные линии под окном просмотра справа. Чтобы визуально
представлять по этим линиям характер и направление движения или коррекцию.
Оранжевая линия, на графике диаграммы модификатора справа, отображает прямую - с исходной
точкой со значением 105 (нижний край экрана) и пересекает верхний край экрана (нулевую отметку)
незадолго после начала исходящего перехода.
Таким-же образом добавляем функциональное значение модификатора "Линейное нарастание" для
уменьшения размера шрифта, при движении цифры 2 к верхнему краю экрана, со значением равным 18
и стартуем так-же с КК (нам нужно это значение вычесть из модификатора, поэтому можно переключить
тип действия на вычитание из модификатора или поставить отрицательное значение -18, при прибавлении к
модификатору - что практически одно и тоже). Таким образом, мы получили линейное движение цифры 2
от нижнего к верхнему краю экрана, с одновременным уменьшением размера шрифта - что уже похоже
на движение "в перспективе".
Можно было-бы на этом и остановится, но есть кое-какие шероховатости:
- наклон цифр в центре (01) не соответствует направляющим линиям сетки перспективы на всём участке движения
- движение цифр - ускоренное (за счёт суммирования движения по вертикали и уменьшения шрифта, влияющего
на скорость линейного движения), а нужно - близкое к равномерному.
Первый вопрос решить достаточно просто - корректируем наклон цифр во втором КК, второй - посложнее.
Для придания равномерного линейного движения цифре на всём протяжении - необходимо
подключить к модификаторам дополнительные действия. На графике диаграммы движение
и уменьшение шрифта отображены прямой оранжевой линией. Их нужно слегка "прогнуть вниз", что даст
нам в итоге для движения - равномерность, для размера шрифта - корректировку "сведения" направления
движения по направляющим сетки перспективы к верхней границе. Применим для этой цели дополнительное
действие к модификаторам, со значением функции "Квадратичная кривая", как показано на скринах ниже.
Теперь остаётся только продублировать эту строку три раза и с помощью добавления/удаления пробелов
с нужных сторон от цифры в каждой строке - расположить оставшиеся цифры равномерно по всей ширине
экрана. Для лучшего контроля, при изменении количества пробелов в строках и положения на экране цифр -
используйте сетку окна просмотра на закладке "Надписи" и главное окно просмотра редактора, установив
бегунок воспроизведения в нужное положение для видимости всей строки. Обратите так-же внимание, что
характер движения для строк выбран "Ускоренный". Два символа в самом верху списка строк - добавлены
для затенения границ появления и скрытия двигающейся строки (заполнены градиентом).
Попозже добавлю к этой строке появление ещё одной, с описАнием необходимых действий.
Продолжение урока...
Проект (продолжение+начало)
К имеющейся уже строке "2010", двигающейся в перспективе, добавим вторую двигающуюся строку
"С наступающим Новым 2011 Годом!". Наша цель - синхронизировать движение строк в одной перспективе.
Принцип построения строки для перспективы и применённые модификаторы - одинаковы с уже подробно
опИсанным выше примером для цифр... поэтому, остановимся только на некоторых специфичных
моментах.
Нам нужно "разбить строку" на 7 частей - для возможности применения разных наклонов к каждой части.
Для наглядного представления и выбора точек разделения строки - добавим вспомогательную строку
"С наступающим Новым 2011 Годом!" и разделим вспомогательную сетку в окнах просмотра в соотношении
6х3. Размер шрифта Arial 24 pt., выравнивание по центру, начальная позиция X=50, Y=50.
Мы получили 7 групп букв - из которых, в итоге, будут состоять 7 отдельных строк с таким-же позиционированием,
как и во вспомогательной строке (её можно теперь отключить).
Далее - по отработанной схеме... добавляем новую строку, пишем в ней 1-ю часть с нужным количеством пробелов
справа ("С наст "), устанавливаем наклон вправо 70° и добавляем модификатор сначала к движению по "Y",
затем - для уменьшения размера шрифта. Меняя величину значений модификаторов "Линейное нарастание" и
"Квадратичная кривая" добиваемся "скольжения" части текста по левой направляющей сетки перспективы.
Аналогично первому примеру с цифрами - дублируем строку шесть раз (по количеству ещё
оставшихся частей текста строки), корректируем положение по горизонтали с помощью пробелов
и наклон букв (по направляющим линиям сетки перспективы) и... строка побежала.
правда, всего на четырёх цифрах - 2010 (для начала).
Цель урока - создать синхронное движение числа "2010" в "перспективе" с помощью модификаторов.
Для чего нам необходимы четыри отдельных текстовых строки, спозиционированных в одну линию
по оси "Х", т.е. - горизонтально. Напомню, что координатная ось для текста, в отличии от изображений,
расположена не в центре, а в левом верхнем углу с нулевой точкой. Её положительные оси расположены
по левому и верхнему краям экрана.
Проект
На закладке "Надпись" устанавливаете параметры для текста по умолчанию, кроме выравнивания -
оно должно быть по центру, шрифт Arial размер 130 pt. Добавляете в первую строку цифру 2 и
несколькими пробелами после неё - сдвигаете цифру 2 к левому краю. Остановимся пока на одной
строке с цифрой 2, "отработаем" на ней все необходимые модификаторы, а затем продублируем
три раза - с небольшой коррекцией позиционирования в дубликатах.
Специально приготовил для урока сетку перспективы, линии которой будем использовать, как
направляющие для движения цифр. Модификаторы применим к размеру шрифта и панорамированию
по "Y" - движению по вертикали. Нам нужно получить равномерное линейное
движение цифры 2 от нижнего края к верхнему и равномерное уменьшение размера шрифта.
Для этой цели воспользуемся функциональным значением модификатора - "Линейное нарастание".
Из контекстного меню для панорамирования по "Y" выбираем "Добавить модификатор",
в открывшемся окне добавим к модификатору постоянное значение, равное 55, в сумме с
начальным значением 50 - мы получим стартовую позицию цифры 2 по оси "Y" на отметке 105,
т.е. - немного ниже нижнего края экрана. Затем добавляем ещё одно действие модификатора,
выбираем для него значение из функции "Линейное нарастание" со значением равным 20 и
старт с КК.
Примечание: Как-то уже говорил, что главное, при работе с модификаторами -
научиться "читать график диаграммы", цветные линии под окном просмотра справа. Чтобы визуально
представлять по этим линиям характер и направление движения или коррекцию.
Оранжевая линия, на графике диаграммы модификатора справа, отображает прямую - с исходной
точкой со значением 105 (нижний край экрана) и пересекает верхний край экрана (нулевую отметку)
незадолго после начала исходящего перехода.
Таким-же образом добавляем функциональное значение модификатора "Линейное нарастание" для
уменьшения размера шрифта, при движении цифры 2 к верхнему краю экрана, со значением равным 18
и стартуем так-же с КК (нам нужно это значение вычесть из модификатора, поэтому можно переключить
тип действия на вычитание из модификатора или поставить отрицательное значение -18, при прибавлении к
модификатору - что практически одно и тоже). Таким образом, мы получили линейное движение цифры 2
от нижнего к верхнему краю экрана, с одновременным уменьшением размера шрифта - что уже похоже
на движение "в перспективе".
Можно было-бы на этом и остановится, но есть кое-какие шероховатости:
- наклон цифр в центре (01) не соответствует направляющим линиям сетки перспективы на всём участке движения
- движение цифр - ускоренное (за счёт суммирования движения по вертикали и уменьшения шрифта, влияющего
на скорость линейного движения), а нужно - близкое к равномерному.
Первый вопрос решить достаточно просто - корректируем наклон цифр во втором КК, второй - посложнее.
Для придания равномерного линейного движения цифре на всём протяжении - необходимо
подключить к модификаторам дополнительные действия. На графике диаграммы движение
и уменьшение шрифта отображены прямой оранжевой линией. Их нужно слегка "прогнуть вниз", что даст
нам в итоге для движения - равномерность, для размера шрифта - корректировку "сведения" направления
движения по направляющим сетки перспективы к верхней границе. Применим для этой цели дополнительное
действие к модификаторам, со значением функции "Квадратичная кривая", как показано на скринах ниже.
Теперь остаётся только продублировать эту строку три раза и с помощью добавления/удаления пробелов
с нужных сторон от цифры в каждой строке - расположить оставшиеся цифры равномерно по всей ширине
экрана. Для лучшего контроля, при изменении количества пробелов в строках и положения на экране цифр -
используйте сетку окна просмотра на закладке "Надписи" и главное окно просмотра редактора, установив
бегунок воспроизведения в нужное положение для видимости всей строки. Обратите так-же внимание, что
характер движения для строк выбран "Ускоренный". Два символа в самом верху списка строк - добавлены
для затенения границ появления и скрытия двигающейся строки (заполнены градиентом).
Попозже добавлю к этой строке появление ещё одной, с описАнием необходимых действий.
Продолжение урока...
Проект (продолжение+начало)
К имеющейся уже строке "2010", двигающейся в перспективе, добавим вторую двигающуюся строку
"С наступающим Новым 2011 Годом!". Наша цель - синхронизировать движение строк в одной перспективе.
Принцип построения строки для перспективы и применённые модификаторы - одинаковы с уже подробно
опИсанным выше примером для цифр... поэтому, остановимся только на некоторых специфичных
моментах.
Нам нужно "разбить строку" на 7 частей - для возможности применения разных наклонов к каждой части.
Для наглядного представления и выбора точек разделения строки - добавим вспомогательную строку
"С наступающим Новым 2011 Годом!" и разделим вспомогательную сетку в окнах просмотра в соотношении
6х3. Размер шрифта Arial 24 pt., выравнивание по центру, начальная позиция X=50, Y=50.
Мы получили 7 групп букв - из которых, в итоге, будут состоять 7 отдельных строк с таким-же позиционированием,
как и во вспомогательной строке (её можно теперь отключить).
Далее - по отработанной схеме... добавляем новую строку, пишем в ней 1-ю часть с нужным количеством пробелов
справа ("С наст "), устанавливаем наклон вправо 70° и добавляем модификатор сначала к движению по "Y",
затем - для уменьшения размера шрифта. Меняя величину значений модификаторов "Линейное нарастание" и
"Квадратичная кривая" добиваемся "скольжения" части текста по левой направляющей сетки перспективы.
Аналогично первому примеру с цифрами - дублируем строку шесть раз (по количеству ещё
оставшихся частей текста строки), корректируем положение по горизонтали с помощью пробелов
и наклон букв (по направляющим линиям сетки перспективы) и... строка побежала.