Fullstack-дизайнер
Научитесь верстать веб-страницы с нуля с помощью HTML5/CSS3. Освоите правила веб-дизайна и проектирования интерфейсов
Описание:
Чем занимается fullstack-дизайнер
Fullstack‑дизайнер — «универсальный игрок» с компетенциями UX-дизайнера, UI-дизайнера, верстальщика, способный создать полнофункциональный digital-продукт «под ключ» или выстроить работу команды над проектом.
Чему вы научитесь на курсе
- Создавать удобные интерфейсы. Вы сможете проектировать пользовательский опыт, освоите основные инструменты и техники UX-дизайна
- Делать качественные макеты. Прокачаете все основы дизайна: композицию, отступы, сетки, работу с цветом, типографику
- Верстать сайты. По итогу сможете уверенно разбираться в коде сайтов и верстать HTML-шаблоны для веб-интерфейсов
Программа курса:
HTML и CSS-вёрстка
Научимся верстать сайты на HTML и CSS и вносить изменения в существующую вёрстку. По итогам этого модуля вы уже самостоятельно сверстаете лендинг.
- Теги для вёрстки контента страницы
- Теги для вёрстки структуры страницы
- Теги для вёрстки форм
- Селекторы CSS
- Определение контекста элементов
- Блочная модель
- Позиционирование элементов
- Оформление текста
- Оформление декоративных элементов
- Состояние интерактивных элементов
Вёрстка адаптивного макета
Современный веб-сервис все чаще используется на мобильных устройствах, поэтому интерфейс должен быть не просто удобным — он должен быть удобным на любом устройстве. В этом модуле мы учимся адаптировать макеты под разные устройства и платформы.
- Вёрстка резинового макета
- Резиновые изображения
- Введение в медиа-запросы
- Медиа-функции
- Особенности вёрстки для мобильных устройств
- Адаптивная типографика
- Breakpoints
- Адаптивные изображения
Веб-дизайн
Изучим методы, позволяющие определить, каким должен быть интерфейс, и техники поиска идей для его разработки. На практике закрепим приемы и принципы веб-дизайна, которые необходимы для создания современного сайта. Рассмотрим свойства формы и приемы работы над композицией. Научимся работать с цветом, подбирать шрифты, структурировать текст и использовать микротипографику. Освоим принципы, необходимые для создания визуальной иерархии в интерфейсе.
- Знакомство с веб-дизайном
- Модульные сетки
- Скетчинг и прототипирование
- Пользовательское взаимодействие
- Адаптивный дизайн
- Композиция
- Веб-типографика
- Теория цвета
- Веб-анимация
- Системы ведения проектов
- Составление технического задания
- Вдохновение, творчество, импровизация
Проектирование интерфейсов
Изучим принципы построения пользовательских интерфейсов и рассмотрим их основные элементы. Углубимся в методологии командной работы и формирование командного взаимодействия. Освоим инструменты для сбора и обработки данных о пользователях продукта, основы стратегии в концепции бережливого производства.
- Введение в предметную область
- Азбука пользовательского интерфейса
- Методологии командной работы (Kanban, Scrum)
- Качественные исследования аудитории
- Воркшоп: персоны
- Lean UX Strategy
- Воркшоп: UX Strategy
- Customer Journey Mapping (CJM)
- Информационная архитектура
- Воркшоп: UX Design
- Инструменты прототипирования
- Воркшоп: UI Design