Creative Coders At War

2021-07-24 15:22:55 Крутой видос про оптимизацию шейдеров, вкратце:

• GLSL функции выполняются с разной скоростью: умножение и сложение 4 такта, sin/cos по 20 тактов, тангенс около 56. Посмотреть брейкдаун вашего кода можно здесь

• сэмплинг текстуры — самая дорогостоящая операция, 300+ тактов; лучше посэмплить текстуру в начале, потом посчитать не связанную с ней математику и в конце их соединить, так простой от ожидания текстуры будет минимальным

• при сэмплинге возвращается не один тексель, а ещё и небольшая область вокруг него, она остаётся в кэше; если в дальнейшем сэмплить соседние значения и не скакать по всей uv, то шейдер будет работать быстрее. благодаря этому же есть почти бесплатные функции dFdx() и dFdy(), но об этом в другой раз :)



Открыть/Комментировать

2021-06-05 01:31:43



Ещё не смотрел, но с виду он рассказывает как я делаю эти свои демки :)

Update: он использует реймарчинг вместо рейтрейсинга, что не даёт ему возможности переотражать лучи больше пары раз без превращения в слайдшоу. С рейтрейсингом правда другая проблема — время компиляции шейдера растёт экспоненциально с каждым новым отражением

А остальное всё то же самое, refract + reflect и готово

Во второй части наверняка будет изменять IOR для каждого канала для анаглифа и форму изменит на тессеракт (вроде это он вначале)

В общем, годно, рекомендую к просмотру :)

#tutorial Открыть/Комментировать

2021-05-18 13:55:36 Немного рейтрейсинга и глитчей с отрицательной рефракцией

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

Дрибббл

#my #reference Открыть/Комментировать

2021-05-13 22:16:03 простая и внятная статья о том, как пользоваться шумом в creative coding

а ещё там есть интерактивные примеры, много красивых гифок и ссылки на инструменты

https://varun.ca/noise/ Открыть/Комментировать

2021-05-13 13:22:41 #inspiration by Artemiy Lebedev Открыть/Комментировать

2021-05-12 15:15:59 Живые материалы в ThreeJS Идея не нова и довольно проста — бери да анимируй что-то в шейдере в зависимости о времени. Самое простое — изменять цвет, либо просто текстурные координаты, но если хочется чего-то покруче то приходится интегрироваться с PBR системой… Открыть/Комментировать

2021-04-28 13:57:56 Живые материалы в ThreeJS

Идея не нова и довольно проста — бери да анимируй что-то в шейдере в зависимости о времени. Самое простое — изменять цвет, либо просто текстурные координаты, но если хочется чего-то покруче то приходится интегрироваться с PBR системой трёхи. И это не так удобно как хотелось бы :)

В этих демках ради скорости прототипирования я каждый кадр пререндерил карты шума и нормалей и использовал их для различных свойств материала. Сначала думал обойтись без нормалей и использовать шум как bump map, но на третьем видео отлично видна "пикселизация" — нехватка данных для dFdx. К счастью в Генклубе недавно выложили несколько ресурсов по шумам, и среди них был шикарный репозиторий с реализациями различных шумов с вычислением производных. Очень рекомендую! В принципе производные можно найти и вычисляя шум для соседних фрагментов, но это х5 больше вычислений

В продакшн такое решение с пререндерингом не стоит запускать, лучше заморочиться и реализовать всё в шейдере собственно материала. Так должно работать сильно быстрее. Проблема тут в системе материалов ThreeJS и способе их кастомизации, придётся разобраться как она работает, подменять шейдер чанки на свои и это адский ад, но всё равно это быстрее чем писать свой PBR.

Кстати, существует инструмент типа Shader Chunks Explorer, который очень упрощает жизнь когда в этом разбираешься, но я потерял ссылку :) Если у кого есть, поделитесь пожалуйста.

Ну и конечно же поддержите на дрибббле

#my #reference Открыть/Комментировать

2021-04-28 13:57:51 Открыть/Комментировать

2021-03-15 16:56:26 Crystal Sculpture. Real-time raytracing.

https://expo.encharm.studio/crystal/

Кому понравилось, поддержите на дрибббле

#my Открыть/Комментировать

2021-03-13 12:11:01 Сегодня каналу исполняется год.

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

Ворожба над тёмной водой, mathimages, karpik.realtime, @razuznak, Генклуб, TouchDesigner Far East — этот год был полон крутых открытий! Ну и не забываем про топовый чат @webgl_ru, который с нами уже очень давно :)

Про позиционирование канала — в описании вроде бы красуется "как брать аварды", а по факту тут и в чате в основном творится какая-то бесовщина с сложными и не-очень-продакшн вещами. Но как раз эти эксперименты и техники и создают то что будет возможно через год блистать в авардах, а ещё через два года окажется в конструкторах сайтов. Так что мы тут за передней гранью веб-разработки А каналов с очередными библиотеками, базовыми туториалами, дрибббл-шотами или списками сайтов с наградами — и так достаточно. Ну и само собой играет фильтр личных предпочтений, контент ради контента не стоит внимания, только лучшее, только самое интересное для мсье знающих толк

За год на канале собралась аж почти тысяча подписчиков, чему я удивлён. Думал тут наберётся максимум пара сотен человек, исходя из описанной специфики, но, видимо, крутых ребят больше чем я думал, и это не может не радовать Но сами по себе люди вряд ли находили этот канал, поэтому хочу выразить благодарность за неоднократную помощь ребятам из чата Промакса, Бездарным ссылкам, Промаксконтенту, UX Live который за один пост умножил количество подписчиков на 2, чатам Bang Bang Education и Uprock Offtop которые не трут форварднутые посты, даже если в них есть призывы подписываться, и @Lex_Murrey за то что ему нравится мой канал и он не стесняется об этом иногда писать в самых неожиданных местах :) У него кстати есть уютное сообщество Designtegration, вы знаете что делать

Кого забыл или о ком не знаю — извините, можно в комментариях делиться ссылками, буду рад познакомиться :)

В общем, cheers! В этом году нас ждёт ещё больше нового, крутого, пандемия при всех своих жестоких минусах создаёт отличную конъюнктуру для веба, в сафари скоро наконец-то появится WebGL 2 и он не будет таким отсталым, да и вообще кто знает, какой черный лебедь прямо сейчас проплывает перед глазами. И да, чёрные лебеди — не обязательно что-то плохое :)

И на картинке спойлер, в чате обсудим Открыть/Комментировать