Для моих подписчиков: Где посты про шейдеры, куда пропал
Привет, ребята, я давно не появлялся с постами про магию шейдеров за что прошу меня извинить, рубрика оказалась несколько заброшена. Начало года вышло довольно насыщенным: я уволился из Sperasoft, в которой занимался в последнее время программированием графики. К слову, наконец, я могу похвастаться и проектом, в котором участвовал в качестве rendering-инженера: это ремастер Saints Row The Third.
Сейчас же у меня испытательный срок в очень крутой студии, после я обязательно расскажу, если можно будет. Еще довольно много свободного времени скушала подготовка к докладу про RenderDoc на DevGAMM, скоро обещают выложить видео.
А еще мы с ребятами взяли и решили делать игровое медиа, подумали: все вокруг делают инди-игры, а почему не сделать инди-медиа? Тем более у нас есть полезные инициативы для инди-разработчиков и трафик растёт,— нужно делать.
Но рубрика Магия шейдеров вернется совсем скоро, и если у вас скопились вопросы по шейдерам - спрашивайте в комментариях, я подготовлю пост с ответом на самые интересные и полезные вопросы. Так же я не забыл и про пост с книгами.
А еще сегодня состоялся релиз инди-игры The Light Remake от известного питерского разработчика игр Сергея Носкова. Это довольно известный разработчик, у Сергея много классных игр: Свет, Поезд, 35мм, 7й Сектор, последняя очень понравилась мне и даже моя жена, которая не очень любит игры, с удовольствием её со мной проходила.
И сегодня в 20:00 МСК приглашаю вас на стрим, Сергей любезно предоставил несколько ключей для розыгрыша (подпишитесь на твич, чтобы не забыть).
Текст мой, тэг моё и ссылочка на стрим, приходите: https://twitch.tv/coremission
Магия шейдеров 20: Идеи для шейдера дождя и брызг
Как сделать такой дождь? Идея реализации без системы частиц.

Прежде всего разберемся подойдут ли нам стандартные частицы из движка? Некоторые движки позволяют делать такие частицы, которые проверяют коллизии, и, например, вы сможете получить дождь, который не будет капать сквозь крышу. Как это реализовано? Будет ли это работать быстро? Нужно проверять.
Я же знаю рендерское решение, опишу его: нам нужен, большой вершинный буфер, в котором мы будем хранить наш вершинный "суп" с растянутыми квадами, которые и будут каплями дождя. Можно сгенерировать их одной толщины и длины, и в случайном порядке подвигать по высоте, и чтобы получить дождь останется только сдвигать их вниз.
Но как учесть крыши и другие горизонтальные поверхности?
Капли не должны пролетать сквозь поверхности, и чтобы этого добиться —можно сделать аналог shadowmap, получить глубину сверху и в шейдере проверять «а есть ли что-то над каплей?» и если есть – делаем по-аналогии с тем как, например, работает mesh-flipbook —не рисуем каплю вообще (про mesh flip-book я рассказывал в докладе Магия шейдеров, ссылка с таймкодом)
Поправьте меня, если я что-то упускаю, но этот подход легко применяется и для шейдера материала брызг,— рисуем брызги прямо на поверхности. Для них можем использовать и частицы - у нас есть обычный emitter частиц для брызг и мы в шейдере для материала этих брызг сэмплируем эту "глубину сверху" и сдвигаем капли вниз.
Регулируем количество частиц брызг, регулируем количество капель и получаем: ливень или небольшой дождь.
Преломление света
Ну и преломление света сквозь капельки, реализуется стандартно: в нашем пайплайне у нас будет предыдущий кадр с mip-уровнями, рассчитанными так же как для Bloom (очень популярный эффект про который множество статей) его то мы и будем сэмплировать в шейдере материала капель.
p.s. Ребята, да, я вижу ваши жалобы, что ничего непонятно без кода. Но я не пришел сюда учить. Я пришел показать идею, которую можно сделать. Для тех, кто разбирается в шейдерах хотя бы немного, мне кажется,— легко представить как подобное реализовать. Если никто не реализует — может быть я смогу сделать доклад для какой-то из конференций в этом году и расскажу про этот эффект подробнее, но видео-уроки делать я точно не буду.
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.
Магия шейдеров 19: ASCII Art Шейдер а-ля Watch dogs от Мэтта Старка
Я возвращаюсь к Магии шейдеров и сегодня хочу, как обычно, не вдаваясь в детали, рассказать как бы я сделал шейдер для такого post-эффекта.
Но, давайте, сначала вспомним: что это за ASCII-арт такой. Как сообщает нам Википедия: ASCII-графика — это форма изобразительного искусства, использующая символы ASCII на моноширинном экране компьютерного терминала или принтера для представления изображений.
🤔 А причем здесь хакеры и Watch dogs? ASCII-арт, помимо демосцены, частенько встречался в .nfo файлах с crack и keygen архивами. В этих nfo-файлах создатели crack'ов и keygen'ов указывали всякую информацию о своей команде, рисовали теги команды или просто какой-то симпатичный арт. Часто можно было увидеть там символьные черепа, монстров и другую симпатичную жуть, которой, наверняка вдохновлялись Ubisoft для создания логотипа группировки DeadSec.
Так как бы я сделал?
Сделаем fullscreen post-эффект: 1) Вычисляем Luminance 2) Сжимаем картинку до размеров нашей ASCII-картинки в символах. Сколько символов мы хотим чтобы у нас было на экране? 3) Делаем 1D LUT-текстуру с, отсортированными по количеству белого, символами 4) В последнем пассе используем картинку из шага 2 и LUT-текстуру из шага 3 чтобы отрисовать символы в экранную текстуру.
Простор для применения
- Можно блендиться между исходной текстурой и полученной в результате такого пост-эффекта, чтобы сделать какой-то красивый fade-эффект.
- Можно затенять пиксели символов, я предполагаю будет гораздо более объемная картинка
- Можно сделать цветной и добавить какую-то палитру
- Можно делать ближние символы более яркими, а дальние - тусклыми.
Как всегда любые вопросы в ЛС или в предложку можно задавать вконтакте, и мы, наконец, завели канал в телеграме: https://t.me/coremission
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.
Магия шейдеров 18: Видеозапись моего доклада про эффекты
Привет, ребята! Наконец на канале DevGAMM стала доступна видеозапись моего доклада про Магию Шейдеров! Еще раз огромное спасибо всем, кто пришел :)
В чем суть? Вы жаловались в комментариях, что я просто выкладываю гифки и ничегошеньки не объясняю про устройство эффектов в этих гифках. И я решил — возьму три эффекты из того, что я уже выкладывал в Магию шейдеров на Pikabu и разберу их подробнее, воспроизведу в Unity.
Я взял три эффекта: Портал/водоворот, parallax-based эффекты: красивые карточки для ККИ и лёд и молнию.
Немного слов про видео: Сам очень не люблю когда докладчики экают и запинаются, но тут уж так вышло — волновался. В 1.25х скорости смотреть приятнее, особенно в начале, когда я пытался справиться с волнением 😊
p.s. Вот тут ссылка на слайды и код: https://coremission.net/gamedev/kormishin-devgamm-minsk-2019...
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.
Магия шейдеров 17: Используем цвет вершин
Градиент в Vertex color можно использовать вместе с Displacement'ом в вершинном шейдере для вот таких эффектов.
Что конкретно происходит в этом примере: мы делаем pivot с помощью этого цвета, чтобы нижнюю часть спайков Displacement не затрагивал.

В конце ноября я был на DevGAMM в Минске и выступал с докладом Магия шейдеров: Популярные эффекты из видеоигр. Мы воспроизвели 3 эффекта из этой рубрики (имею в виду: Магия шейдеров) на пикабу в Unity!
Я сам очень стеснительный и было очень приятно, когда люди подходили и знакомились!
Кто-то из пикабушников был? Я был первый раз и мне очень понравилось! Indie Power!
Как всегда любые вопросы в ЛС или в предложку можно задавать вконтакте: https://vk.com/coremission
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.
Магия шейдеров 16: Lava-лампа
Нашел очень симпатичный и подробно-разобранный на гифке эффект lava-лампы, ребята!

Как всегда любые вопросы в ЛС или в предложку можно задавать вконтакте: https://vk.com/coremission
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.
Магия шейдеров 15: Шейдер силового поля/щита для космосимов
Не сложный в воспроизведении эффект, я бы делал без каких-либо симуляций жидкостей и рассчетов — заводим отдельную текстурку (вроде height map'ы) в которую будем отрисовывать наши колебания от ударов: при попадании пересчитываем координаты в UV-координаты этой текстуры и рисуем в нее 2d-тороид (кружок).
Его можно скейлить и делать fade-out со временем, можно брать "кадры" из атласа и делать спрайтовую анимацию, чтобы добавить деталей. В вершинном шейдере читаем нашу текстурку и применяем смещение вдоль нормалей, а в пиксельном добавляем свечение.

Я в процессе подготовки поста с литературой по шейдерам и до Магии шейдеров 20-25 точно будет пост про книги.
Как обычно любые вопросы в личку или в предложку можно задавать вконтакте: https://vk.com/coremission
Всем гектаров в имениях и легкости в движениях!
Смотрите остальные посты про магию шейдеров по тегам ниже.