Главное о профессии

Инструменты и методы, которые нужно знать

Всё это вы освоите на нашем курсе — даже если вы не очень творческий человек и не умеете рисовать.

Figma
Adobe Photoshop
Tilda
HTML
CSS
Типографика
Композиция
Генерация идей

Сколько можно зарабатывать

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

Источник: RealHR
47 000–72 000 ₽
Junior
85 000–115 000 ₽
Middle
130 000–197 000 ₽
Senior

Чему вы научитесь за 9 месяцев на курсе

  • Понимать визуальный язык и следить за трендами в дизайне
  • Выстраивать композицию, работать с цветом и шрифтами
  • Создавать или подбирать для сайтов иконки и анимацию
  • Анализировать целевую аудиторию и конкурентов
  • Проектировать взаимодействие пользователей с интерфейсом
  • Разбираться в вёрстке сайтов и веб-приложений
  • Адаптировать дизайн под разные гаджеты
  • Взаимодействовать с заказчиками и командой
  • Аргументировать решения и оценивать свою работу

Как проходит обучение

YandexGPT помогает учиться

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

Программа курса

Составили программу с учётом требований работодателей: будете учить только то, что нужно для решения настоящих задач веб-дизайнера
4 темы・~8 часов
Бесплатно
Каково это — быть веб-дизайнером
Этот модуль бесплатный, чтобы вы побольше узнали о профессии, примерили на себя роль веб‑дизайнера и решили, хотите ли развиваться в этом направлении
  • Figma
  • Цвет
  • Типографика
  • Композиция
  • Исследования
  • Прототип
Введение в профессию
Чем занимается веб‑дизайнер. Необходимые навыки, рабочие задачи и инструменты веб‑дизайнера. Векторы развития в профессии.
Базовые навыки веб‑дизайнера
Работа с цветом. Подбор шрифтов. Построение композиции.
Знакомство с Figma
Что умеет графический редактор Figma. Основные функции Figma для веб‑дизайнера.
Как делать лендинги
Техническое задание. Исследования. Прототип. UI-кит.
Изучите основы Figma и окунётесь в типичный рабочий день веб‑дизайнера: спроектируете свой первый полноценный лендинг с нуля
10 тем・3 недели
Аудитория и визуальная коммуникация
  • Основы Figma
  • Визуальное сообщение
  • Целевая аудитория
  • Референсы
  • Мудборд
Основы Figma
Интерфейс, фреймы, навигация. Плагины в Figma.
Визуальная коммуникация
Простые сообщения: знаки и указатели. Как целевая аудитория влияет на коммуникацию. Декодирование. Что мешает передаче сообщения.
Целевая аудитория
Портрет и признаки целевой аудитории. Определяем аудиторию, уточняем портрет.
Насмотренность
Где искать вдохновение. Как прокачать насмотренность. Режим исследователя. Как анализировать чужие работы. Референсы.
Мудборд
Что такое мудборд и зачем он нужен. Как собирать мудборд.
Проанализируете целевую аудиторию и соберёте мудборд для приложения
9 тем・3 недели
Композиция и сетки
  • Сетки в Figma
  • Основы композиции
  • Визуальная иерархия
  • Модульная вёрстка
  • Аргументация решений
Композиция
Визуальная иерархия. Якорные объекты. Доминанта и композиционный центр. Как сделать объект доминантой. Целостность. Статика и динамика.
Сетки в дизайне
Модульная вёрстка. Модульные сетки. Из чего состоит сетка. Сетка как инструмент ритма. Базовая единица. Настройка колоночной сетки. Сетки в Figma. Алгоритм работы с сетками.
Аргументация решений
Как отстоять макет перед арт-директором, заказчиком, разработчиком.
Соберёте макет страницы из готовых блоков: поработаете с композицией, отступами и подачей информации в интерфейсе
11 тем・3 недели
Основы типографики и работа с текстом
  • Текст в Figma
  • Типографика
  • Вёрстка текста
  • Бриф
  • Техническое задание
Гарнитуры и шрифты
Текстовые и акцидентные шрифты. Шрифтовые пары. Откуда брать шрифты.
Как сверстать текст
Гигиена текста. Интерлиньяж и длина строки. Выравнивание. Базовые элементы и иерархия. Как упорядочить стили.
Работа с заказчиком
Техническое задание. Бриф. Что делать, если информации мало.
Сделаете редизайн: обновите визуал, переработаете структуру главной страницы сайта
9 тем・4 недели
Работа с цветом и изображениями
  • Изображения в Figma
  • Цветовые пространства
Цвет
Характеристики цвета. Цветовые пространства. Цветовой круг Иттена. Контрастность. Фон и акцент. Читаемость. Готовые палитры.
Работа с изображениями в Figma
Поиск и подготовка изображений. Цветокоррекция и работа с изображениями в Figma.
Составите техническое задание на основе брифа от заказчика и создадите лендинг
10 тем・3 недели
Введение в UX
  • Пользовательские сценарии
  • Качественные исследования
  • Количественные исследования
  • Гипотезы
  • Паттерны
Работа с командой
С кем взаимодействует веб-дизайнер. Как коммуницировать в дизайн-команде. Методы эффективной коммуникации.
Исследования
Исследования в работе дизайнера. Методы исследования: количественные и качественные. Дизайн-эмпатия. Гипотезы.
Пользовательские сценарии
Дизайнер как сценарист. Точка входа и призыв к действию. Типы сценариев. Экстренный сценарий. Длина сценария. Как продумать и записать сценарий. Сценарии в Figma. Блок-схемы.
UX и UI
Пользовательский интерфейс, пользовательский опыт. Виды интерфейсов. Паттерны в дизайне. Эвристики Нильсена. Юзабилити.
Вместе с командой проведёте исследование компании и создадите сценарий будущего сайта
15 тем・3 недели
Лендинги, вайрфреймы, сетки
  • Вайрфрейм
  • CTA
  • Юзабилити
  • Auto Layout
Лендинги и вайрфреймы
Типы лендингов. Структура лендингов. Зачем нужен вайрфрейм. Каким должен быть вайрфрейм.
Сетки 2.0
Фиксированные сетки. Адаптивные сетки. Вложенные сетки. Принципы работы с сетками в веб-дизайне.
Автолейауты
Возможности Auto Layout. Как добавить и настроить Auto Layout. Auto Layout в действии. Структурируем экран приложения.
Сделаете лендинг с нуля: от прототипа до дизайна
12 тем・4 недели
Растровая графика и типографика
  • Adobe Photoshop
  • Веб-типографика
  • UI-кит
  • Компоненты
  • Метафора
  • Дизайн-система
Растровая графика
Знакомство с Adobe Photoshop. Кадрирование изображения, обтравка изображения, цветокоррекция, стилизация изображений. Использование мокапов.
Типографика 2.0
Отличие типографики в печати и веб-дизайне. Композиция в типографике. Ресурсы для работы со шрифтами: Adobe Typekit, Google Fonts и Font Squirrel.
Иконки
Системные и коммуникационные иконки. Паки с иконками. Работа с иконками. Проектирование иконок: сетка. Оптическая компенсация и выравнивание. Как нарисовать иконку в Figma.
UI-кит
UI-кит и дизайн-система: в чём разница. UI-кит и атомарный дизайн. Что входит в UI-кит. Стили и компоненты.
Создадите лонгрид, к которому нарисуете иконки и полноценный UI-кит
12 тем・3 недели
Введение в Tilda
  • Tilda
  • User Flow
  • Tone of Voice
Как делать сайты
Виды сайтов. Отличие сайта от лендинга. Структура и принципы построения сайтов. Информационная архитектура. User flow.
Введение в Tilda
Начало работы в Tilda. Настройка проектов и базовых блоков. Работа с zero-блоками. Продвинутые инструменты Tilda.
UX-копирайтинг
Дизайнер, пользователь и текст для интерфейса. Tone of Voice. Виды отображения текста. Синтаксис. Сообщения. Плейсхолдеры. Пустые состояния. Работа с UX-редактором.
Создадите с нуля многостраничный сайт на Tilda
10 тем・3 недели
Адаптивный дизайн
  • Адаптивная вёрстка
  • Резиновая вёрстка
  • Mobile First
Адаптивы
Что такое адаптивный дизайн и зачем это нужно. Как дизайнеру выбрать тип вёрстки. Адаптивность и размеры устройств. Mobile First.
Работа с заказчиком
Как выглядит работа на фрилансе, в стартапе и большой компании. Презентация работы. Аргументация решений. Как работать с обратной связью. Дизайн-критика и портфолио-ревью.
Создадите дизайн сайта и мобильную версию к нему
12 тем・4 недели
Анимация
  • Переход
  • Скроллинг
  • Морфинг
  • Интерактивная анимация
  • HTML
  • CSS
  • JavaScript
Анимация
Задачи анимации в интерфейсе. Основные принципы анимации: переходы, скроллинг, морфинг. Как спланировать анимацию в макете. Как настроить анимацию в Tilda и Figma.
Основы HTML и CSS
Разница между фронтенд- и бэкенд-разработкой. Средства разработки. Позиционирование элементов. Принципы вёрстки.
Взаимодействие с разработкой
Отличие в вёрстке на конструкторе сайтов и с разработчиком. Как подготовить макет для передачи в разработку. Как аргументировать свои решения.
Разработаете макет сайта и анимируете прототип в Figma
Дополнительно・1 неделя
Бонусный модуль про новые технологии и нейросети в работе дизайнера
Узнаете, как новые технологии и нейросети (ChatGPT, Midjourney, DALL·E и другие) могут помочь дизайнеру оптимизировать рабочие процессы и распределять ресурсы эффективнее.
Самостоятельно・4 недели
Выпускной проект
Ближе к концу обучения вы поймёте, в какой роли видите себя в будущем и какие проекты вам ближе. Поэтому мы предложим несколько тем для итоговой работы на выбор. Каждая из них спроектирована так, чтобы вы показали свои навыки в полной мере и сделали актуальный проект — как для себя, так и для рынка.
Карьерные продукты・3 месяца
Фриланс-трек
Цель программы — помочь студенту выйти на рынок фриланса максимально конкурентоспособным и подготовленным. Вы научитесь вести коммуникацию с заказчиком, формировать стоимость первых работ, оформлять социальные сети, защищать себя от недобросовестных клиентов.
Карьерные продукты・7 месяцев
Карьерный трек
Здесь наша команда HR-экспертов поможет подготовить всё необходимое для эффективного поиска работы. Вы научитесь составлять резюме, писать сопроводительные письма, а также проходить собеседования. Вам предстоит проделать весь путь: от поиска вакансий и первого тестового задания до интервью и приглашения на работу.
Со спикером・Каждую неделю
Вебинары для поддержки студентов, разбора сложных тем, Q&A

Более 10 000 выпускников уже нашли новую работу

Вот в каких компаниях они работают

Это подтверждено исследованием, которое мы провели вместе с Высшей школой экономики

Отвечаем на вопросы

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

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

Чтобы познакомиться с задачами веб-дизайнера, пройдите бесплатную вводную часть курса. Если вы убедитесь, что выбранная профессия вам не подходит, — это тоже положительный результат.
Каким требованиям нужно соответствовать?
Вам не понадобятся специальные навыки или опыт — мы обучим всему с нуля. Главное — иметь компьютер и достаточно времени для занятий. Выше можно посмотреть программу, чтобы оценить количество учебного материала и свои возможности.
Смогу ли я найти работу после обучения?
Гарантий нет, но мы верим, что сможете. Работодателям важно, чтобы вы справлялись с реальными задачами, а не просто обладали набором знаний. Мы учим применять знания на практике, а также предлагаем помощь HR-специалистов из нашего карьерного центра. Но вам точно придётся приложить усилия, чтобы найти работу: активно откликаться на вакансии, проходить собеседования, показывать свои проекты и делать тестовые задания.

По данным исследования Высшей школы экономики, 69% наших выпускников среди тех, кто хотел сменить профессию, начинают новую карьеру после обучения. Больше половины из них — во время учёбы и в первые 2 месяца после выпуска. Эти цифры подкреплены публичным отчётом о трудоустройстве студентов Практикума.
А если я хочу работать в Яндексе?
Некоторые наши студенты работают в сервисах Яндекса, в том числе и в Практикуме. Но с нашей стороны было бы нечестно что-либо гарантировать и завышать ваши ожидания.

Без опыта попасть в крупную IT-компанию возможно, хотя и сложно. Программа составлена так, чтобы вы могли начать карьеру после выпуска и набраться первого опыта. С ним вам будет значительно проще претендовать на позицию в крупных компаниях.
Хорошо, а вы можете помочь с поиском работы?
Да. По желанию студенты могут попасть на программу трудоустройства, которая длится от 2 недель. С поддержкой карьерного центра Практикума студенты оформляют портфолио, проходят тренировочные собеседования с их последующим разбором и учатся писать сопроводительные письма.

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

Если вам понадобится сделать паузу в учёбе или уделить больше времени закреплению материала, напишите своему куратору.
Если не понравится, я могу вернуть деньги?
Да, причём в любой момент. Если обучение в потоке уже началось, придётся оплатить прошедшие дни — но мы вернём деньги за оставшееся время обучения. Более подробно рассказываем об этом в седьмом пункте оферты.
Получу ли я какой-то документ после курса?
Если у вас есть среднее профессиональное или высшее образование, после курса вы получите диплом о профессиональной переподготовке.

Если нет, выдадим сертификат о прохождении курса и справку об обучении в электронном виде.
Можно ли оплатить курс за счёт работодателя?
Да, работодатель может оплатить учёбу полностью или разделить оплату с вами: например, поделить сумму 50/50 или 75/25.

Такая оплата пройдёт по счёту или двустороннему договору, а ИП могут оплатить с бизнес-счёта. Если работодатель купит обучение сразу 10 и больше сотрудникам, сделаем скидку 10%.

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

Для этого нужно подать заявление на налоговый вычет через личный кабинет на сайте nalog.ru (в него можно войти через аккаунт на Госуслугах).

К заявлению нужно приложить:
•‎ Справку 2-НДФЛ от работодателя.
•‎ Договор на обучение, в вашем случае это оферта Практикума.
•‎ Лицензию на образовательную деятельность. Вот наша.
•‎ Чек об оплате обучения. Мы отправляем его на электронную почту. Если не найдёте чек у себя в почте, напишите в чат службы поддержки — вышлем копию.
•‎ Справку о получении образовательных услуг — её тоже нужно запросить в чате поддержки.

Подробнее о налоговом вычете — на сайте Федеральной налоговой службы.

Давайте поможем

Мы перезваниваем в течение 30 минут каждый день с 10:00 до 19:00. Если оставите заявку сейчас, то перезвоним уже в рабочее время.