Genuary 15: "Design a rug."
https://codepen.io/lekzd/pen/emOKZMv

Мастерим коврик) Началось все с попыток сделать гексагональную плитку Труше, так как для ковра вполне подходят абстрактные структуры и казалось что буквально добавить рандома и все полетит. Но сделать из этого красивую картинку на рандоме не вышло, в итоге гексы остались, а их заполнение стало в разы проще чем планировалось. Потому я обратился к старому доброму паттерну sin + cos и повторил его отдельно для края ковра.

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

Genuary 16: "Generative palette."

https://codepen.io/lekzd/pen/VYZdyJM

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

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

Кстати, вычитал на Википедии, что данный тип орнамента классифицирован с 17 другими возможными вариантами и называется p4 (то есть 4 поворота), ранее я делал узоры по наитию, теперь можно пробовать использовать шаблоны, описанные еще 130 лет назад.

Иногда банан это просто банан

10 итишников за столом, много пива спустя, на стене висит картина с кольцами, повернутыми в разные стороны. Бармен очередной раз проходя мимо шутливо закидывает нам идею что картина может быть не просто картина, а шифр! На все подсказки реагирует улыбкой Моны Лизы, чем еще сильнее подталкивает нас к исследованию.

За полчаса опробовано:
— шифр Цезаря
— 8-ричная система исчисления (у колец 8 поворотов)
— чат гпт
— бинарные последовательности

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

Короче, кто-то копает что за кольца, кто-то ищет инфу про художника, я начинаю обводить на картине последовательности, которые неожиданно прерываются без всякой логики. В итоге находим заметку о выставке, где была эта картина, оказывается смысла в написанном реально нет. А последовательности символов такие, потому что художник использовал трафарет, переворачивал его и сдвигал на 1 символ, чтобы было немного по-интереснее. А вся суть картины в том, что тут изображена адресная табличка, а все остальное заполнено кольцами Ландольта, которые используются для проверки зрения и ВНИМАНИЯ, такой вот символизм. Художник говорит что там еще на первом слое какая-то молния нарисовано, но кто знает... заходите лучше в бар Ящик пива где висит эта картина, и не такое узнаете.

Genuary 17: "What happens if pi=4?"

Для тех кто недоумевает что такое Genuary, в этом посте я объяснял

Когда буквально первый эксперимент приводит к неожиданным последствиям: берем число PI которое будет равно 4, рисуем 8 полукругов с поворотом ((PI * 2) / 10) поворачивая их по часовой стрелке и получается лягушка в очках. Мне оставалось только добавить ей глаза и анимировать ее движения чуть-чуть сдвигая углы конечностей. Почти генеративный брендинг для @laranatech =)

В начале хотелось сделать просто веселых танцующих лягушек с открытым ртом, но когда переборщил с увеличением решил оставить. Так еще одна работа вышла просто случайно.

https://codepen.io/lekzd/pen/raBrNMY

Genuary day 18: "What does wind look like?"

https://codepen.io/lekzd/pen/KwPBzrd

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

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

Genuary 19: "Op Art."

Оптическое искусство, снова ограничился только черным и белым, получился хоррор с глазами как в игре Stray.

https://codepen.io/lekzd/pen/ByBPVzO

Genuary 20: «Generative Architecture.»
https://codepen.io/lekzd/pen/OPLwYJv

Я два раза был в Соборе Святого семейства в Барселоне, он начал строиться еще с 1882 года и до сих пор возводится, исключительно на донаты, в том числе и мои)

Завтрашний день в Genuary посвящаю этому великолепному храму, желаю каждому увидеть его в живую.

Как начать заниматься генартом

Нужно учить алгоритмы? Computer Science? Все проще, нужно правильное окружение и проводники.

Для меня таким стал Генклуб, только там на полном серьезе кидают картинки как выше и видят в них искусство, это кстати была реакция на мой прошлый пост про собор Саграда Фамилия, который проектировался через веревочно-тряпочные прототипы с грузиками, ради получения нужных линий ровно как пыль в системнике выше)

Но еще ранее кто-то должен был меня туда привеcти и это были Паша, который часто рисует генарт на ThreeJS, в том числе и для BeerJS и Вася, который очень любит создавать генеративные миры. Обоих я нашел в чатике по WebGL, так как часто ищу новых спикеров для конференций. А теперь они активно влились уже к нам в BeerJS.

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

Genuary 22: «Gradients only.»
https://codepen.io/lekzd/pen/QwLVYgJ

Запускаем механизм с любимой палитрой

Genuary 23: "Inspired by brutalism."
https://www.shadertoy.com/view/M3cBWS

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

Ray marching или подробнее о том как сделано видео из прошлого поста

Ray Marching — это метод рендеринга, основанный на трассировке лучей, который используется для визуализации трёхмерных сцен. Притом для достижения этой трассировки лучей совсем не нужна RTX видеокарта. Почему? Вместо того чтобы работать с тяжелыми объектами из 3д редактора, этот метод описывает геометрию с помощью математических функций, определяющих расстояние от точки в пространстве до ближайшей поверхности (Distance Fields). Алгоритм последовательно “шагает” вдоль луча, уменьшая расстояние до объекта, пока не достигнет поверхности или выйдет за пределы сцены.

Как это работает?

Основная идея в том, чтобы каждый шаг приближал нас к ближайшему объекту, используя функцию расстояния. На каждом этапе мы проверяем, пересекли ли объект (расстояние стало достаточно малым). Это позволяет эффективно рендерить сцены с множеством объектов, сложными поверхностями или даже изменяющимися во времени формами. Ray Marching идеально подходит для процедурной графики: например, вы можете описывать целые миры с помощью нескольких уравнений, правда повторенных тысячи раз)

Почему это круто?

Видите видео в посте? Это работа Inigo Quilez, где он на стриме, в течение 5 часов 28 минут шаг за шагом делал из шарика, этого персонажа и остальное окружение. Если подробнее описывать как я делал свою первую сцену, то я взял шаблонный шейдер с которого можно начать свою первую сцену, загнал его в ChatGPT и попросил объяснить как это работает, как туда что-то можно добавить и спросил про основные техники, которые можно использовать. Сидел я конечно долго, даже на BeerJS за пивом дописывал его, но это вышел буквально hand-made свитер, кривой, косой, но такой любимый)

Genuary 24: "Geometric art - pick either a circle, rectangle, or triangle and use only that geometric shape."
https://codepen.io/lekzd/pen/GgKwEjd

Я выбрал кружки и Мону Лизу с прошлой работы, еще сделал генеративную палитру, думаю если подобрать диапазоны на цветовом круге HSL правильно можно делать довольно хорошие палитры.

О, я здесь живу

https://www.ivd.ru/dizajn-i-dekor/kvartira/kak-dizajner-oformila-interer-dlya-sebya-yarkaya-kvartira-69-kv-m-s-klassnoj-pereplanirovkoj-i-iskusstvom-134992

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

PS: картины на стенах тоже ее

Перерыв на канале

Стоило мне в недавнем подкасте Тяжелое утро (https://www.youtube.com/live/iAWDqrkJZZ0?si=d2rbnuxcaAlvVl1p) в первую минуту рассказать о тяготах круговорота болезней в семье после того как ребенок начинает ходить в детский сад, как мы умудрились заболеть все вместе. Кстати, после записи этого подкаста, я обнаружил у себя дома скорую помощь, приехали сбить дочери жар.

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

Ну и, надеюсь, продолжу скоро)

Genuary 26: «Symmetry.»
https://codepen.io/lekzd/pen/NPKoBLO

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

PS: Нас уже 100! Спасибо что присоединились)