Веб-дизайн
background

Веб-дизайн

Изучаемые программы

Adobe Photoshop

Продолжительность

50 астрономических часа (или 67 академических) (3 месяца).

Количество участников

до 10 человек

Стоимость программы
от 16 500,-
Записаться на курс Задать вопрос

Описание программы

Веб-дизайн — это сочетание творчества и холодного расчета.

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

Чтобы стать настоящим веб-дизайнером, нужно освоить несколько основополагающих навыков. Мы подробно расскажем обо всем, — а вы научитесь создавать крутые сайты.

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

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

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

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

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

ПРАКТИКА: Выбор темы проекта, разработка концепта.

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

  • Этапы создания сайта
  • Связь дизайна и продвижения
  • Способы генерирования идей и разработка концепта
  • Тренды и визуальные референсы
  • Мудборды

ПРАКТИКА: Создание мудборда.

  • Майндмэпы, скетчи

ПРАКТИКА: Создание ментальной карты.

3. Компоненты веб-интерфейса (2 часа)

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

4. Проектирование (2 часа)

  • Что такое UX\UI дизайн, аналитика
  • Инструменты проектирования
  • Информационная структура
  • Планирование навигации
  • Принципы юзабилити в текстах, графике и структуре сайта
  • Вайрфреймы, прототипы и мокапы

ПРАКТИКА: Прототипирование сайта. Логическая схема. Проектирование главной страницы.

5. Основы Photoshop (2 часа)

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

ПРАКТИКА: разработка первой страницы: фоновое изображение и логотип, заголовок, второстепенный текст, color picker и основы работы с ним, шейпы и кнопки, особенности форматов и сохранения документа.

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

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

ПРАКТИКА: Проработка цветовой гаммы сайта, наполнение макета главной страницы контентом.

7. Типографика и текст (4 часа)

  • Слои восприятие информации
  • Особенности подачи текста в web пространстве
  • Роль текстов в продвижении и дизайне сайта
  • Виды и стили шрифтов
  • Безопасные шрифты
  • Шрифтовые пары и как их подбирать
  • Акциденция (заголовочные шрифты) и наборный текст
  • Традиции кириллической типографики

ПРАКТИКА: Наполнение главной страницы. Подбор шрифтового решения. Подпись кнопок и навигаций. Разработка структуры внутренних страниц.

8. Обработка изображений. (12 часов)

Лицензионные изображения, фотографии, иконки и иллюстрации. (2 часа)
  • Авторские права и стоковые сервисы
  • Уникальность графического контента
  • Дополнительная векторная графика
  • Создание уникальной векторной графики
Обработка растровых изображений в AdobePhotoshop. (10 часов)
  • Обработка изображений в Photoshop
  • Основные моменты
  • Самые частые проблемы (пересвет, провалы в черном, проблемы с цветом, резкость)
  • Настройки слоев
  • Сатурирование изображений
  • Тонирование изображений.
  • Работа с уровнями и кривыми
  • Настройка контрастности изображений
  • Единство изображений. Работа с цветовым тоном
  • Устранение мелких дефектов.
  • Обтравка изображений
  • Тени
  • Работа с фоном
  • Эффекты

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

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

ПРАКТИКА: адаптация макета главной страницы. Подготовка макета для верстки.

10. Landing Page. Одностраничные сайты (2 часа)

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

ПРАКТИКА: Разработка концепта одностраничного сайта. Разбор особенностей работы с шаблонами и заготовками для макета. Создание макета одностраничного сайта в AdobePhotoshop

11. Презентация и переговоры. Работа с заказчиком. (2 часа)

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

12. Работа над ошибками и защита проектов (8 часов)

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

    Adobe Photoshop

    Продолжительность

    50 астрономических часа (или 67 академических) (3 месяца).

    Количество участников

    до 10 человек

    Стоимость программы
    от 16 500,-
    Записаться на курс Задать вопрос

    На нашем сайте мы используем cookie для сбора информации технического характера.
    В частности, для персонифицированной работы сайта мы обрабатываем IP-адрес региона вашего местоположения.