Parallax
Шари фону, що котяться повільніше за передній план, імітуючи глибину.
Приклади
Записано з інтерактивного демо нижче на цій сторінці.
Огляд
Паралакс прокручує кожен шар фону з часткою швидкості камери — далекі гори ледь рухаються, дерева середнього плану рухаються помірно, трава переднього плану — швидше за саму камеру.
Це працює, бо так буквально влаштований зір: далекі речі перетинають поле зору повільніше. Навіть із пласким 2D-артом правильні відносні швидкості змушують мозок збудувати модель глибини сцени.
Крім глибини, паралакс робить сам рух швидшим і приємнішим на відчуття — та сама швидкість бігу виглядає значно динамічніше з шарами, що ковзають по-різному, ніж на статичному тлі.
Інтерактивне демо
Де застосовується
Найкращі практики
Варто
- ✓Обирайте коефіцієнти шарів приблизно логарифмічно (0.9, 0.6, 0.3, 0.1), а не рівномірно — сприйняття глибини нелінійне.
- ✓Додайте тонкий передній шар, що рухається швидше за камеру, — він продає глибину сильніше, ніж ще один задній.
- ✓Легкий паралакс у фонах меню, що реагує на курсор/стік, — дешева додана якість продакшену.
Не варто
- ✕Не рухайте геймплейні елементи з паралакс-коефіцієнтами — платформи мають рухатися 1:1 зі світом, інакше колізії читаються неправильно.
- ✕Не давайте великий паралакс шарам зі зчитуваним текстом чи важливими орієнтирами — дрейф відволікає.
- ✕Не забувайте про вертикальний паралакс, якщо камера рухається вертикально, — лише горизонтальний ламає ілюзію на стрибках.
Поширені помилки
- ⚠Вести паралакс від позиції гравця, а не камери, — ламається, щойно камера відстає чи випереджає.
- ⚠Текстури шарів, що не тайляться чисто, — шви на високих швидкостях прокрутки.
- ⚠Оновлювати паралакс в Update, поки камера рухається в LateUpdate, — однокадровий джиттер між шарами.
Реалізація
Встав це у свого ШІ-асистента (Cursor, Copilot, Claude), щоб додати ефект у проєкт.
Додай у мій проєкт ефект "Parallax": Шари фону, що котяться повільніше за передній план, імітуючи глибину.
Як це працює: Паралакс прокручує кожен шар фону з часткою швидкості камери — далекі гори ледь рухаються, дерева середнього плану рухаються помірно, трава переднього плану — швидше за саму камеру.
Рекомендації:
- Обирайте коефіцієнти шарів приблизно логарифмічно (0.9, 0.6, 0.3, 0.1), а не рівномірно — сприйняття глибини нелінійне.
- Додайте тонкий передній шар, що рухається швидше за камеру, — він продає глибину сильніше, ніж ще один задній.
- Легкий паралакс у фонах меню, що реагує на курсор/стік, — дешева додана якість продакшену.
Чого уникати:
- Не рухайте геймплейні елементи з паралакс-коефіцієнтами — платформи мають рухатися 1:1 зі світом, інакше колізії читаються неправильно.
- Не давайте великий паралакс шарам зі зчитуваним текстом чи важливими орієнтирами — дрейф відволікає.
- Не забувайте про вертикальний паралакс, якщо камера рухається вертикально, — лише горизонтальний ламає ілюзію на стрибках.
Реалізуй ефект у тому рушії/стеку, який уже використовується в проєкті, і дотримуйся наявного стилю коду. Підключи його там, де це доречно.
Коментарі
…