Основной курс веб-дизайна «Epic Skills»

compare_arrows

Профессия веб-дизайнера

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

Сбор данных, аналитика

• Виды требований
• Методы сбора анализа и требований
• Базовый процесс по шагам

Проектирование интерфейсов

• Информационная архитектура: понятие, подходы, примеры
• Прототипирование: шаги
• Примеры типов и элементов интерфейсов

Создание прототипа

• Создание скетча, проверка и комментарии
• Проработка сценариев
• Практика в Axure

Адаптивность и мобильная версия

• Понятие адаптивности
• Принципы построения прототипов для мобильных устройств
• Метод Mobile First
• Подготовка адаптивного макета

Практическое занятие

Работа с проектом в школе:

• Внесение правок по рекомендации преподавателя
• Подготовка финального макета
• Подготовка подачи проекта

Предзащита прототипов (2 занятия)

Презентация прототипа.

Цвета и композиция

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

Визуальная концепция

• Процесс создания, время и затраты, этапы
• Референсы
• Поиск визуальной стилистики: этапы
• Тренды в веб-дизайне, примеры
• Презентация концепции клиенту

Типографика

• Работа с формой и символом
• Что такое динамика и статика
• Классификация шрифтов, принципы сочетания
• Основные понятия: кегль, интерлиньяж, кёрнинг и трекинг
• Как выбрать шрифт для сайта
• Адаптивная типографика: на что обращать внимание
• Читаемость и оптимальные размеры. Длина строки. Иерархия заголовков
• Форматы шрифтов. Где скачивать

UI-kit и передача в верстку

• Работа с сеткой и блоками на верстке
• Ui-kit: понятие, принципы, создание и использование
• Форматы изображений
• Особенности мониторов и разрешений
• Путь макета до готового сайта
• Разбор примеров классических ошибок дизайнеров

Анимация в веб-дизайне

• Анимация: понятие и цель
• Микро и макроанимация: задачи, использование, примеры
• Основы работы в After Effects
• Практика в создании эффектов

Практическое занятие

Работа с проектом в школе:

• Внесение правок по рекомендации преподавателя
• Подготовка финального макета
• Подготовка подачи проекта.

Предзащита макетов

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

Финальная защита

Презентация трех страниц проекта и мобильной версии с анимацией.