Інтерактивна презентація інтер'єру SVOYA (WebGL/PlayCanvas). Частина 7

Автор: MastaMan
Дата: Березень 1, 2022
Оновлено: Липень 25, 2023

Ви читаєте частину: 1 2 3 4 5 6 7 8

Частина 7

Це Частина 7 із серії уроків зі створення інтерактивного інтер'єру SVOYA за допомогою WebGL/PlayCanvas.

Для тих, хто не читав попередніх частин, ось демонстративне відео.

У цій серії уроків ми зробимо інтерактивну презентацію інтер'єру, яку можна переглядати в реальному часі через веб-браузер.

Доступ до матеріалів, такі як: моделі у форматі "FBX", запечені текстури та інше, ви можете отримати підписку на Patreon.

Patreon - 3DGROUND

Налаштування матеріалів

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

Основний трюк полягає, якщо нам треба зробити відображення у матеріалі:

Повністю вимикаємо "Emissive"
У "Lightmap" закидаємо будь-яку текстуру і переводимо "Color Channel" в режим "A"
Текстуру з "Emissive" перекидаємо в "Diffuse"
Включаємо в "Specular" прапорець "Metalness", значення "Metalness" ставимо в "0"
У "Environment" закидаємо "cubemap"
Керуємо силою відображення за допомогою "Glossines" в "Specular"

Floor

Насамперед, запечену текстуру я закинув у Photopea (Photoshop), і привів до такого вигляду як на картинці. Це буде наша карта "Specular".

Cooker

Basin

Island

Все те саме, що і для Basin, крім:

"Glossines": "85"
"Reflectivity": "0.3"

Hood

Все те саме, що і для Basin, крім:

"Glossines": "62"
"Metalness": "0.3"

Small Table

Аналогічно попереднім матеріалам:

"Glossines": "60"
"Metalness": "1.0"

Glass Doors

Матеріал з "ID": 1 залишаємо так, для матеріалу скла "ID": 2, наступні налаштування.

TV

"ID": 1 не чіпаємо, для "ID": 2, налаштування нижче.

Oven

"ID": 1 налаштування.

"ID": 2 налаштування.

Stair Collision

Тут ми просто зробимо прозорий матеріал.

Заклюлчення

У цій частині ми закінчили з налаштуванням матеріалів. Всі інші матеріали, які не вказані в цій частині залишаємо за замовчуванням. Ви вже можете запустити проект за кнопкою "Play" та насолоджуватися результатом. Але, у наступній частині ми додамо останній штрих, красиву заставку під час завантаження проекту з анімацією.