Веб-дизайн с нуля до PRO от Skillbox

Вы научитесь создавать дизайн сайтов в Figma. Поработаете с реальными кейсами и соберёте портфолио. Освоите перспективную специальность и сможете начать карьеру в дизайн-студии, IT-компании или на фрилансе.
  • Сертификат об обучении
108 107 ₽
154 439 ₽

Актуальная стоимость обучения.

Данные обновлены 29 сентября 2022 г.

Рассрочка: 4504 ₽ / мес.

  • Сертификат об обучении
Перейти на страницу курса
Важно. Итоговая цена на странице курса может отличаться.

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

Ознакомьтесь с программой курса «Веб-дизайн с нуля до PRO» от Skillbox

1. Figma с нуля до PRO. Вы освоите самую популярную программу для веб-дизайна на профессиональном уровне. Научитесь создавать интерактивные прототипы, передавать макеты разработчикам и экономить время на рутинных задачах.

  • Знакомство с Figma. Разберётесь в интерфейсе и базовых настройках программы. Научитесь использовать геометрические фигуры, слои и текстовые поля. Соберёте свой первый прототип.

  • Основные инструменты Figma. Узнаете, что такое фреймы и чем они отличаются от слоёв. Научитесь рисовать простые фигуры, добавлять цвет, эффекты и текст. Познакомитесь с основами прототипирования.

  • Иконки, иллюстрации и картинки. Узнаете, как создавать собственные иконки и обрабатывать изображения, используя внутренние инструменты Figma. Сможете делать дизайн-макеты с нуля, не используя сторонние редакторы.

  • Компоненты. Узнаете, как создавать компоненты и пользоваться панелью настроек. Научитесь делать интерактивные прототипы и показывать заказчику, как люди будут пользоваться будущим сайтом.

  • Библиотеки компонентов и общие стили. Сможете создавать библиотеки стилей и UI Kit, чтобы стандартизировать элементы интерфейса. Научитесь верстать аккуратные макеты с помощью модульных сеток.

  • Auto Layout и Variants. Поймёте, как объединить макеты в систему с помощью функции Variants. Сможете создавать и адаптировать под разные устройства сложные элементы интерфейса.

  • Сложные многостраничные документы. Научитесь работать с базовыми экранами и создавать дерево страниц. Освоите бета-версию функции Branches. Поймёте, как организовать работу команды над разными версиями одного макета.

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

  • Подготовка макета для разработчиков. Сможете показать разработчику технические аспекты проекта и код компонентов. Научитесь оптимизировать работу команды с помощью плагина Figma Jam.

2. Веб-дизайн с нуля до PRO. Вы погрузитесь в профессию веб-дизайнера. Узнаете, как работать над проектом — от первой встречи с клиентом до готового сайта. Научитесь находить креативные идеи и опираться на UX-исследования. Отточите навыки на дизайн-спринтах.

  • Знакомство с профессией веб-дизайнера. Узнаете, какие задачи решают веб-дизайнеры и почему эти специалисты так востребованы. Познакомитесь с профессиональными терминами и инструментами.

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

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

  • Модульные сетки. Любой макет начинается с модульной сетки. Вы познакомитесь с её видами и научитесь выбирать подходящую. Узнаете о нюансах сеток для мобильной и полной версий.

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

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

  • Спринт 1. Дорого и минималистично: создаём дизайн лендинга на основе типографики.

  • Задача текстов в интерфейсах. Узнаете о требованиях к текстам для интерфейсов. Познакомитесь с основами UX-копирайтинга. Сможете дорабатывать тексты так, чтобы они были понятны пользователям и идеально вписывались в макет.

  • Цвета, фоны и тени. Освоите теорию цвета и узнаете о его функциях в интерфейсе. Поймёте, как подбирать палитру для сайта и выделять главные для пользователя элементы. Сможете создавать реалистичную тень для кнопок и других компонентов дизайна.

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

  • Прототип первой страницы. Создадите вайрфрейм — прототип с упором на структуру и логику, а не на визуальное оформление. Освоите два подхода к проектированию: блочный и freestyle.

  • Спринт 2. UX-райтинг: создаём лендинг и готовим тексты для всех элементов интерфейса.

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

  • Исследование пользователей: Customer Journey Map и User Flow. Узнаете, как учесть в дизайне потребности целевой аудитории. Научитесь составлять Customer Journey Map и User Flow, оценивать поведение пользователей на каждом этапе взаимодействия с сайтом.

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

  • Дизайн основных блоков. Научитесь создавать карточки товаров, слайдеры, блоки с преимуществами, тарифами и рекламой. Соберёте полноценную страницу и поймёте, как презентовать её клиенту. Сможете объяснить свои дизайн-решения, адекватно воспринимать правки и работать с возражениями заказчика.

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

  • Спринт 3. Адаптируем макет страницы для компьютера, планшета и мобильного телефона.

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

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

  • Спринт 4. Приёмы для эффектного портфолио: оформляем кейс на Behance.

  • Кейс для портфолио. Разберётесь, что лучше для продвижения — сайт-визитка или портфолио на дизайн-площадках. Научитесь оформлять кейсы на Behance так, чтобы ваши работы заметили и оценили. Узнаете о платных и бесплатных способах продвижения.

  • Бонус-модули. Принципы успешной работы с заказчиком. Где искать заказы. Как дизайнеры работают в больших командах

3. Итоговый проект.

  • Дизайн-концепт сайта. Выберете одного из реальных заказчиков и разработаете дизайн сайта для его бизнеса. Используете принципы сторителлинга, чтобы рассказать о своей работе.
Подробная информация о курсе

Город
Онлайн
Начальный уровень
Можно изучать с нуля
Формат обучения
Онлайн
Сертификат
Есть
Инструменты на курсе
Customer Journey Map
Figma
Поделись курсом с друзьями

Преподаватели на курсе

Александра Королькова — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Александра Королькова

Арт-директор Рaratype, шрифтовой и книжный дизайнер, теоретик шрифта и типографики

Сергей Попков — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Сергей Попков

Шеф-дизайнер, сооснователь AIC и Skillbox

Юлия Соловьёва — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Юлия Соловьёва

Дизайнер, арт-директор веб-бюро «Синий Муравей»

Дмитрий Смирнов — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Дмитрий Смирнов

Design Lead в «Тинькофф»

Александр Свобода — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Александр Свобода

Проверяющий преподаватель в Skillbox

Юлия Кондратьева — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Юлия Кондратьева

Design Lead в «Тинькофф»

Дмитрий Матвеев — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Дмитрий Матвеев

Арт-директор Wildberries

Никита Беллер — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Никита Беллер

Продуктовый дизайнер группы компаний «Тинькофф»

Ирина Ермакова — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Ирина Ермакова

Веб-дизайнер в бюро «Синий Муравей»

Никита Заславский — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Никита Заславский

Head of Digital в студии «Магвай»

Александр Ищенко — преподаватель на курсе Веб-дизайн с нуля до PRO от Skillbox
Александр Ищенко

Старший веб-дизайнер в студии «Магвай»

Отзыв о школе Skillbox в формате видео
Отзыв Skillbox реального студента. Плюсы и минусы самообразования.
Посмотрите обзор курсов от Skillbox
Подробнее о школе Skillbox
Skillbox — это онлайн-университет, организующий прикладные курсы и программы от главных экспертов рынка. Данная школа использует актуальные подходы к обучению, помогает работать над реальными проектами, стажироваться и трудоустраиваться в крупнейшие компании страны.
  • Преимущества и недостатки обучения в Skillbox
  • Удобная платформа. Skillbox разработали собственную удобную платформу для студентов.

  • Всё обучение онлайн. Все курсы Skillbox заранее записаны. Изучать можно в любое время.

  • Доступ навсегда. После окончания обучения вы всегда сможете вернуться к лекциям.

  • Преподаватели-эксперты. Лекции на курсах ведут крутые специалисты из больших компаний.

  • Настойчивые менеджеры. Cтуденты отмечают агрессивную рекламу перед покупкой курсов.

  • Навязывание рассрочки. Первые 6 месяцев бесплатно — на деле это кредит с отсрочкой.

  • Отзывы о Skillbox

    Взгляните, что студенты и выпускники говорят про Skillbox

    • Я выбрала курс «Анимация интерфейсов», потому что мне было интересно подробно изучить эту тему. Понравился подход преподавателей, то, как они объясняют материал. После обучения у меня увеличилась скорость работы, да и сам подход сменился. В будущем планирую найти работу получше, ...

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

    • Решила попробовать курс «Рекламная графика 1.0», понравились стиль и формат подачи материала, построение курса, отсутствие строгих сроков. Наконец занялась тем, что нравится. В будущем планирую закончить курс и найти работу, где смогу применить полученные навыки.

    • Курс «Анимация интерфейсов» шел в пакете с основным. Понравилось то, насколько удобно сделаны модули, и ты видишь свой прогресс, а еще очень качественная подача материала. Как и в других курсах, в общем-то, Skillbox держит марку!

    • Курс «Анимация интерфейсов» шел в пакете «Дизайнер PRO» и оказался полезным для работы. Впечатлили великолепная подача информации и очень интересные домашние задания. В будущем планирую сменить профессию и заниматься анимацией.

    • Я записалась на курс «Анимация интерфейсов», потому что хочу развиваться в профессии. Очень понравились сам контент и форма подачи. Во время обучения я узнала новые программы. В будущем планирую заниматься графическим и веб-дизайном.

    • Выбрала курс «Рекламная графика 1.0», потому что нужно по профессии. Понравилась доступность. Информация нужная, лекторы грамотные и опытные. По окончании курса улучшила свои навыки. В будущем планирую освоить моушн-дизайн.

    • Выбрал курс «Анимация интерфейсов», потому что мне не хватало навыков. И сейчас по мере прохождения я использую полученные знания и умения в работе. В будущем планирую завершить этот курс, также «Рекламную графику». Еще интересует «UX-аналитика».

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

      Показать отзыв полностью
    • 156 отзывов о Skillbox
      Мы ежедневно собираем, публикуем и обновляем отзывы об онлайн-курсах на просторах Интернета.
      Все отзывы о Skillbox →
    Веб-дизайн с нуля до PRO
    • Skillbox
    • 108 107 ₽