🎨 Генеративное искусство, сложные алгоритмы визуализации
🔍 Разбор графики в играх и как это работает,
🎮 Свежие проекты из мира креативного кодинга
😎 Сообщества и конференции о которых стоит знать.

Авторский канал о визуальной стороне игровой индустрии и цифровом творчестве.

Ответ на вопрос: почему трудно быть мной тут

Codepen
Bluesky
x.com

В январе 2025 решил поучаствовать в Genuary, международном флешмобе генеративных художников, где весь январь на каждый день дан 1 запрос, которому не обязательно следовать, но стоит на него ориентироваться в идее для арта, далее буду весь январь постить что я генерировал с не большими комментариями что вдохновило или что узнал нового

Genuary 1: "Vertical or horizontal lines only."
https://codepen.io/lekzd/pen/OPLxKmV

самая первая работа на Codepen, которую добавили в тренды и сами Codepen расрашарили ее в своих соцсетях

Genuary 2: "Layers upon layers upon layers."
https://codepen.io/lekzd/pen/LEPOYvm

Genuary 3: "Exactly 42 lines of code."
https://codepen.io/lekzd/pen/WbeXRvL

большинство подошло к этом заданию 2 путями: использовали код в 42 строки, либо рендерили 42 строки кода, я пошел по второму пути, но в итоге все старания по генерации случайных блоков кода и придумывания переменных незаметны за глитчами

Genuary 4: "Black on black."
https://codepen.io/lekzd/pen/NPKwaRa

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

Genuary 5: "Isometric Art (No vanishing points)."
https://codepen.io/lekzd/pen/KwPyRpz

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

Genuary 6: "Make a landscape using only primitive shapes."
https://codepen.io/lekzd/pen/xbKPeKX

Пока самая залайканная везде работа, ведь где бы ты ни был, а панель в которой вырос она в сердце, идея взята с работ @DeepPixelMelancholy, который рисует пиксельарты по мотивам воспоминаний детства, которые вызывают довольно сильную ностальгию у всех кто вырос в похожем окружении

Genuary 7: "Use software that is not intended to create art or images."

Не самый простой день, я не мог придумать что делать до вечера и потом родилась идея, что редактор кода довольно быстро подхватывает изменения в файле, нашел что самый быстрый из тех что установлен был VS Code (для тех кто недоумевает, Vim обновляет файл только первый раз). В итоге я придумал, что можно запустить файл скрипта через node.js, перезаписать его и запустить еще раз чтобы снова перезаписать...

Genuary 8: "Draw one million of something."
https://codepen.io/lekzd/pen/XJrZmbw

1.000.000 точек, но как не странно для 3д это даже мало чтобы что-то нарисовать большое

Genuary 9: "The textile design patterns of public transport seating."

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

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

Genuary 10: "You can only use TAU in your code, no other number allowed."
https://codepen.io/lekzd/pen/GgKQxVd

когда-то я увлекался головоломкой на JS Return true to win, где надо было придумать что передать в функцию, чтобы она вернула true, так как просто алгоритмы это скучно половина заданий там идет с ограничениями на символы, например нельзя использовать цифры, прямо как в этом задании, но ничего страшного:

zero = TAU - TAU
one = TAU / TAU
two = one + one
animation = performance.now() / (TAU * TAU * TAU * TAU)

ну и название люди придумали "много крокодилов быстро пересекаю реку"

Genuary 11: "Impossible day - Try to do something that feels impossible for you to do ... Maybe it’s something you know nothing about how to accomplish."
https://codepen.io/lekzd/pen/ZYzxLLm

День когда надо попытаться сделать невозможное был пожалуй самым продуктивным пока, я начал с радиального узора в мароканском стиле. Здесь рисуется 1 треугольник, в нем еще 10, которые анимируются от центра к краям и наоборот, дальше он повторяется 20 раз по кругу и получившиеся круги повторяются заполняя весь экран. Чтобы избежать наложения используется маскирование

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

Далее я добавил туда линии и вышла...акварель!

Ну и, наконец-то, получился столь желанный калейдоскоп со стеклышками, залитыми полупрозрачным градиентом

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

Но я все еще не мог остановиться на достигнутом и сделал уже правильный мароканский узор, кстати, все 5 работ выполнены с использованием одной и той же палитры, взятой отсюда https://coolors.co/palettes/trending

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

Пожалуй, второй самый залайканный везде пост.

Genuary 12: "Subdivision"
https://codepen.io/lekzd/pen/ogvqdxZ

Разделение...что бы это могло быть, я не силен в алгоритмах где большой полигон делится на мелкие, потом еще и еще и я вспомнил, что еще когда начинал разбираться в вебе в 2010 году шуму наделала flash-анимация на сайте испанской певицы Labuat (судя по всему она так расфорсилась в рунете что домен захватил какой-то сеошный каталог, хе-хе).

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

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

UPD: нашел тред на гитхабе, где достучались до разработчика и он выложил видео на сайте https://github.com/open-source-flash/open-source-flash/issues/70

Genuary 13: "Triangles and nothing else."
https://codepen.io/lekzd/pen/VYZXNdy

Треугольники значит, нарисовал сетку на треугольниках и отрендерил на ней цвета при помощи кода:

(1 + Math.sin((y) / 40) + Math.cos((x) / 50))

когда не знаешь что делать бери синус и косинус)