школа Highlights

Курс “Основы веб-дизайна”

Организационные моменты

Здравствуйте!
Мы рады приветствовать Вас на нашем курсе по основам веб-дизайна.

Давайте первым делом познакомимся - преподавателем курса является Антон

Черный, он работает веб-дизайнером с 16 лет, в 20 лет открыл собственную веб-
студию в Краснодаре, преподает в школе Highlights с лета 2016 года. Ссылка на
портфолио - https://www.behance.net/Antonfc7c.

Ассистентом Антона является Маша Рипецкая, она практикующий веб-дизайнер и

решатель всех организационных моментов на этом курсе, окончила школу Highlights
по направлению “веб-дизайн”. Ссылка на портфолио -
https://www.behance.net/Mashkow.

Кратко о курсе, на который Вы попали:

1. Курс состоит из 8-ми занятий, каждое из которых будет описывать отдельную часть
сферы веб-дизайна;
2. Средняя продолжительность урока составляет 1-1,5 часа;
3. Урок состоит из теоретической и практической части - это поможет Вам не только
узнать основные дизайнерские термины и понятия, но и покажет, из чего именно
состоит работа веб-дизайнера.
4. На протяжении всего курса Вы будете делать свою дипломную работу, которую в
конце будете защищать, а в дальнейшем сможете ее разместить в своем портфолио.

План курса следующий:

Урок №1. Введение в профессию
На этом уроке мы погружаем Вас в сферу веб-дизайна и рассказываем о том, чем же
на деле занимается веб-дизайнер и какие задачи выполняет. Расскажем о видах
сайтов и их классификации, ведь это крайне важно в нашей работе.
Один из самых важных моментов, которые Вы должны будете освоить за этот урок -
это то, из каких же этапов состоит создание сайта и какую роль в нем занимает
дизайнер. С этого урока мы начнем прививать Вам вкус и повышать насмотренность, а
также дадим список принципов современного дизайна, сравнив удачные макеты
сайтов с устаревшими.
В самом конце урока мы дадим Вам список основных ресурсов для вдохновения, и
будем надеяться, что эти сайты войдут в список ежедневно открываемых Вами
ресурсов. Завершим урок практикой, на которой Антон покажет, как рисовать главный
экран сайта (шапку).

Урок №2. Создание прототипа

На этом уроке мы разберем сложную, но очень увлекательную тему - создание
прототипа сайта. Если кто-то из вас слышал этот термин, то сейчас вы сможете
разобраться, для каких же целей он служит и как его можно создать.
 школа Highlights

На этом уроке мы расскажем о том, какие самые популярные разделы

одностраничных сайтов существуют и используют в своей работе веб-дизайнеры, а
затем покажем эти разделы на примерах реальных сайтов. Немного затронем тему
размеров макетов и модульных сеток для прототипов, а после этого Антон покажет,
как создать прототип с помощью ресурса wireframe.cc.

Урок №3. Работа с цветом и изображением

Начиная с этого урока мы будем Вам рассказывать о том, как подобрать настроение
для будущего проекта. На этом уроке мы расскажем о том, из чего состоит
эмоциональная часть сайта.
Цвет и цветовые стереотипы в веб-дизайне - одна из важнейших тем занятия. Мы
покажем на реальных примерах, как компании грамотно используют цвета в своих
сайтах и расскажем, почему они используют именно эти цвета.
Подбор фотографий - ответственный момент в создании проекта, поэтому этой теме
мы обязательно уделим время. Часто ли Вы слышите фразу “фото решают!”, мы
согласны с этим, хорошо подобранные фотографии действительно могут сделать из
сайта нечто удивительное - Вы сможете увидеть это на примерах.
Вы когда-нибудь слышали о мудборде? Если нет, то мы расскажем и покажем, для
чего он нужен и как его создавать.
В конце урока, конечно же, дадим все полезные ресурсы для вдохновения и
скачивания, а после этого Антон покажет, как создать мудборд для Вашего проекта.

Урок №4. Подбор шрифтов и иконок

Четвертый урок также посвящен эмоциональной составляющей сайта, но в этот раз
речь пойдет о типографике и иконках.
Первым делом мы расскажем о том, для чего веб-дизайнеры используют иконки на
сайтах и покажем, где их можно скачать. Затем поговорим о типографике (шрифтах) -
сложная, но очень интересная тема! Мы расскажем об основных параметрах шрифтов
и их видах и покажем, как работать с текстом в фотошопе.
В конце занятия дадим ресурсы для скачивания бесплатных веб-шрифтов и иконок, а
после этого Антон создаст раздел сайта для своего проекта с текстовыми блоками и
иконками.

Урок №5. Дизайн веб-интерфейса

На этом уроке Вы познакомитесь с таким термином, как “веб-интерфейс”, а также
узнаете, какие основные элементы интерфейса существуют на сегодняшний день.
Антон погрузит Вас в историю стилей веб-интерфейсов и расскажет, какие из них
являются трендами на сегодняшний день. Этот урок рассчитан на то, чтобы
опровергнуть миф о том, что рисовать кнопки и формы заявок очень сложно.
Практика урока будет посвящена тому, что Антон нарисует форму заявки для своего
проекта.

Урок №6. Создание главного экрана (шапки сайта)

Очень насыщенный и захватывающий урок, ведь он посвящен созданию “лица”
Вашего будущего проекта - главному экрану. Мы расскажем о том, как управлять
вниманием пользователя и о том, какие элементы должны обязательно
присутствовать в шапке сайта. Расскажем про композиции экрана и покажем на
примерах.
 школа Highlights

На практике Антон создаст 2 варианта шапки сайта с разной композицией и

оформлением, но на одну тематику.

Урок №7. Создание дизайн-макета

Очень насыщенный урок, потому что мы продолжим рисовать макет. На занятии мы
сперва покажем на примерах разделы сайта, которые чаще всего используют
дизайнеры в своих проектах.
После этого Антон расскажет и покажет, что же такое модульные сетки и как их нужно
применять в своих проектах, а после этого расскажет, что такое адаптивный макет и
адаптивный сайт (все покажем на примерах реальных сайтов).
Практика будет обширной, т.к. Антон закончит работу над своим проектом, дорисовав
его до самого конца.

Урок №8. Свободное плавание

Это занятие нацелено на то, чтобы подготовить Вас к дальнейшему плаванию в
профессии веб-дизайнер. Мы расскажем про рынок труда и то, как стоит работать в
команде. Обязательно затронем тему оформления проектов и создание собственного
портфолио.
Интересным моментом урока будет показ примеров анимации и интерактивных
эффектов, которые мы называем WOW-эффекты на сайте - расскажем, зачем
дизайнеру нужно знать основные примеры анимации.
На практике Антон создаст планшетную версию макета своего проекта, а после этого
оформит оба макета в один проект и разместит его на behance.net.

Сразу предупредим, что на курсе мы не будем рассматривать следующие темы:

1. Верстка сайтов (верстальщик - это отдельная профессия, поэтому в текущем курсе
мы не рассматриваем верстку; если Вам интересна верстка сайтов, то можете
ознакомиться с курсом “Основы создания сайтов”
https://highlights.guru/courses/view/31).
2. Ретушь фотографий (ретушь - это исправление и изменение фотографий с
помощью специального программного обеспечения; если Вам интересно это
направления, то ознакомьтесь с нашим курсом “Photoshop для начинающих”
https://highlights.guru/courses/view/17).
3. Разработка мобильных приложений (мобильные приложения и мобильная версия
сайта - это 2 разные вещи; мобильное приложения - это отдельная программа на
смартфоне или планшете, а мобильная версия сайта - это отображение сайта в
мобильной версии браузера).

Что касается домашних заданий, то:

1. После каждого урока мы выдаем домашнее задание, которое поможет Вам
закрепить полученные на уроке навыки.
2. Домашнее задание обязательно к выполнению.
3. Выполненное домашнее задание присылай на личную страницу своего тренера.

Памятка о том, к кому стоит обращаться за помощью

1. Если у Вас возникают вопросы касательно программы курса, домашек или уроков,
то сразу пиши своему тренеру.
 школа Highlights

2. Если вопросы касаются оплаты или имеют организационный характер, то сразу же

пиши своему куратору (человек, у которого ты покупал курс).
3. Если же возникают мелкие трудности в работе с фотошопом, не можете найти
полезные ссылки, то обратитесь к своим сокурсникам - они быстро помогут Вам
сориентироваться. Взаимопомощь - это очень важно.

Это всё, что Вам нужно запомнить на текущий момент)

А теперь можете приступать к просмотру первого урока.
Удачи и продуктивной работы!