Делаем пляжный зонт

2014-04-15

В этом уроке будет рассмотрена методика настройки модели пляжного зонта и минимального окружения (песок, небо). Также будет продемонстрировано практическое применение полосатого шейдера.

В качестве тестового объекта выберем пляжный зонт. Очень часто зонты имеют полосатую окраску. Предположим, что зонт уже прошел стадии высоко-полигонального моделирования, изготовления низко-полигональной версии и запекания карт нормалей и других текстур. В итоге мы располагаем двумя основными объектами: купол и каркас.

Blend4Web поддерживает два типа материала: стековые и нодовые (узловые). В данной сцене используются только нодовые. Ниже представлен граф материала назначенного на каркас зонта. На изображении ниже: 1 – нода осуществляет преобразование в пространство камеры; 2 – карта нормалей в виде текстурной ноды (для корректного отображения в движке); 3 – карта нормалей внутри ноды материала (для корректного отображения во вьюпорте Blender); 4 – нода замены демонстрирует во вьюпорте Blender данные из первого гнезда на входе ноды группы, а отправляет в движок данные из второго.

Следующим представлен граф материала назначенного на купол зонта. На изображении: ниже: 1 – маска для желто-зеленых полос; 2 – маска для оранжевых полос; 3 – нода предназначена для настройки эффекта светопропускания тонкостенных объектов.

Карта нормалей общая для обоих материалов. Чтобы обеспечить корректную работу карты нормалей в контексте нодового материала, нужно поместить ее внутрь стекового материала, входящего в свою очередь в состав описываемого нодового материала. К таким манипуляциям приходится прибегать, так как вне ноды материала отсутствует возможность выбора тангентного пространства для карты нормалей. Ниже представлены настройки текстурного стека для такого материала.

Далее следует простой граф материала песчаного холма.

Для имитации непрямого освещения существует заливающий свет, который контролируется во вкладке World на панели Environment Lighting. Также Blend4Web обладает возможностью генерации процедурного неба. Для этого необходимо активировать панель Procedural Sky и настроить эффект:

Дополнительно нужно настроить тени (Shadow), эффект сумеречных лучей (God Rays) и эффект засветки (Bloom). Эти панели находятся во вкрадке Render. Там же расположена панель настроек цветокоррекции.