Web-дизайн: Курсы

1. Вводное занятие. Основные понятия

2. Этапы разработки сайта. Бриф и ТЗ

3. Скетчинг и прототипирование

4. Композиция и графика+техническая сторона WEB-разработки

5. Типографика и текст

6. Лицензионные изображения, фотографии, иконки и иллюстрации

7. Адаптивный дизайн. Подготовка макета для верстки

8. Landing Page. Одностраничные сайты

9. Презентация своей работы

10. Работа над ошибками и защита проектов

Вводный урок

• Интерфейс. Что входит в понятие интерфейс
• Структура. Составляющие части макета и их функционал
• Этапы WEB разработки и место дизайнера в них
• Особенности профессии WEB-дизайнера
• Какие программы используются на рынке и для чего (Adobe XD, Sketch, Figma, Invision Studio, Photoshop, Affinty Design, Illustrator, Principle, After Effects, Avocode, Zeplin, Abstract)
• Стоимость и сроки работы
• Практика Выбор темы проекта, разработка концепта

Этапы создания сайта, бриф и тз

• Этапы создания сайта
• Специфика работы над проектом
• Связь дизайна и продвижения
• Способы генерирования идей и разработка концепта
• Структура сайта и его влияние на дизайн макет
• Правила размещения модулей на странице сайта
• Практика составление брифа, знакоство с Adobe XD

Скетчинг и прототипирование

• Что такое UXUI дизайн
• Планирование навигации
• Методы оптимизации дизайна для пользователя
• Принципы юзабилити в текстах, графике и структуре сайта
• Модульные сетки и их виды и особенности
• Оптимизация дизайна под цели и задачи сайта без потери удобства пользования
• Тестирование
• Практика Прототипирование сайта. Логическая схема. Проектирование главной страницы

Композиция и графика

• Композиция в WEB макете, целостность и гармония
• Технические требования для макета
• Особенности восприятия цвета и его психология в интернете
• Композиция в текстах и графике
• Фирменный стиль т его значение
• Реклама и всплывающие окна
• Лицензионные изображения, иконки и иллюстрации
• Практика Проработка цветовой гаммы сайта, наполнение макета главной страницы контентом

Типографика и текст

• Виды и стили шрифтов
• Безопасные шрифты
• Особенности подачи текста в WEB пространстве
• Роль текстов в продвижении и дизайне сайта
• Практика: Наполнение главной страницы. Подбор шрифтового решения. Подпись кнопок и навигаций. Разработка структуры внутренних страниц.

Лицензионные изображения, фотографии, иконки и иллюстрации

• Почему не стоит искать в интернете
• Авторские права и стоковые сервисы
• Уникальность графического контента
• Дополнительная векторная графика
• Создание уникальной векторной графики
• Практика Обработка растровых изобращений в AdobePhotoshop. Вставка готового изображения в Adobe XD. Доработка макета

  Адаптивный дизайн. Подготовка макета для верстки

• Цели и задачи адаптивного дизайна
• Интерфейс сайта в адаптивной версии
• Технические требования и характеристики адптивного макета
• Особенности композиции и юзабилити сайта для разных устройств
• Работа с верстальщиком-программистом
• Передача макета для запуска в верстку
• Практика адаптация макета главной страницы.

Подготовка макета для верстки

• Ключевые отличия дизайна многостраничных и одностраничных сайтов
• Особенности дизайна и размещения модулей на landing page
• Особенности дизайна и верстки одностраничных сайтов
• Отличие контента и целевых задач макета
• Практика Разаработка концепта одностраничного сайта. Разбор особенностей работы с шаблонами и заготовками для макета. Создание макета одностраничного сайта в AdobePhotoshop

Презентация своей работы

• Что такое Behance, Dribbble
• Особенности подачи материала
• Основы дизайна в социальных сетях 
• Подготовка макета для Behance
• Создание презентаций своего сайта

Защита проектов

• Завершение разработки дизайна веб сайта.
• Подготовка сайта для презентации заказчику
• Вручение сертификатов