#1 — Введение и основные принципы Flat design

Образование — ключ для открытия золотых ворот свободы. Джордж Вашингтон

Приветствуем вас на видеокурсе по Flat Design! На этом видеоуроке мы разберем, что такое Flat Design, и рассмотрим 5 основных принципов стиля. В практической части урока мы нарисуем иконку лайка в стиле Flat Design с помощью программы CorelDraw.

Flat Design и его 5 принципов

Flat Design (плоский дизайн) – современный стиль пользовательского интерфейса и графического дизайна, в котором присутствует минимализм во всех деталях. Этот стиль характерен для веб-дизайна, где отсутствует чрезмерное количество эффектов, текстур, теней, градиентов, бликов и так далее. Flat Design используется в продуктах таких мировых компаний, как Microsoft, Apple, Google и других.

Рассмотрим подробно 5 основных принципов Flat Design:

• 1. Минимализм.
• 2. Отсутствие эффектов.
• 3. Простота элементов.
• 4. Акцент на цвет.
• 5. Аккуратная работа со шрифтами (типографикой).

Минимализм во Flat design

Следует избегать излишней нагрузки на дизайн (отсутствие сложных визуальных элементов): эффектов, поворотов и так далее.

Отсутствие эффектов во Flat design

В плоском дизайне используется только контур объектов. Поэтому во Flat design отсутствуют элементы, придающие объемность и глубину элементу: тени, градиенты, текстуры, блики и так далее.

Простота элементов во Flat design

Это означает простоту форм и очертаний, которая придает легкость дизайну. Простые формы интуитивно понятны и улучшают удобство использования.

Акцент на цвет во Flat design

В плоском дизайне используются специальные палитры цветов, которые можно подбирать с помощью различных сервисов или создавать самому. В Flat Design используются чистые яркие цвета, без лишних переходов и градиентов.

Аккуратная работа со шрифтами во Flat design

Работа со шрифтами должна проводиться очень аккуратно. Характер шрифта должен дополнять, а не противоречить общей схеме дизайна. Шрифт в «плоском» дизайне является важным элементом навигации.

Практическая часть видеоурока

Далее каждый урок будет содержать 2 части: теоретическую и практическую. Все занятия разбиты по темам, начиная от прорисовки простого элемента и двигаясь к более сложным элементам дизайна. Для работы понадобятся такие программки, как Adobe Illustrator и CorelDraw. Ссылки на них приведены ниже:

Adobe Illustrator

CorelDraw

На этом видеоуроке нарисуем иконку лайка. Далее в видео подробно показывается прорисовка этой фигурки с помощью инструментов программы CorelDraw. Сначала идет обрисовка контура лайка с помощью векторов. Стоит отметить, что сложные фигуры строятся из простых геометрических фигур (прямоугольников, кругов и так далее). Затем заливаются цветом все объекты и создается легкая тень с наклоном в 45 градусов.

Интересный факт! Прорисовка плавных изгибов фигуры (в нашем случае пальцев) осуществляется с помощью кривых Безье. Подробнее о них можно прочитать вот здесь.

Надеемся, вас заинтересовал этот видеокурс. Ждем всех на следующих видеоуроках!

Приятного всем просмотра! Учитесь с удовольствием! Всегда ваш LoftBlog!