Haptic Feedback
Телефон торкається у відповідь — на мобільному руки І Є екраном, і хаптика — єдиний фізичний канал, який у вас є.
Приклади
Записано з інтерактивного демо нижче на цій сторінці.
Огляд
У тачскріна нема ходу кнопки, нема пружини, нема кліку — палець тисне на скло, і скло не віддає нічого. Хаптика — відсутня половина кожного мобільного вводу: тап на 10 мілісекунд, коли кнопка спрацювала, поштовх, коли удар дійшов, чіткий подвійний тік на перемозі. Гравці не помічають її свідомо, але дайте тестувальнику ту саму гру з вимкненою хаптикою — і він скаже, що кнопки «ватні», не вміючи пояснити чому.
Ставтеся до вібрацій як до звукорежисури: короткі, оформлені, синхронізовані з точним кадром візуалу. Тіки UI хочуть 10–30 мс; ігрові удари — 40–80 мс; усе довше за 400 мс читається як вхідний дзвінок. Зберіть маленький словник (легкий / середній / важкий, успіх / попередження) і використовуйте його послідовно — iOS формалізувала саме це у своїх Taptic-патернах, і руки гравців уже говорять цією мовою.
Перевірка платформенною реальністю: нативний iOS має багатий Taptic Engine (UIImpactFeedbackGenerator); нативний Android — контроль амплітуди через VibrationEffect. У вебі — а це і playable ads — Android Chrome та більшість webview поважають navigator.vibrate(), а iOS Safari ігнорує його повністю. Тож проєктуйте хаптику як бонусний шар, що деградує мовчки: вистрілив і забув, ніколи не критична для ґеймплею, завжди з перемикачем у налаштуваннях.
Інтерактивне демо
Де застосовується
Найкращі практики
Варто
- ✓Запускайте хаптику в точний кадр візуалу — розсинхрон у 50 мс пучки пальців читають як лаг.
- ✓Зберіть маленький повторюваний словник: легкий тік для UI, важкий поштовх для ударів, патерни для результатів.
- ✓Детектуйте підтримку і деградуйте мовчки — в iOS-вебі нема API вібрації, і грі має бути байдуже.
Не варто
- ✕Не ганяйте вібрації довше ~400 мс; довгий гул читається як дзвінок і їсть батарею.
- ✕Не вібруйте на кожен кадр перетягування чи скролу — постійний гул знечулює руку менш ніж за хвилину.
- ✕Не випускайте без перемикача хаптики; чутливість у всіх різна, і деякі пристрої гудуть значно сильніше.
Поширені помилки
- ⚠Один довгий однаковий гул на всі події — багатий канал перетворено на дверний дзвінок.
- ⚠Хаптика, налаштована на флагмані й не перевірена на бюджетних пристроях, де мотори вдвічі сильніші та вдвічі повільніші.
- ⚠Playable ad, де прогрес зав'язаний на відчуття вібрації, — невидимої на iOS, де navigator.vibrate не робить нічого.
Реалізація
Встав це у свого ШІ-асистента (Cursor, Copilot, Claude), щоб додати ефект у проєкт.
Додай у мій проєкт ефект "Haptic Feedback": Телефон торкається у відповідь — на мобільному руки І Є екраном, і хаптика — єдиний фізичний канал, який у вас є.
Як це працює: У тачскріна нема ходу кнопки, нема пружини, нема кліку — палець тисне на скло, і скло не віддає нічого. Хаптика — відсутня половина кожного мобільного вводу: тап на 10 мілісекунд, коли кнопка спрацювала, поштовх, коли удар дійшов, чіткий подвійний тік на перемозі. Гравці не помічають її свідомо, але дайте тестувальнику ту саму гру з вимкненою хаптикою — і він скаже, що кнопки «ватні», не вміючи пояснити чому.
Рекомендації:
- Запускайте хаптику в точний кадр візуалу — розсинхрон у 50 мс пучки пальців читають як лаг.
- Зберіть маленький повторюваний словник: легкий тік для UI, важкий поштовх для ударів, патерни для результатів.
- Детектуйте підтримку і деградуйте мовчки — в iOS-вебі нема API вібрації, і грі має бути байдуже.
Чого уникати:
- Не ганяйте вібрації довше ~400 мс; довгий гул читається як дзвінок і їсть батарею.
- Не вібруйте на кожен кадр перетягування чи скролу — постійний гул знечулює руку менш ніж за хвилину.
- Не випускайте без перемикача хаптики; чутливість у всіх різна, і деякі пристрої гудуть значно сильніше.
Реалізуй ефект у тому рушії/стеку, який уже використовується в проєкті, і дотримуйся наявного стилю коду. Підключи його там, де це доречно.
Коментарі
…