Как вам провода?
Сколько км провода в игре TReload... Несколько сотен?
Здесь некоторые тесты проводов-шлангов из игры : IK + работа со сплайнами + физика + блендинг.
Финальный провод:
Rob Tuytel
Image Processing изображений из космоса для CG
Большое красное пятно сделано симуляцией дыма и частиц на основе оригинального изображения* (C4D+Octane+x-particles)
Сразу хочу предупредить что статья не является рекламой. Я лишь хочу поделиться результатами своей работы.
Некоторое время назад я увлёкся обработкой изображений с различных космических аппаратов. Довольно занятная штука. Всё началось с того что мне понадобились текстуры планет в очень высоком разрешении. Но их почти нигде не оказалось. И тогда я решил сделать свой собственный сборник текстур Солнечной Системы в 16к. Это оказалось совсем не так просто, как кажется…
Дело в том что нельзя просто скачать обработанные картинки с сайта НАСА и использовать их в своих целях, особенно если речь идёт о коммерческом использовании. Потому что каждый обработанный исходник изображения из космоса имеет авторские права человека, который совершил эту обработку. Прошерстив кучу официальных и неофициальных форумов по этой теме, я понял что самым активным и уважаемым в этом деле считается некий Bjorn Jonsson. Предположительно он работает в НАСА и ему принадлежит большинство обработанных изображений и составленных карт различных планет и спутников. Именно поэтому мной было принято волевое решение делать практически всё с нуля и использовать сырые исходники, на которые никакие авторские права не распространяются (т.к. изображения сделаны в космосе).
Планеты пришлось собирать буквально по кусочкам, используя изображения на подобии таких:
Кусок поверхности Европы
Изображения с разных космических аппаратов в основном очень низкого качества и чёрно-белые. В идеале должно быть три чб снимка одной области для красного, зелёного и синего каналов, но к сожалению их очень непросто найти и над цветом приходится работать отдельно. Поиск изображений на сайте OPUS выглядит примерно так:
:)
Проблему с низким качеством изображений мне помогают решать нейросети. Каждый исходник чистится от шума, апскейлится в несколько раз и приобретает резкость с помощью трёх разных нейросетей и фотошопа.
Ниже представлен процесс на примере одного изображения части поверхности Ио:
Поверхность Ио до обработки нейронными сетями (800х800)
Поверхность Ио после обработки нейронными сетями (4800х4800)
На основе обработанного изображения создаются каналы Color, Roughness, Normal и Displacement
Финальный результат (C4D+Octane)
Но это только часть космического тела. А нам нужны полноценные текстуры. Поэтому после обработки иходников нейронками мы начинаем их склеивать в мозаику…
Тут возникает один болезненный момент — полюса планет. Так как для текстуры на шар нам требуется сферическая проекция, то создание полюсов приходится совершать в несколько этапов.
Первым этапом склеиваем полюса во фронтальной проекции с альфа-каналом:
Один из полюсов Юпитера
Далее переходим в 3д редактор и натягиваем их на сферу:
Создаём сферическую камеру и рендерим картинку 360 с пропорциями 2 к 1:
Теперь остаётся только совместить изображения центральной области и полюсов:
Финальный результат текстуры Юпитера
После завершения создания основной карты Color приступаем к созданию каналов Normal, Roughness, Specular и Displacement.
В этом нам помогает Photoshop. На выходе получаем пять таких вот текстур:
По порядку: Color, Normal, Roughness, Specular и Displacement
Таким образом я сделал коллекцию семи планет Солнечной системы, одного Плутона и шести различных лун в 16к.
Теперь нам остаётся только создать шейдер нашей планеты в любом 3д редакторе и наслаждаться красотой космоса. Тут уже всё зависит от вашего воображения:
Юпитер (C4D+Octane)
Ио (C4D+Octane)
Так-же производились тесты в Unreal Engine 4, предварительно уменьшив размер текстур до 8к. Результат очень порадовал:
Ссылок никаких оставлять не буду, дабы избежать хейта. Статья сугубо познавательная.
P.S. На самом деле нюансов в разы больше. Например Displacement map, в идеале должна быть 32 битной EXR. Недавно я придумал способ создавать такие карты. Но об этом напишу если только эта тема в принципе кому-то зайдёт.
Спасибо за внимание! Надеюсь что было интересно)
Как артист делал оптимальные лазерные лучи
Настало время оптимизации нашей иры-головоломки от первого лица. В посте будет много картинок, видео и НЕ БУДЕТ математики / программирования. Вся "математика" будет описана на пальцах, показаны только общие идеи. Итак, под оптимизацию попали лазерные лучи.
До этого в grayBox мы использовали юнитевский LineRendere.
Достоинства:
- берется из коробки
- гибкий, хорошо подходит для создания прототипа лазерного луча ну или чего вам заблагорассудится
Недостатки:
- работает неоптимально.
Неоптимальность незаметна на одном, 2-х и даже на десяти лучах. Но вот если у вас в игре лазер, который отражается от зеркал, делится на несколько лучей при прохождении через призму, имеет несколько цветов... то тут уже стоит прикинуть сколько +drawCalls накинут сверху только лучи. Ну, у нас могло набегать 4, 8 и даже 30 drawCalls.
Этот пост будет интересен, пожалуй, не программистам/разработчикам игр. Их этим не удивишь, а вот обычынм людям будет интересно посмотреть отдаленно на то, сколько усилий вбивается лишь для того, чтобы в игре были лазерные лучи.
До того как браться за луч, сделал наброски источника лазера и приемника. Свел их по дизайну между собой, ну и с другими элементами. Скетки источника лазера, надеюсь что-то будет понятно.
3/4, сбоку, вразрезе, чтобы моделлер лучше понял конструкцию:
Первые наброски:
Наброски приемника луча:
Работает в целом так: луч попадает в приемник и применик передает сигнал о том, что в него попали. На основе этого разворачивается одна из игровых механик.
Больше скетчей, если интересно, выкладываю сюда:
https://www.instagram.com/cgaleksey/
На https://vk.com/dronesgame пока ничего не выкладываю, но если добавятся больше 1.5 человека XD, то и туда начну скидывать.
По коду.
Почему не взял какой-то готовый плагин. Взял, результат не понравился. Пробовал Vectosity. Вот я, пишу несамый читабельный код. Но код мой и пишу так, что я могу его понять так как проект делаю для себя. А вот создатель Vectosity я бы сказал накрутил каких-то неральных сложностей. В его коде я так и не смог разобраться чтобы устранить баг, который мне мешал. Вот баг, тектсура как-то деформируется или хз что с ней:
Написал разработчику Vectosity чтобы узнать в чем проблема, когда исправит. С его слов это неисправимый косяк GPU. Короче нафиг-нафиг-нафиг... потом буду заикаться от него из-за того что будут вспоминать добрым словом.
Итак поехали. Что нужно:
- система рисования всех лучей на GPU за 1drawCall;
- возможность задавать разные текстуры и прочие параметры лучам.
Для решения этой задачи придется писать код не только на стороне процессора, но и на стороне GPU. Идея такая: рейкастим на пути луча все что видим, отражаем луч от предметов, которые отражаю. В итоге получаем набор координат. Этот набор координа - это начала и концы сегментов лазерного луча.
Этот набор параметров (array) мы подаем в шейдер при генерации меша на GPU.
Так же мы подаем на GPU набор параметров (тоже array): цвет, индек текстуры, толщина луча и всего чего вам еще вздумается.
И да, лучше чтобы эти параметры подавал какой-то менеджер. То есть в менеджер мы подаем какие лучи нарисовать, а он собирает данные и передает их на GPU.
Сам лазерный луч будем рисовать так:
1) на концах луч должен быть светлее так как это выглядит естественно. Используем grayscale-маск текстуру для этого;
2) переход от центра луча к перифирии (цвет и прозрачность) задаются grayscale-маской;
3) ну и добавим какой-нибудь шум, типа cloud и будем анимировать его, чтобы имитировать туман или движение воздуха.
И да, желательно склеить маски и все на свете в одну текстуру, не цари чтобы баиндами разбрасыватья.
Как по точкам на GPU нарисовать линию. Идея такая:
- в шейдере линия имеет вектор направления (начало-конец)
- есть доступ к позиции камеры.
Ну и все, делаем в шейдере сross(lineDir, camDir) и получаем направление вектора толщины линии. Передаем в шейдер параметром толщины и им можем регулировать толщину линии.
На словах все просто, на деле ушло много времени. Вот рисую линии на GPU по координатам:
Как видно, все ровненько и красиво и текстуру не колбасит как на предыдущем видео. И что там за проблемы с GPU у него были... Так можно отрисовать хз как много линий, зависит от того сколько вершин Unity разрешает использовать (если не ошибаюсь). Вроде 65к в последний раз было максималкой, а это куча линий, мне хватит :)
Версия сырого луча и приемника луча:
Это видео с грейбокс-тестов. Ну, бокс как видно, совсем не gray XD Еще здесь нет нормальной градиентной маски на луче. Луч сильно упрощен: (нет тумана, градиент подобран на скорую руку, концы луча не засветлены... короче, артист не занимался тогда еще этим)
Качество графики у нас не такое, на видосе часть прототипа с минимальной графикой и моделями, которые используются только в процессе разработки:
В итоге линия (лазерный луч) выглядит так. Здесь уже все:
- градиенты настроены
- туман пост-процессом наложен поверх полупрозрачного луча
- концы засветлены
- есть немного анимации тумана
- вся отрисовка на стороне GPU за 1 drawCall, красота :)
Надеюсь кому-то пост понравился и кто-то нашел что-то полезное для себя.
Еще раз ссылки на материалы по игре:
https://twitter.com/CGAleksey
https://www.instagram.com/cgaleksey/
Спасибо за внимание :)
Как артист делал систему рисования линий для своей игры
Статья о том как художник/дизайнер бодался с системой рисования линий для игры и сделал ее :)
Кому будет интересна статья? Наверно всем, но не бывалым прогерам так как тут ничего нового для них нет. Читателя ждет МНОООГО видео, картинок и обьяснений "на пальцах".
Немного модного арта для затравки (который получился попутно и случайно в процессе тестов рисовалки):
В общем надоело смотреть на то как лазерный луч в нашей инди-игре не оставляет на стенах ничего. Абсолютно ничего. Пробовал trail добавлять, но он же исчезает. И смотрится trail так себе... Даже бомжам стыдно показывать.
Итак, поехали. Нужно было сделать систему рисования линий для игры. Линия должна рисоваться от лазерного луча на любой поверхности. Стал делать свою систему потому, что на AssetStore ничего такого нет. Есть одна система, но она:
1) рисование на каждом обьекте (static/dynamic) приводит к тому, что обьект вырывается из батчинга и создает +1 drawCall.
2) система рисует только точки. Ну типа как в Splatoon. Можно рисовать пятна, но не линии.
Очевидно, это мне не подходит, так что go делать что-то свое.
Это далеко неконечный вариант так как линии здесь не рисуются, рисуются "точки". За счет медленного движения мышки кисть рисуется часто и след выглядит как линия:
В сети можно найти кусочки кода и даже проекты, которые позволяют рисовать следы на какой-то одной модели.
Требования к системе такие:
- линии должны рисоваться на статических обьектах, но не всех. Динамические обьекты должны не давать рисовать линию на полигонах, которые ЗА ними.
- работает максимально быстро
- работает на любом железе на котором работает Unity
- число линий неограничего
- число цветов линий - неограничено
- рисовать можно не только линии
Задача эта для меня новая, никогда такого еще не делал, пришлось повозиться.
Как рисуются линии в комп-графике? Есть модель и игрок проводит по модели лучем. На модели должен остаться след. Нужно найти в каком месте рисовать этот след.
1) очевидно, полигоны, которые смотрят ОТ начала рисования линии не будут содержать на себе след. Потому, что это полигоны с противоположной стороны модели. Их можно отбраковать.
2) есть полигоны, которые смотрят на игрока и которые попали в область рисования линии. На них предположительно будет след от линии.
Ну вот, для наглядности:
Красная точка - начало луча. Синие линии - это сектор в котором луч повернулся. Стрелка показывает направление поворота (хотя это неневажно).
В итоге у нас есть треугольник, которым рассекли модель. Полигоны, которые повернуты от игрока (backfaced) сразу тупо отбросились и я их не сек плоскостью в кторой орудует луч.
Есть некоторые полигоны, которые повернуты к нам, но, которые не дожны рисовать на себе линию так как они перекрыты другими полигонами. Например, это полигоны в центре картинки. Для отбраковки таких линий, я запилил алгоритм отбраковки, который отсеивает их.
Вот фото работы этого алгоритма:
Красные линии - это то, что будет рисовать линию на модели. Желтые - это то, что отсечено.
Цифры и прочее - это для себя. Вообще пришлось сделать стенд и на нем все отлаживать. Стенд поддерживает подргузку линий из файла. если в игре что-то крякнется, приходится запускать отладчик, который подгружает в себя все логи и тестирует состояние игры на момент поломки. Удобно, всем советую искать баги невручную :) ну а потом, когда баг выявлен, ищешь что нагнулось в алгоритме.
Здесь просто тесты алгоритма, смотрел как работает:
В сцене может быть несколько "рисователей". Вот видео. где одновременно рисуется больше одного пятна за 1 раз. Кстати, тут видно, что нужно рисовать именно линии, а не пятна. Иначе между точками есть пробелы.
Здесь видно (подсвечиваю) полигоны на модели и какие полигоны секутся лучем (рисуют линию):
Здесь наглядно видно как работает рисование линий:
Удалось сечь обьект и рисовать на нем линию. Здорово!
Осталось сделат самую малость: найти обьекты, которые будут рисовать на себе линии.Вот водишь ты лучем в пространстве и нужно знать с чем луч пересечется. Для этого есть Оctree & BVH. Первый хорош для статики, второй для динамических обьектов. Спасибо GameDev.ru (а именно крутым парням foxes и kkolyan за подсказки).
Внедряем деревянные структуры, печем, запускаем. Работает!
Это не конечный вариант, но все же. Вот как смотрится след в действии:
Спасибо за внимание. На данный момент я занимаюсь больше артом и даже на такие беглые статьи не хватает времени.
Кому интересно, вот ссылки на меня. Здесь я выкладываю некоторые результаты по игре. Пока больше скетчами делюсь. Позже больше видео начну выкладывать ;) Подписывайтесь, это сильно стимулирует работать :)
https://twitter.com/CGAleksey
https://www.instagram.com/cgaleksey/