Спросить у Ивана Дианова
Новый набор

Курс по шейдерам

18 мая — 11 июн
9 занятий
Записаться

О курсе

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

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

Чему вы научитесь:

  • Писать шейдеры на GLSL;
  • Программировать классические визуальные эффекты, комбинировать их или придумывать свои;
  • Находить и исправлять ошибки в коде;
  • Переключаться на шейдерное мышление, «думать пикселями».

Требования

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

Курс подойдёт

Дизайнерам и медиа-художникам

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

Веб-разработчикам

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

Арт-директорам

Будете понимать возможности и ограничения современных дизайнерских генеративных инструментов. А может, сами начнёте программировать визуальные эффекты.

Тем, кто пишет на Процессинге или p5

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

Зачем учить шейдеры в эпоху ИИ

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

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

Например, можно сказать: «нарисуй кружочек». Но в шейдерах нет команды «кружочек». Зато можно сказать: «напиши SDF для окружности и используй его как критерий маски». И тогда вы начинаете разговаривать с ИИ-агентами через SDF, как профессионал.

Программа

Курс состоит из девяти занятий.

Первые два занятия — вступительные. На них мы рассказываем основы программирования шейдеров и пишем самые базовые примеры.

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

Мелким текстом написаны технические аспекты для тех, кто уже разбирается в шейдерах.

1–2.

Основы

  • Что такое шейдеры. Базовая структура GLSL-программы;
  • Редактор и Хеллоу-Ворлд;
  • Система координат, gl_FragCoord, UV-координаты;
  • Типизация в GLSL, вектора, функции, циклы;
  • Встроенные функции: step, floor, smoothstep, fract, mod, sin, cos;
  • Текстуры, изображения;
  • Работа с мышкой.

3.

Гринскрин

  • Использование изображений и видео;
  • Фидбек-луп и фрейм-буферы;
  • Проход по окрестностям пикселя;

4.

Блур

  • Интерактивное размытие при движении мышки;
  • Точность данных и цветовой бендинг;

5.

Сетка (Мальстрём)

  • Повторение пространства;
  • Синусы и косинусы для вращения;
  • Вложенные циклы для обхода сетки;
  • Вычисление яркости пикселя.

6.

Sprite

  • Техника спрайтов (повторение изображения);
  • Плавное переключение масштаба: mod(t), комбинации smoothstep;
  • Работа с видео: пауза до клика, отключение аудио;

7.

Карта высот

  • Использование картинки-градиента для простого подбора цветов;
  • Нормали и освещение;
  • Линейная алгебра на практике: normalize(), dot-product, матрица поворота;

8.

Сабдивижен

  • Генеративные буквы;
  • Фрактальность и рекурсивное деление;
  • Генерация текстуры в p5.js и передача в шейдер;
  • Псевдослучайные числа: PCG-алгоритм;
  • Концепция ID — уникальная идентификация элементов.

9.

SDF

Формат

Курс длится месяц и состоит из девяти онлайн-занятий по полтора часа. Занятия проходят два раза в неделю, по понедельникам и четвергам в 19:00.

Все занятия записываются и выкладываются в закрытый телеграм-канал.

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

В курс входит:

  • 9 живых занятий и их записи;
  • Исходный код всех примеров;
  • Доступ в закрытый чат учащихся и выпускников;
  • Поддержка в течение месяца после окончания курса.

Доступ к записям занятий и к чату остаётся на два месяца после окончания курса.

Отзывы

Мы проводим курс по шейдерам в первый раз, поэтому отзывов на него ещё нет.

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

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

Вот несколько отзывов на курс генеративного дизайна:

Аня Юдаева, тимлидка графических дизайнеров

Самое полезное, пожалуй, — то, как вы разжевывали логику JS. Условно, как перевести запрос с человеческого языка на язык программирования — и всё с примерами и пояснениями каждой строки).

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

Сто мильонов раз спасибо за курс! Отдельно спасибо за минутки клоунизма в зуме от Адама и от Ивана, они разбавляли атмосферу и помогали взбодриться). Я очень жалею, что не хватило внимания на последние занятия, но надеюсь вскоре наверстать и оживиться в чате-лобби.

Нина Москалёва, дизайнер и художник

Наконец, кажется, поняла, как работают массивы). Вы оба круто объясняете сложные для не-программистов концепты! Отличные метафоры, с ними всё становится легче).

Здорово, что вы ведёте курс вдвоём.

В процессе не всегда понятно, что что-то непонятно. Дополнительные вопросы, которые вы задаёте друг другу, очень помогают, когда повторяешь скетч самостоятельно. Спасибо за курс <3.

Анастасия Назарова, графический дизайнер

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

Самое полезное — что теперь у меня есть новый инструмент, я представляю, как он работает и как продолжить учиться его использовать.

Ребята, вы очень обаятельные и внимательные к ученикам. Это отдельный кайф — учиться у таких преподов :-)

Лена Калачёва, графический и моушн дизайнер

Во-первых, я впервые что-то сделала в p5.js).

Во-вторых, JS стал чуть ближе, чем раньше. Пересматриваю по N-ному кругу видеоуроки, экспериментирую (пока в рамках заданий). Самое полезное — это, наверное, некий старт, который проще и интереснее делать с проводниками ;)

В целом курсом довольна! Ожидания оправдались! Возможно, тем, кто с кодом знаком поверхностно (как я), нужно больше уроков, может быть, какой-то более продолжительный курс.

Ребят, спасибо вам за курс! Вы крутые, доходчиво и позитивно подаёте информацию. Хоть и с домашками я вовремя не успела (они в процессе). Я бы порекомендовала ваш курс друзьям, это точно!

FAQ

Я никогда не программировал, мне подойдёт курс?

Записаться на курс «Основы программирования шейдеров»

14 900 ₽
Сейчас
16 900 ₽
С 18 мая

После оплаты появится ссылка в Телеграм с доступом к курсу.

Принимаются российские карты. Если такой нет — пишите, что-нибудь придумаем. Можно оплатить по СБП или по реквизитам ИП. Принимаем оплату по безналу от юрлиц.

При покупке действует публичная оферта и политика обработки персональных данных.