Описание
Программа курса
Веб-дизайн для начинающих
Лекция 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 Виды сайтов и их задачи
Корпоративные сайты
Сайт-визитка
Блог-журнал
Вы смотрели
