АнімаціяСередній

Follow Through

Вільні частини рухаються далі після зупинки тіла — волосся, плащі, кінчики зброї.

animation-principlephysicalitypolish

Приклади

Записано з інтерактивного демо нижче на цій сторінці.

Огляд

Фоллов-тру дозволяє другорядним частинам рухомого об'єкта — волоссю, тканині, вусикам, кінчику великого меча, вмісту елемента UI — коротко продовжити рух після зупинки основної маси й осісти назад.

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

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

Інтерактивне демо

Відставання80ms

Затухання осідання0.5

Де застосовується

ПлатформерRPGБійUI

Найкращі практики

Варто

✓Ведіть фоллов-тру процедурно (пружина-демпфер до позиції батька), щоб він автоматично працював для будь-якого руху.
✓Давайте різним матеріалам різні лаг і затухання — важка тканина осідає повільніше за коротке волосся.
✓Застосовуйте і в UI: нехай вміст панелі відстає на кілька пікселів від самої панелі під час в'їзду.

Не варто

✕Не застосовуйте фоллов-тру до критичних для геймплею частин — хітбокс меча має відповідати анімації, відставати може лише візуальний кінчик.
✕Не накладайте його на ручні кейфрейми вторинного руху на тих самих кістках — обирайте одне джерело істини.
✕Не дозволяйте осіданню коливатися понад 2–3 рази — далі це читається як зламані пружини, а не вага.

Поширені помилки

⚠Пружини затюнені на кожен об'єкт ізольовано — волосся персонажа шалено хльостає на бойових швидкостях, не перевірених у сцені тюнінгу.
⚠Фоллов-тру рівномірно у світових координатах, без урахування оберту батька.
⚠Не обмежене розтягнення пружини — швидкий телепорт розтягує хвостик через увесь рівень.

Реалізація

Встав це у свого ШІ-асистента (Cursor, Copilot, Claude), щоб додати ефект у проєкт.

Промт

Додай у мій проєкт ефект "Follow Through": Вільні частини рухаються далі після зупинки тіла — волосся, плащі, кінчики зброї.

Як це працює: Фоллов-тру дозволяє другорядним частинам рухомого об'єкта — волоссю, тканині, вусикам, кінчику великого меча, вмісту елемента UI — коротко продовжити рух після зупинки основної маси й осісти назад.

Рекомендації:
- Ведіть фоллов-тру процедурно (пружина-демпфер до позиції батька), щоб він автоматично працював для будь-якого руху.
- Давайте різним матеріалам різні лаг і затухання — важка тканина осідає повільніше за коротке волосся.
- Застосовуйте і в UI: нехай вміст панелі відстає на кілька пікселів від самої панелі під час в'їзду.

Чого уникати:
- Не застосовуйте фоллов-тру до критичних для геймплею частин — хітбокс меча має відповідати анімації, відставати може лише візуальний кінчик.
- Не накладайте його на ручні кейфрейми вторинного руху на тих самих кістках — обирайте одне джерело істини.
- Не дозволяйте осіданню коливатися понад 2–3 рази — далі це читається як зламані пружини, а не вага.

Реалізуй ефект у тому рушії/стеку, який уже використовується в проєкті, і дотримуйся наявного стилю коду. Підключи його там, де це доречно.