«Веб-дизайн для новичков»

«Веб-дизайн для новичков»

Спойлер: Программа курса

Веб-дизайн для начинающих
Лекция 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 Поиск работы

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

Спойлер: Для кого подойдёт курс

Для кого подойдет курс:

• Для новичков, которые не знают, что такое Фотошоп и веб-дизайн
• Для людей, которым нравится дизайн сайтов, и они хотели бы зарабатывать на этом
• Для людей, которые хотят получить систематизированные знания по профессии веб-дизайн и применять на практике
• Для людей, которые хотят начать зарабатывать здесь и сейчас – и побольше!
• Для начинающих веб-дизайнеров, которые уже работают на фрилансе, но еще «плавают» в веб-дизайне
• Для новичков веб-дизайнеров, которым необходима помощь и четкие ответы на их вопросы без воды

Особенности курса:

• Курс состоит из 9 уроков, прохождение которых рассчитано на 2 месяца
• По окончании 9-го урока ученик получает бонус (консультацию или пакет графики от Юлии Первушиной, собранной за несколько лет работы)
• 1 месяц по окончании курса ученик сможет иметь доступ к урокам, после чего доступ закрывается
• К каждому уроку приложены файлы с подсказками, важные документы для работы
• По окончании каждого урока ученик выполняет домашнее задание, которое проверяется и комментируется преподавателем
• Каждую неделю проходит вебинар, на котором ученики задают свои вопросы, а преподаватель отвечает на них
• По окончании курса ученик получает сертификат от Юлии Первушиной об успешном прохождении курса!

Срок обучения: 3 месяца
Есть складчина на все курсы этого автора с доступом к её школе на год

.
Возможно на отдельные курсы быстрее наберётся народ.