3D-анімації

3D-об'єкти, анімації при скролі та інтерактивні сцени на сайті — для брендів, які не хочуть виглядати як усі.

• індивідуальноОбсяг
• Сайти та брендингОбласть
• 6 годин – 2 дніЗапуск

Кому це потрібно

Преміум-бренди, яким важливо вирізнятися.

Проблема

Сайт виглядає як тисячі інших. Це проблема преміальних брендів, яким у своїй категорії потрібно чимось відрізнятися, а відрізняються вони лише текстом.

Що робимо

Робимо 3D-об'єкти, анімації при скролі та інтерактивні сцени, вбудовані прямо на сайт.

Що входить

Чотири етапи, з яких останній так само важливий, як перший:

• Концепція
• Сцена
• Анімація
• Оптимізація

Терміни

Реалізація займає 6 годин – 2 дні. Порядок робіт незмінний: концепція, сцена, анімація, оптимізація.

Вартість

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

Що ви отримуєте

Ефект вау і більшу запам'ятовуваність сайту.

Ціна уваги: вага сцени і пристрій відвідувача

3D-сцена має вагу в мегабайтах і вартість рендеру на кожен кадр. Обидві величини ростуть разом зі складністю моделі, а платить за них відвідувач — часом завантаження або батареєю телефона. Орієнтовна формула: Час завантаження сцени (с) = Вага сцени (МБ) × 8 / Пропускна здатність каналу (Мбіт/с), де вага сцени — це сума файлу моделі, текстур і бібліотеки 3D-рушія, а пропускна здатність — реальна швидкість з боку відвідувача, а не заявлена оператором.

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

Коли 3D-анімація не окупається

Чотири ситуації, в яких ми радимо почекати або обрати інше рішення:

• У сайту слабкий або нестабільний хостинг — додаткова вага лише поглибить проблему, яку 3D не вирішить.
• Аудиторія заходить переважно з повільного мобільного інтернету або старих телефонів — сцена гальмуватиме замість того, щоб вражати.
• Продукту немає чого показати в трьох вимірах — 3D, додане без причини, виглядає як прикраса, а не як доказ.
• На сайті ще немає основ: зрозумілої пропозиції, швидкого завантаження тексту і заклику до дії — спочатку фундамент, потім ефект.

Жодна з цих ситуацій не означає відмову назавжди — іноді достатньо спочатку виправити основу, а сцену додати наступним етапом.

Чого ця послуга не робить

Межі, про які ми говоримо прямо, ще до початку роботи:

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

Ці межі — не відмовка, а факт: кожна з них належить до іншої послуги, яку ми оцінюємо і виконуємо окремо.

Що нам потрібно з вашого боку

Чотири речі, без яких робота не почнеться або застрягне на етапі узгодження:

• Доступ до коду сайту або CMS, на який буде вбудована сцена.
• Матеріали бренду: логотип у векторному вигляді, кольорова палітра, попередні 3D-візуалізації, якщо є.
• Одна людина з вашого боку, яка затверджує концепцію — без цього узгодження розпорошується між кількома думками.
• Інформація про реальні пристрої аудиторії — телефон чи десктоп, приблизна якість зв'язку.

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

Як перевірити ефект через місяць без нас

У Google Analytics (безкоштовному інструменті, який можна підключити самостійно) порівняйте середній час на сторінці та глибину прокрутки (scroll depth) до і після впровадження сцени, для тих самих джерел трафіку. Формула: Зміна залученості (%) = (значення після впровадження − значення до впровадження) / значення до впровадження × 100.

Це порівняння говорить про залученість, а не про продажі. Якщо потрібно оцінити вплив на конверсію, необхідний довший період спостереження і стабільний трафік — інакше результат заглушать коливання, не пов'язані зі сценою.

Типова помилка при замовленні 3D-анімації

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

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

3D на тлі інших способів вирізнитися

Чотири шляхи до однієї мети, у кожного своя ціна і свій ризик для продуктивності:

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

З чого технічно складається вага сцени

Вага сцени — це не одне число, а сума кількох незалежних складових:

• Кількість трикутників (poly count) моделі — чим їх більше, тим більше роботи у відеокарти на кожен кадр.
• Роздільна здатність і кількість текстур — зазвичай саме вони, а не сама геометрія, становлять більшу частину ваги файлу.
• Кількість draw calls — скільки разів за один кадр сцена надсилає відеокарті команду намалювати фрагмент.
• Вага рушія або бібліотеки 3D, що завантажується разом зі сценою, — величина стала, не залежна від складності моделі.

Що ви отримуєте

• Концепція сцени та storyboard руху
• Оптимізовані 3D-об'єкти або motion-послідовності
• Інтеграція сцени з інтеракцією, скролом або обраною зоною сайту

Коли завдання лежить в іншому місці

Якщо завдання звучить інакше, поруч стоять сусідні області тієї самої системи — AURA пов’язує їх між собою, а не продає окремо:

• UX і конверсія — Шукаємо причини, через які відвідувачі не залишають заявку, і усуваємо їх по черзі — замість того, щоб переробляти весь сайт навмання.
• Сайти та магазини — Від лендінгу під одну пропозицію до магазину з каталогом та оплатою. Сайт будується навколо одного рішення, а не навколо фотогалереї.
• Лендінг — Одна сторінка під одну кампанію: та сама обіцянка, що в рекламі, одна ціль і нічого, що від неї відволікає.
• Інтернет-магазини — Власний канал продаж замість комісії майданчика: каталог, картка товару, кошик, оплата, доставка та панель на вашому боці.