КамераСередній

Focus Blur

Фон тане з фокуса, коли відкривається меню чи діалог — сам об'єктив каже: «тепер дивись сюди».

camerapost-processingdepth-of-fieldui

Приклади

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

Огляд

Глибина різкості — вказівний палець фотографа: що різке, те й важливе. Ігри позичають її як зміну стану — поставте гру на паузу, і поле бою розмивається за меню; почніть діалог, і все, крім співрозмовника, м'якшає. Розмиття робить три справи одразу: спрямовує око, візуально приглушує світ, за яким більше не треба стежити, і робить UI фізично ближчим за гру.

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

Фокусне розмиття посеред ґеймплею — гостріший ніж: прицілювання може розм'якшити все за прицілом, затримка дихання снайпера — розмити ближню геометрію. Використовуйте його лише там, де гра справді звузила завдання гравця, і ніколи не розмивайте те, на що він ще мусить реагувати — м'який фон завжди має означати «це можна безпечно ігнорувати».

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

гра триває — Pause переводить фокус

Сила розмиття8px

Перевід фокуса300ms

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

Меню паузи та інвентаряФокус у діалогах і катсценахПрицілюванняЕкрани смерті та завершення рівня

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

Варто

✓Заводьте розмиття як перевід фокуса (~300 мс) і виводьте трохи швидше — закриття має відчуватися нетерплячим.
✓Поєднуйте розмиття з легким затемненням, щоб UI читався без важких непрозорих панелей.
✓Тримайте UI на шарі, якого розмиття не може торкнутися — і в рендері, і в голові.

Не варто

✕Не вмикайте повне розмиття за один кадр; миттєве розфокусування читається як збій графічного драйвера.
✕Не розмивайте нічого, на що гравець ще має реагувати — м'який фокус є обіцянкою, що це можна ігнорувати.
✕Не складайте фокусне розмиття з motion blur і хроматичною аберацією одночасно; три лінзові ефекти вглиб — і кадр перетворюється на суп.

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

⚠Розмиття всього екрана разом із самим меню, бо том постобробки стоїть після композиції UI.
⚠Розкішне гаусове розмиття на 40 пікселів, що коштує 4 мс GPU саме на тому екрані, де гра мала б відпочивати.
⚠Ідеально різкий світ за меню паузи — а потім подив, чому гравці скаржаться, що меню «схоже на спливне вікно браузера».

Реалізація

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

Промт

Додай у мій проєкт ефект "Focus Blur": Фон тане з фокуса, коли відкривається меню чи діалог — сам об'єктив каже: «тепер дивись сюди».

Як це працює: Глибина різкості — вказівний палець фотографа: що різке, те й важливе. Ігри позичають її як зміну стану — поставте гру на паузу, і поле бою розмивається за меню; почніть діалог, і все, крім співрозмовника, м'якшає. Розмиття робить три справи одразу: спрямовує око, візуально приглушує світ, за яким більше не треба стежити, і робить UI фізично ближчим за гру.

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

Чого уникати:
- Не вмикайте повне розмиття за один кадр; миттєве розфокусування читається як збій графічного драйвера.
- Не розмивайте нічого, на що гравець ще має реагувати — м'який фокус є обіцянкою, що це можна ігнорувати.
- Не складайте фокусне розмиття з motion blur і хроматичною аберацією одночасно; три лінзові ефекти вглиб — і кадр перетворюється на суп.

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