Render.ru

Как правильно создать освещение в вэб-игре?

isnak

Активный участник
Рейтинг
15
#1
Хоть я и работаю в blander, но вопрос общий и адресован все кто когда-либо создавал модели под динамичные вэб приложения, а именно игры на flash + wmode, webgl. По этому если существует раздел в котором этот вопрос будет более уместен и этот раздел не менее посещаемый чем этот, то было бы здорово туда его и перенести.

Сам вопрос очень простой, я лишь прошу рассказать как правильно настраивать освещение и как правильно готовить текстуры.

дело в том что я три дня как в редакторе работаю и учась по видеоурокам обратил внимание что при чуть более сложном рендере чем по дефолту,
время уходит в разы больше, а качество ещё не приближено к желаемому.

Конечно я понимаю что создать игру красивой это сродни хорошему фокусу,
где действительное выдают за желаемое, где вместо реалтаймовских бликов их придется рисовать на текстуре, но понимание этого дает лишь направление, которое привело меня сюда. Сюда, как реально наверное больше и некуда.

Можете вкратце рассказать сколько источников и каких нужно добавлять на сцену? Как поступать с текстурами? Если детально это долго и нужно, то хотя бы по пунктам, чтобы я знал по шагам шел вперед, а не топтался на месте.

Вот например я сегодня узнал что текстуры запекают, но поможет ли это мне?
Есть ли какое-то количество текстуры и её цвета, после которого все начинает тормозить?

И ещё я хочу напомнить что все в контексте вэб + мобильные платформы.
У мобильных платформ хочется иметь поддержку начиная с ценовой категории начиная с 12-15 т.р. то есть не макипро, а для большинства.

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

И забыл упомянуть такую важную составную, как материалы! Как вот например сделано в этой демке взятой из эксемплов с оффсайта библиотеки которую я сейчас учу? http://carvisualizer.plus360degrees.com/threejs/ это материал так настраивают или же что-то делают с текстурой? Просто для моего слабого ноута такая реалистичность и блики и отражение, это просто чудо.

И ещё что интересует, вот когда имитируешь металл, то рендер происходит намного дольше и ещё дольше если блики и отражение есть. А как движки рендера webgl работают?
Они рендерят только раз или всегда?
 
Последнее редактирование:

M.O.Z.G

Знаток
Рейтинг
50
#2
Вот например я сегодня узнал что текстуры запекают, но поможет ли это мне?
Почему это не должно Вам помочь? Это делается практический везде. Запекается на самом деле очень многое, не только свет, контактные тени, но нормали (даже если объект относительно простой, что уменьшает нагрузку на проц) с картами окружения. Как раз все эти блики и отражения предварительно запечённая карта окружения. Если не говорить про AAA проекты, типа GTA5, где запекаеться всё по разному, и некоторые объекты в реальном времени, рефлексы и каустика воды например.

это материал так настраивают или же что-то делают с текстурой? Просто для моего слабого ноута такая реалистичность и блики и отражение, это просто чудо.
Например здесь, примеры карт окружения на ThreeJS, с исходниками.
https://www.clicktorelease.com/code/spherical-environment-mapping/
https://github.com/spite/spherical-environment-mapping

http://threejs.org/examples/?q=teap#webgl_geometry_teapot
https://github.com/mrdoob/three.js/blob/master/examples/webgl_geometry_teapot.html

Можете вкратце рассказать сколько источников и каких нужно добавлять на сцену?
Всё зависит от того, что Вам реально надо. Можно ведь сделать какой-нибудь BomberMan, и заливать светом всю сцену равномерно, а вместо теней использовать спрайты. А можно делать хоррор, где источник света находиться где-нибудь на голове персонажа. У меня знакомый прогер в своё время вообще заморачивался тем, что света как такого не было, а рассчитывались векторные маски относительно положения персонажа на карте, и обтекая объекты. Но там был Top-Down. Не знаю правда, получилось ли, или нет.

Есть ли какое-то количество текстуры и её цвета, после которого все начинает тормозить?
Сама по себе текстура может быть большой, маленькой, сжатой, процедурно-генерирумой, слоёной, анимированой и т.п., всё это требует ресурса от разных компонентов, по-разному.

Буду рад всему, кроме ссылок на не русскоязычные статьи.
Как и с любой технической информацией - это традиционно проблемно. Для примера, существующая дока по WebGL переведена на русский, всего-лишь на 2%.
 
Последнее редактирование:
Симпатии: isnak

isnak

Активный участник
Рейтинг
15
#3
M.O.Z.G, спасибо за ответ и особенно за первую ссылку. В этом примере хочу обратить внимание на Сюзан с черной текстурой и красной и на текстуры, которые лежат на github.
Я такое вижу почти впервые и могу лишь догадаться что текстуры ниже наложены при помощи шейдера на модель. Это так? Если да, то как называется такая техника и такие текстуры? Я пока знаю только текстуры на основе UV развертки, но это явно что-то другое и я не знаю как гуглить.



Как и с любой технической информацией - это традиционно проблемно. Для примера, существующая дока по WebGL переведена на русский, всего-лишь на 2%.
По webgl я книгу прочел и первая часть посвященная шейдерам и текстуре показалась мне довольно захватывающей. Правда там очень поверхостно, а хочется именно глубже погрузится в создание и подготовку текстур, желательно в blender.
Именно статьи по созданию, подготовке текстур, настройки освещения в blender я и просил показать, если таковы имеются на русском.


И ещё по текстурам выше - они создаются где-то в графическом редакторе или это результат рендера в 3d редакторе, то есть та самая запеченая текстура?
В каком виде для этого примера импортируют модель Сюзан, в самом обычном или же её как-то нужно обработать, как например цвета, типа тут холодно, а тут тепло?
Можете рассказать о самом процессе получения конечного результата с нуля?
 
Последнее редактирование:
Сверху