Тренинг "Веб-дизайн для начинающих"

Тренинг "Веб-дизайн для начинающих"

E-mail Печать PDF
Тренинг Веб-дизайн для начинающих

Что за курс.

Обучающий онлайн тренинг по веб-дизайну.

Автор Юлия Первушина.

Что вошло в курс.

Содержание.

Лекция 1 «Профессия веб-дизайнер. Знакомство с программой AdobePhotoshop»

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

  • Что такое веб-дизайн;
  • Приемущества работы веб-дизайнера;
  • Заработок веб-дизайнера;
  • Чему вы научитесь после прохождения данного курса;
  • Инструменты веб-дизайнера;

1.2 Adobe Photoshop.

  • Интерфейс Photosop - базовый обзор;
  • Панель инструментов;
  • Панель меню;
  • Работа со слоями (выделение слоя, объединение слоев, группы слоев, смарт объект, обтравочная маска, слой-маска);
  • Горячие клавиши;

1.3 Начало работы.

  • Какие бывают сайты, модульные сетки, структура сайта, область контента;
  • Создание документа и модульной сетки (линейки, grid, направляющие);
  • Быстрые направляющие;
  • Работа с текстами;
  • Работа с фигурами (примеры фигур, создание фигур);
  • Трансформирование объектов;
  • Работа с заливкой и инструментом градиент;

Лекция 2 «Стили слоя. Работа с изображениями. Цвет и атмосфера сайта».

2.1 Стили слоев.

  • Паттерны;
  • Стили слоя;

2.2 Работа с изображениями.

  • Как искать изображения и фото для сайта. Размеры изображений и разрешение;
  • Инструменты для обтравки изображений;
  • Фильтры;
  • Режимы наложения;

2.3 Цвет и атмосфера сайта.

  • Выбор цветовой гаммы и составление палитры;
  • Сочетаемость цветов;
  • Создание градиента;

Лекция 3 «Шрифты для Web. Шрифтовые пары. Типографика. Графика для сайта».

3.1 Шрифты для Web. Типографика.

  • Выбор шрифтов для Web;
  • Как скачать и установить шрифт;
  • Сочетаемость шрифтов и шрифтовые пары;
  • Какие шрифты не применять вообще;
  • Какие шрифты не применять в меню и в заголовках;
  • Размеры шрифтов для сайта;
  • Оформление текста;
  • Интерлиньяж;
  • Отступы и расстояния;
  • Определить шрифт;
  • Разбор моих удачных и неудачных примеров;

3.2 Графика для сайта.

  • Adobe Illusrator - базовый и необходимый обзор;
  • Векторная графика и где ее взять;
  • Как использовать векторную графику в фотошопе;

Лекция 4 «UI, GUI, создание UI. Стили сайтов и GUI»

4.1 UI интерфейс пользователя / GUI графический интерфейс пользователя.

  • Что такое UI Kit;
  • Как создать UI в стиле Flat, Material design;
  • Элементы интерфейса сайта (кнопки, ховеры, меню, формы, навигация, пагинация, чебоксы, радиобаттоны, поиск);

4.2 Обзор стилей сайтов и их отличия.

  • Flat;
  • Material design;
  • Объем;
  • Игровой;
  • Стилизованный;
  • Какие делать и какие уже не в тренде и почему;
  • Разбор моих удачных и не удачных примеров;

Лекция 5 «Иконки и пиктограммы. Инфографика».

5.1 Иконки и пиктограммы.

  • Где скачать иконки;
  • Формат иконок;
  • Виды и стили иконок;
  • Размеры иконок и пиктограмм;
  • Удачные и неудачные примеры;

5.2 Инфографика.

  • Что такое инфографика и где ее взять;
  • Как инфографика используется на сайтах и для чего;
  • Хорошая и плохая инфографика на стоках;
  • Чувство меры в использовании инфографики;
  • Удачные и неудачные примеры;

Лекция 6 «Проектирование сайта. Поиск вдохновения. Теснота и ее влияние на макеты».

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

  • Что значит проектирование сайта, этапы, задачи;
  • Прототип сайта;
  • Варианты создания прототипа и сервисы для их создания;
  • Создание прототипа в фотошоп;

6.2 Поиск вдохновения.

  • Сайты для дизайнеров - базовый обзор;
  • На что обращать внимание в работах;

6.3 Теснота в макетах.

  • Теснота в макетах - что это?
  • Как теснота влияет на восприятие сайта?
  • Как избавиться от тесноты;
  • Избавление от тесноты на этапе проектирования;

Лекция 7 «Единство стиля. Создание сайта. Виды сайтов».

7.1 Единство стиля.

  • Выбор стиля сайта, работа с ТЗ заказчика;
  • Создаем мудборд. Что это? Как сделать? Как пользоваться?
  • Создание композиции сайте, если она еще не создана на этапе проектирования;
  • Дизайн-концепция;
  • Создание палитры;
  • UI Kit;
  • Иконки и инфографика и подбор необходимых фото;
  • Чек-лист для создания сайта;

7.2 Виды сайтов и их задачи.

  • Корпоративные сайты;
  • Сайт-визитка;
  • Блог-журнал;
  • Лендинг;
  • Интернет-магазин;

Лекция 8 «Адаптивность сайтов. Подготовка макета к верстке».

8.1 Адаптивность сайтов.

  • Что такое адаптивность?
  • Размеры макетов под разные виды устройств;
  • Главное и второстепенное в мобильной версии;
  • Размеры шрифтов, ui элементов и на что стоит обратить внимание;

8.2 Подготовка макета к верстке.

  • Сетка;
  • Папки и названия;
  • Цвета и UI;
  • Сохранение и архивирование;
  • Отправка исходников;

Лекция 9 «Создание портфолио. Поиск работы».

9.1 Создание портфолио.

  • Что такое mock-up;
  • Использование mock-upдля презентации работы;
  • Шапка для презентации работы;
  • Оформление блоков для презентации работы;
  • Какие блоки обязательно должны быть в презентации работы;
  • Привью - что это такое? И как его создать;
  • Упрощенный вариант для портфолио;

9.1 Поиск работы.

  • Где искать работу начинающему дизайнеру?
  • Офис или удаленная работа?
  • Обзор бирж фриланса;
  • Как отвечать на проекты на фрилансе;
  • ТЗ для дизайнера, каким оно должно быть и главные пункты;
  • Вопросы, которые обязательно нужно задать заказчику.

Дополнительную информацию смотрите на сайте тренинга:
 
Узнать подробности (перейти на страницу тренинга)

   Карточка курса: *
Название:Веб-дизайн для начинающих
Автор(ы):Первушина Юлия
Формат курса:Тренинг
Цена:8990 руб.
Партнерская программа:Есть
Примечание:Срок обучения: 3 месяца
*-данные карточки курса могут не соответствовать текущим данным о курсе, подробную информацию смотрите на сайте курса

   Другие курсы автора(ов), издателя:
Ссылки на страницы автора(ов), издателя: Первушина Юлия