Загальні відомості - Посібник користувача Blend4Web

Що таке Blend4Web¶

Blend4Web - це програмне середовище для підготовки та інтерактивного відображення тривимірного аудіовізуального контенту у браузерах, тобто. тривимірний "движок" (жаргонізм від англ. "engine").

Платформа варта створення візуалізацій, презентацій, інтернет-магазинів, ігор та інших «насичених» web-додатків.

Фреймворк Blend4Web має тісну інтеграцію з пакетом 3D моделювання та анімації Blender (звідси назва). Відображення контенту здійснюється засобами WebGL та інших браузерних технологій без використання плагінів.

Технічно Blend4Web є програмною бібліотекою, що підключається до веб-сторінки, аддон (додаток) до програми Blender, а також інструменти для налагодження та оптимізації.

Двигун - це відокремлена частина програмного коду, що використовується зовнішніми програмами для реалізації необхідного їм функціоналу.

Типи движків: сайтовий движок, блоговий движок, движок інтернет-магазину, wiki-движок, пошуковий движок, ігровий движок і т.д. Економічний сенс існування програмних двигунів полягає у багаторазовому використанні одного й того ж функціоналу. Наприклад, використовуючи той чи інший двигун, розробники можуть відносно дешево створювати інтернет-магазини чи ігри.

Графічний двигун, тривимірний двигун¶

Графічний двигун виконує спеціалізовані функції відображення графіки. Він є проміжною ланкою між:

високорівневою прикладною частиною (ігровою логікою, бізнес-логікою) та
низькорівневою системною частиною (наприклад, графічною бібліотекою WebGL і драйверами нижче).

Що таке WebGL¶

WebGL (Web Graphics Library, тобто графічна бібліотека для використання у веб-) - одна з сучасних браузерних технологій, що дозволяє створювати тривимірні графічні веб-додатки. Іншими словами, WebGL – це «3D у браузері».

Підтримка WebGL у браузерах¶

На даний момент технологія WebGL тією чи іншою мірою підтримується у всіх браузерах.

Мобільні платформи¶

Android
BlackBerry
Firefox OS
iOS 8
Sailfish OS
Tizen
Ubuntu Touch

Докладніше підтримка WebGL описана у розділі розділу «Проблеми та рішення».

Переваги WebGL¶

працює в браузерах без встановлення додаткових програм (плагінів)
кросплатформний, призначений для роботи у всіх стаціонарних та мобільних системах
є відкритим стандартом, не вимагає ліцензійних відрахувань
підтримується провідними учасниками ринку IT (Google, Apple, Microsoft, Nvidia, Samsung, Adobe та ін.)
заснований на знайомій розробникам технології OpenGL
інтегрується з іншими браузерними технологіями

Що таке Blender¶

Blender - це популярна програма для створення 3D-моделей та анімації, безкоштовна та з відкритим кодом. Підготовлені в програмі моделі та сцени можуть відображатися, наприклад, за допомогою тривимірного движка на сторінці веб-сайту.

3D моделювання¶

Створення графічних ресурсів потребує наявності підготовлених фахівців – 3D-художників.

Типовий робочий процес може складатися з наступних етапів:

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

Крім того, у процесі створення 3D-моделей часто використовуються техніки підвищення реалізму, що потребують окремих етапів:

створення високополігональної моделі – створюється деталізована версія моделі
«запікання» карти нормалей – деталі з високополігональної моделі переносяться на основну модель у вигляді спеціальної текстури (карти нормалей)
створення карти відображення - різним частинам моделі призначається різний колір та ступінь відображення світла
запікання карт оточення - проводиться з метою реалізації ефекту відображення навколишнього середовища на поверхні моделі
налаштування камери та джерел світла на сцені
налаштування параметрів фізичної симуляції - частинки, тканина

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

Браузерні технології¶

Серед реалізованих убраузерах перспективних можливостей, що використовуються в Blend4Web, можна відзначити такі технології:

тривимірна графіка, WebGL
типизовані масиви, Typed Array
тимчасовий контроль анімації (requestAnimationFrame), Timing control for script-based animations
двовимірна графіка, HTML Canvas 2D Context
обробка звуку, Web Audio API
завантаження бінарних даних, XMLHttpRequest Level 2
повноекранний режим, Fullscreen
захоплення курсора миші, Pointer Lock
багатопоточні обчислення, Web Workers
орієнтація та переміщення мобільних пристроїв, Device Orientation

Інші перспективні технології:

векторна графіка, Scalable Vector Graphics (SVG)
безпечний доступ до файлів, File API, File API: Directories and System
потокове з'єднання між браузерами, WebRTC
постійне підключення до мережі, The WebSocket API
ігрові пульти, Gamepad

Інтерактивна графіка¶

Термін «інтерактивний» у додатку до комп'ютерної графіки означає, що користувач має можливість взаємодіяти з зображенням, що постійно змінюється. Наприклад, користувач може змінювати напрям погляду в 3D сцені, переміщати об'єкти, ініціювати анімацію та виконувати інші дії, які зазвичай асоціюються з комп'ютерними іграми.

Інтерактивність графіки досягається за рахунок частої зміни зображень, так що дія користувача (наприклад, рух курсору або натискання кнопки) у проміжках між кадрами призводить до зміни зображення наступного кадру. Зображення повинні змінювати одне одного так часто, щоб людське око не було здатне розпізнати їх окремо (швидше 30 кадрів на секунду).

Близьким за змістом терміном єтакож "графіка реального часу", або "рендерінг реального часу" (від англ. Rendering, тобто "Відображення").

Відео-карти та драйвери¶

Основні виробники графічних процесорів (у дужках вказані їх торгові марки), для настільних комп'ютерів – Nvidia (GeForce, Quadro), AMD (Radeon), Intel (HD), для мобільних пристроїв – ARM (Mali), PowerVR (SGX), Nvidia ( Tegra), Qualcomm (Adreno).

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