Структура и UX
Определите задачу проекта, изучите пользователя и продумаете структуру будущего сайта.
Онлайн-курс · UX/UI и веб-дизайн
UX/UI и веб-дизайн с нуля — до первого проекта в портфолио
Последовательно пройдёте весь процесс создания современного сайта: от цвета, типографики и структуры до вайрфрейма, UI-дизайна, адаптивной версии и оформления проекта.
Первый модуль — 5 уроков бесплатно · без оплаты и банковской карты
50+
уроков
11
модулей
30+
часов материалов
Практика в Figma
бесплатной версии достаточно
Не просто теория
От идеи — до полноценного проекта в портфолио
Вместо десятков несвязанных упражнений вы будете постепенно развивать один проект. Каждый новый модуль добавляет к нему следующий профессиональный этап.
Один проект на весь курс
Как растёт ваш проект
Добавляется на этапеУже готово
Структура
Цвет и шрифт
Wireframe
Прототип
Дизайн-система
UI-дизайн
Адаптив
ПортфолиоГотовый проект
Цвет и типографика
Создадите собственную цветовую палитру и систему типографики.
Wireframe
Спроектируете структуру главной и внутренних страниц без отвлечения на визуальный дизайн.
Прототип
Свяжете экраны между собой и проверите логику интерфейса до начала финального дизайна.
Дизайн-система
Соберёте цвета, шрифты, компоненты и правила интерфейса в единую систему.
UI-дизайн
Превратите прототип в полноценный визуальный дизайн сайта и внутренних страниц.
Адаптив
Подготовите мобильную версию проекта и научитесь адаптировать интерфейс под небольшие экраны.
Портфолио
Оформите итоговую работу так, чтобы её можно было показать заказчику или работодателю.
Для начинающих
Курс подойдёт, если вам не хватает системы
Начинаете с нуля
Никогда не работали в Figma и пока плохо представляете разницу между UX, UI и веб-дизайном. Курс начинается с базовых понятий и постепенно усложняется.
Уже пробовали учиться самостоятельно
Смотрели ролики, читали статьи, умеете выполнить отдельные действия в Figma, но не понимаете, как провести настоящий проект от начала до конца.
Переходите из смежной профессии
Работаете в графическом дизайне, маркетинге, разработке или другой digital-сфере и хотите системно разобраться именно в проектировании интерфейсов.
Хотите собрать первый проект
Нужна не просто теория или сертификат, а законченная работа, которую можно положить в портфолио.
Формат курса
Теория, практика и сразу применение в проекте
Курс построен так, чтобы знания не оставались отдельными лекциями. Сначала вы разбираетесь в теме, затем видите её применение и сразу используете в своём проекте.
Разбираетесь в теме
Теория представлена в структурированных текстовых уроках со схемами, таблицами, примерами и инфографикой.
Можно читать в своём темпе, возвращаться к сложным моментам и быстро находить нужную информацию.
Смотрите практику
Там, где важен сам процесс работы, используются подробные видеоуроки.
Вы видите экран преподавателя, повторяете действия в Figma и понимаете не только что нужно делать, но и почему.
Применяете знания
В конце учебных этапов теория превращается в конкретную часть вашего проекта: палитру, типографику, wireframe, дизайн-систему или готовый интерфейс.
Двигаетесь дальше
Новый модуль продолжает предыдущий. В итоге отдельные задания постепенно складываются в полноценный проект.
Пример недели
3–5 часов в неделю
Оптимальный темп — 3–5 часов в неделю. Учитесь тогда, когда удобно вам.
Программа курса
11 модулей — от первых шагов до готового проекта
Не просто список тем. У каждого модуля есть конкретный результат, который становится частью вашей итоговой работы.
01Введение в UX/UI5 уроков · бесплатно
Разберётесь, чем UX отличается от UI и веб-дизайна, познакомитесь с основными инструментами и начнёте работать в Figma.
Результат: определитесь с направлением проекта и подготовите рабочее пространство.
Пройти бесплатно02Основы цвета5 уроков
Цветовой круг, характеристики цвета, сочетания, цветовые модели и психология цвета.
Результат: создадите цветовую палитру своего проекта.
03Основы типографики5 уроков
Разберётесь в устройстве шрифтов, текстовой иерархии и принципах подбора шрифтовых сочетаний.
Результат: создадите систему типографики проекта.
04Визуальный контент5 уроков
Научитесь работать с фотографиями, иллюстрациями и иконками и подбирать визуальные материалы в едином стиле.
Результат: подготовите визуальный контент для будущего интерфейса.
05Композиция и первый макет6 уроков
Изучите структуру сайтов, визуальную иерархию, композицию и сетки.
Результат: соберёте свой первый полноценный макет в Figma.
06UX-мышление5 уроков
Пользователи, сценарии, CJM, информационная архитектура, юзабилити и основы адаптивного проектирования.
Результат: научитесь смотреть на интерфейс не только как дизайнер, но и как пользователь.
07Прототипирование и Wireframe5 уроков
Разберётесь в работе с техническим заданием и создадите wireframe главной и внутренних страниц.
Результат: получите структуру будущего сайта и интерактивный прототип.
08Дизайн-системы и стайл-гайды4 урока
Узнаете, как устроены дизайн-системы и почему системный интерфейс проще развивать и масштабировать.
Результат: соберёте собственный стайл-гайд.
09Разработка пользовательского интерфейса9 уроков · самый большой практический модуль
Шаг за шагом превратите прототип в полноценный UI: от первого экрана до внутренних страниц, CTA, навигации, подвала и микроанимаций.
Результат: готовая десктопная версия сайта.
10Мобильные интерфейсы5 уроков
Разберётесь в принципах мобильного дизайна и адаптации интерфейсов под небольшие экраны.
Результат: мобильная версия главной и внутренних страниц проекта.
11Портфолио и начало карьеры6 уроков
Разберётесь, как оформить кейс, презентовать свои решения, подготовить резюме и общаться с заказчиком или работодателем.
Результат: готовый проект, который можно оформить и добавить в портфолио.
Входит в стоимость
Не только курс — ещё и полноценный учебник по UX/UI
Во время обучения некоторые темы хочется изучить глубже, а к другим приходится возвращаться уже во время реальной работы. Поэтому вместе с курсом вы получите доступ к онлайн-учебнику Wybex.
Чтобы научиться делать
Последовательные уроки, практические задания и видео с работой в Figma.
Вы шаг за шагом создаёте собственный проект.
Чтобы понимать и возвращаться к теории
Расширенные материалы, схемы, примеры и подробные разборы по UX/UI и веб-дизайну.
Можно открыть нужную тему в любой момент и использовать учебник как рабочий справочник.
Курс даёт маршрут и практику. Учебник помогает глубже разобраться в теории и остаётся под рукой на весь период доступа.
Результат обучения
Сможете самостоятельно пройти путь от задачи до готового интерфейса
Проектировать структуру
Понимать задачу сайта, продумывать пользовательские сценарии и информационную архитектуру.
Создавать Wireframe
Сначала решать задачи структуры и UX, а только потом переходить к визуальному оформлению.
Работать в Figma
Использовать фреймы, сетки, стили, компоненты, Auto Layout и прототипирование в реальных проектах.
Создавать системный UI
Работать с цветом, типографикой, сетками, визуальной иерархией и компонентами.
Делать адаптив
Переносить интерфейс с desktop на мобильные экраны, а не просто уменьшать готовый дизайн.
Презентовать работу
Оформить проект для портфолио и объяснить, почему вы приняли те или иные дизайнерские решения.
Авторский курс
Обучение построено на реальном процессе работы над сайтами
В профессии
с 2011
Работаю в сфере разработки и дизайна сайтов с 2011 года.
За годы практики я заметил одну и ту же проблему у начинающих дизайнеров: информации много, но она разбросана по статьям, роликам и отдельным курсам.
Можно знать десятки инструментов Figma и всё равно не понимать, с чего начинать реальный проект.
Курс ведёт один автор, поэтому вам не приходится каждый новый модуль привыкать к другой методике и подходу.
Поэтому я построил Wybex вокруг последовательного процесса
- понять задачу
- спроектировать структуру
- создать визуальную систему
- собрать интерфейс
- адаптировать его
- оформить результат
Не уверены, подходит ли вам курс?
Не нужно принимать решение по описанию страницы. Первый модуль уже открыт: посмотрите уроки, познакомьтесь с форматом и только потом решайте, хотите ли продолжить.
Открыть бесплатный модуль5 уроков · без оплаты · без банковской карты
Полный доступ
Один тариф. Весь курс без дополнительных покупок
UX/UI и веб-дизайн с нуля
19 900 ₽
Доступ на 12 месяцев≈ 1 658 ₽ за месяц доступа
Получить полный доступ
Хотите сначала посмотреть? Первый модуль из 5 уроков можно пройти бесплатно.
Начать бесплатно →В стоимость входит
- 11 модулей курса
- 50+ уроков
- 30+ часов материалов
- Практические видеоуроки
- Полный путь создания проекта
- Работа в Figma
- Проектирование desktop и mobile
- Подготовка проекта для портфолио
- Онлайн-учебник UX/UI
- Доступ ко всем материалам на 12 месяцев
FAQ
Частые вопросы
Нужен ли опыт в дизайне?
Нет. Курс начинается с базовых понятий и рассчитан в первую очередь на начинающих.
Если вы уже немного знакомы с Figma, первые уроки помогут систематизировать знания, а затем программа перейдёт к полноценному проектированию интерфейсов.
Нужно ли покупать Figma?
Нет. Для прохождения курса достаточно бесплатной версии Figma.
Сколько времени занимает обучение?
Оптимальный темп — около 3–5 часов в неделю.
При таком режиме программу удобно пройти примерно за 12 недель, но вы можете двигаться быстрее или медленнее.
Доступ к материалам предоставляется на 12 месяцев.
Что я сделаю к концу курса?
Вы пройдёте полный процесс создания адаптивного веб-проекта: от структуры и wireframe до UI-дизайна, мобильной версии и подготовки работы для портфолио.
Есть ли практика?
Да. Курс построен вокруг практики.
Теоретические темы закрепляются заданиями, а работу в Figma вы изучаете по подробным видеоурокам.
Что входит в онлайн-учебник?
Это расширенная база материалов по UX/UI и веб-дизайну: теория, схемы, примеры и подробные разборы тем, к которым удобно возвращаться во время обучения и работы.
Подойдёт ли курс, если я уже умею работать в Figma?
Если вы знаете инструменты программы, но пока не умеете самостоятельно провести проект от задачи до готового интерфейса — да.
Для опытных Middle и Senior дизайнеров программа будет слишком базовой.
Можно ли попробовать курс перед покупкой?
Да.
Первый модуль из пяти уроков открыт бесплатно. Вы можете познакомиться с материалами и форматом обучения до покупки полного доступа.
Начните с первого шага
Не выбирайте курс по обещаниям — сначала попробуйте
Откройте первый модуль, познакомьтесь с форматом Wybex и разберитесь, подходит ли вам такой подход к обучению.
5 уроков первого модуля уже доступны бесплатно.
Начать обучение бесплатноБез оплаты · без банковской карты
