Сетка — кодинг для дизайнеров

Машин вызов

Маша в комментах предложила такой референс. Я решил не повторять, а вдохновиться и сделать что-то в этом направлении, а именно шестиугольники с кружками.

Кончено же на шейдерах! На п5-то все смогут.

После часа мучений с координатами, забил.

А вот только созванивались с Патрисио, автором лучшего учебника по шейдерам thebookofshaders.com, он показал, как решить задачу с помощью его инструмента lygia.

Лиджиа — часть его экосистемы для написания шейдеров, главная фишка — огромное количество готовых GLSL функций на все случаи жизни. Например, для деления пространства на шестиугольники.

Я рассказал про Сетку генеративному художнику Питеру Пасме, название перевёл как The Grid. И он сразу прислал вот этот трек

Мы с Адамом здорово повеселились, бросая друг другу вызовы. И тут я понял, что нечестно оставлять вас в стороне. Вдруг вы тоже хотите бросать и принимать вызовы?

Пришлите в комменты картинку или две, которые было бы прикольно повторить кодом, а мы попробуем. Если и вы присоединитесь к кодингу — вообще кайф.

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

А как понять, что красиво?

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

Конечно, есть Вкусомер. Но Вкусомер — это экзамен, а не учебник. Он не объясняет.

Я читаю канал дизайнера Жени Арутюнова, автора книги «Сложный дизайнер». Он называется «Это красиво, а это нет». Каждый день там выходят рецензии от разных ребят на дизайн вывесок, интерфейсов, логотипов и вообще всего чего угодно. Каждый пост подробно объясняет — почему это красиво, а это нет. А ещё само содержание рецензии важнее, чем вердикт.

Каждую неделю можно прислать свой или чужой дизайн на уничтожение или восхваление. Подписывайтесь.

https://t.me/thisisfinethisisnot

Сидим мы сегодня с Адамом, готовим материалы для курса по шейдерам. И вдруг он такой «Да у тебя ведь паттерн Я.Дзена получился!» Мы ещё пару символов поменяли и вообще хорошо стало. Пойдём Яндексу продавать.

Я подумал, что прикольно было бы сделать мини-версию для всяких фавиконок 16×16 пикселей. И сделал сразу кодом.

Там наверху есть секция с переменными, можно понастраивать углы поворота и толщину линии. Попробуйте, редкатор прямо в браузере работает. https://twigl.app?ol=true&ss=-NaVpVOKzFwnuYeVBULP

И покажите в комментах, что получится!

Недавно лайвкодил на фестивале LES, у них есть вот такой логотип.

Герберт В. Франке
1927—2022

Франке изучал физику, математику, химию, психологию и философию в Вене. Защитил докторскую по электронной оптике. Читал лекции по «кибернетической эстетике» в Мюнхенском университете стал одним из основателей культурно-технологического центра Ars Electronica.

А ещё он писал фантастику, попробую найти и почитать.

Вики, Музей V&A
#генеративные_художники

Адам Арутюнов отвечает на вопросы которые придумал сам.

Зачем дизайнеру программировать?

Можно придумать красивый ответ — «это весело и увлекательно и вообще очень классно!». И это правда. Можно придумать устрашающий ответ — «иначе тебя заменят нейросети и ты останешься без работы» и это неправда. Спокойный и прагматичный ответ — так можно заработать больше денег.

Делать макеты — это хорошо, но за это же время можно сверстать полноценный сайт и продать его в пять раз дороже. Тильда и Редимаг — это хорошие инструменты, они позволяют очень быстро делать типовое, но сильно ограничивают тех, кто делает что-то своё. Ещё это чьи-то инструменты, с ними может случиться всё что угодно. А HTML, CSS и JavaScript — это открытые технологии, их никто никогда не отберёт, не забанит и не заблокирует.

Дизайнер, который понимает язык разработчиков и умеет на нём говорить, становится намного ценнее в команде. Его макеты логически целостные, он представляет ограничения веба и даже может сам вносить стилистические правки в коде. Такому можно сказать «создай пулреквест? я ща вмёржу в мастер и задеплоится» и рассчитывать на понимание :—).

Нейросети не заменят дизайнеров, но прошаренные дизайнеры заменят консервативных.

Почему вы учите программированию именно дизайнеров? Там какое-то особенное программирование?

Нет, само программирование абсолютно такое же. Просто это задаёт контекст, в котором мы лучше рассказываем материал. Нам не нужно объяснять, как работают координаты X и Y и что такое RGB, мы можем проводить аналогии с вёрсткой макетов в Фигме или Иллюстраторе. Сужение целевой аудитории позволяет точнее решать специфические проблемы учеников и говорить с ними на одном языке.

Ещё мы любим автоматизацию дизайна и верим, что за ней будущее. Мы даём ученикам новый инструмент и очень радуемся, когда они делают с помощью него что-то красивое.

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

Правда.

(В интерфейсе телеграма самое странное, что кто запостил отложенный пост, тот и считается его автором.)

(На самом деле, это сделал и написал Иван Дианов, а не я.)

Думаете, легко было придумать название «Сетка»? Нет. Было нелегко. Вот какие варианты мы тщательно рассмотрели и решительно отвергли.

Вдруг мы ошиблись? Какой вам нравится?

Псст. У нас есть инста с классно кропнутым названием курса. Подписывайтесь, скоро будут и другие
https://www.instagram.com/setkadesign/

И тут же я вот так! Адам, слабо обить автобусное кресло? :–D

Ваня отвечает на вызов Адама псилоцибиновой плиткой
Вот код. Угадайте, какую из плиточек я выбрал как реф.

Допустим, вы захотели сделать бомбу.

(Нет, надо добрый пример.)

Допустим, вы сделали суперклассный и важный проект и хотите заинтриговать посетителей сайта обратным отсчётом до заданной даты анонса.

Сегодня сделаем такой таймер на джаваскрипте за 15 минут!

Мне кажется, что я подтупливаю на этом видосе. Поделитесь фидбеком :—)

Сетка

Если вам понравились работы Бэна Лапоски, посмотрите, что вытворяет Jerobeam Fenderson!

Он использует похожий приём: рисует на экране с помощью колебаний. Но колебания эти звучат!

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

https://www.youtube.com/watch?v=YqSvkNjWnnQ
#генеративные_художники