В КУРСЕ?

Разбираемся в теме

Одинаковый путь за одинаковое время: почему одна анимация выглядит резче другой?

Два объекта могут пройти сто условных единиц за одинаковое время, но двигаться по-разному. Один перемещается равномерно, другой начинает медленно и разгоняется, третий постепенно останавливается. Начальная и конечная точки совпадают, а впечатление от движения отличается. Чтобы увидеть причину, удобно рассмотреть положения объекта через равные промежутки времени ещё до работы в программе.

Конечные точки не описывают всё движение

Представим пять моментов наблюдения и положения ноль, двадцать пять, пятьдесят, семьдесят пять и сто. Между соседними моментами объект каждый раз проходит двадцать пять единиц. Если интервалы времени равны, это равномерное движение. Теперь возьмём положения ноль, десять, тридцать, шестьдесят и сто. Последовательные перемещения равны десяти, двадцати, тридцати и сорока единицам. На одинаковых временных отрезках объект проходит всё больший путь, то есть средняя скорость на этих отрезках увеличивается. Сам маршрут при этом можно оставить прямым.

Траектория и изменение скорости решают разные задачи

Траектория показывает, где проходит объект: по прямой, дуге или иной линии. Распределение движения во времени показывает, как быстро он проходит разные части пути. Плавная по форме дуга не гарантирует мягкого начала и остановки. И наоборот, движение по прямой можно сделать постепенным по скорости. В редакторах для этого используются ключевые кадры и способы интерполяции. Важно смотреть на фактическое движение и график, а не считать любое применение автоматического сглаживания подходящим для любой задачи.

Разгон и торможение нужно связывать с нужной точкой

Для постепенного замедления можно рассмотреть положения ноль, сорок, семьдесят, девяносто и сто. Промежутки уменьшаются: сорок, тридцать, двадцать, десять. Такой вариант отличается от разгона, хотя общая длина пути и длительность одинаковы. Названия настроек входа и выхода следует читать в контексте выбранного ключевого кадра: речь может идти о приближении к нему или удалении от него. Чтобы не перепутать направление изменения, полезно сформулировать задачу словами: объект должен замедлиться перед конечной точкой. Затем проверить, соответствует ли результат этому описанию.

Попробуйте на практике

Сделайте бумажную раскадровку трёх движений по прямой. Используйте одинаковую общую длину и одинаковые интервалы времени, без установки программ.

  1. Начертите три одинаковые горизонтальные шкалы от нуля до ста. На каждой подготовьте пять отметок времени, разделённых равными интервалами.
  2. Для первого движения запишите положения ноль, двадцать пять, пятьдесят, семьдесят пять, сто. Подсчитайте четыре перемещения между соседними отметками.
  3. Для второго используйте ноль, десять, тридцать, шестьдесят, сто. Сравните последовательные перемещения и определите, где средняя скорость на интервале больше.
  4. Для третьего возьмите ноль, сорок, семьдесят, девяносто, сто. Объясните, почему этот набор показывает замедление к концу.
  5. Подпишите варианты как равномерное движение, разгон и торможение. Проверьте, что во всех случаях суммарный путь равен ста, хотя распределение по времени различается.

Как проверить результат. Для трёх вариантов получены перемещения двадцать пять четыре раза; десять, двадцать, тридцать, сорок; сорок, тридцать, двадцать, десять. Вывод о скорости опирается на равные интервалы времени.

Частые вопросы

Если увеличить длительность, движение автоматически станет плавным?

Оно станет медленнее при сохранении пути, но характер начала, остановки и изменения скорости зависит также от распределения промежуточных значений. Одна длительность не описывает весь рисунок движения.

Пять положений точно задают непрерывную анимацию?

Нет. Они показывают выбранные моменты и позволяют сравнить средние скорости между ними. Поведение внутри интервалов зависит от способа интерполяции. Поэтому готовую анимацию нужно просматривать, а не оценивать только по нескольким точкам.

Самостоятельный разбор темы. Содержание конкретной обучающей программы здесь не представлено.

Зарегистрируйтесь, чтобы уточнить возможность доступа к этому материалу

Зарегистрироваться
← К списку материалов