Шпаргалка «Основы любого дизайна» — часть 1

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

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

Шпаргалка «Основы любого дизайна» — часть 1

Содержание

Введение

Дизайнер — это не художник, а скорее разработчик. А в таких отраслях, как дизайн интерфейсов — даже инженер. Используя фантазию и навыки визуального оформления, он создает функциональную оболочку объекта или продукта.

Хотите создать хороший дизайн? Посмотрите на него как маркетолог. Какой должна быть презентация товара, чтобы его захотели купить?

Подборка интересных дизайн-решений с сервиса Pinterest<br />
Подборка интересных дизайн-решений с сервиса Pinterest

Направления дизайна

В зависимости от производимой продукции существует множество направлений дизайна:

  • графический дизайн: корпоративный стиль бренда, веб-сайты, буклеты, брошюры, книжные макеты и иллюстрации, информационные плакаты и многое другое. Данная область — самая широкая;
  • промышленный дизайн: электроника, автомобили, мебель, посуда, украшения, одежда и оборудование и так далее;
  • Архитектурный и ландшафтный дизайн: архитектурные строения, оформление парков и тому подобное;
  • Дизайн среды: оформление помещений и других локаций.

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

§ Тема «Композиция»

Первое, чему необходимо научиться любому, кто вообще работает с кадром — это размещать объекты в кадре так, чтобы управлять вниманием зрителя.

Не важно, что вы делаете: афишу, экран приложения, видео или фотографию. Если вы сумели превратить картинку в историю, где всё на своих местах и один объект вытекает из другого, то зрителю будет легче понять мысль, которую вы хотите донести.

1. Линейная перспектива

Способ построения изображения, при котором взгляд зрителя падает на одну точку, а все окружающие объекты, указывают на неё.

Шпаргалка «Основы любого дизайна» — часть 1

При построении линейной перспективы следует учесть:

  • Крупные объекты кажутся ближе;
  • Форму объектов и их искажение (как в примере с домами).

2. Направляющие линии

Приём, при котором взгляд наблюдателя перемещается по линиям.

Линии могут быть как реальными (как в примере с афишей), так и воображаемыми. Например, фасады домов ниже

Наверняка вы уже заметили, что такие линии часто используются в линейной перспективе

3. Воздушная перспектива

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

Что нужно помнить:

  • По мере удаления цвета становятся менее контрастными, как в дымке на примере;
  • Размытые объекты также кажутся более отдаленными.
Шпаргалка «Основы любого дизайна» — часть 1

4. Тональная перспектива

это изменение в цвете и тоне предмета при удалении вглубь пространства.

Взгляните на пример с карандашами и на картинку справа от них:

Шпаргалка «Основы любого дизайна» — часть 1

Вы быстрее обратите внимание на красный, оранжевый, желтый, чем на голубой, синий цвета.

Это происходит из-за психологии восприятия мира человеком. Мы привыкли видеть рядом с собой кожу других людей, яркие цветы, а небо — где-то вдали.

5. Правило третей

Шпаргалка «Основы любого дизайна» — часть 1

Вы наверняка слышали об этом методе и точно замечали сетку на камере своего фотоаппарата или смартфона. Работает она так:

Если разбить изображение на три части по вертикали и на три части по горизонтали и разместить объект в точках пересечения, то взгляд зрителя будет фокусироваться на нём.

Шпаргалка «Основы любого дизайна» — часть 1

6. Статический и динамический кадр, диагонали

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

Иногда, чтобы изменить настроение композиции, достаточно просто перевернуть его:

Шпаргалка «Основы любого дизайна» — часть 1

Если наклонить или расположить объекты по диагонали, то работа не только станет динамичной, но и обретет настроение лёгкости или трудностей:

  • Восходящие линии создают ощущение роста и трудностей;
  • Нисходящие — передают легкость.
Шпаргалка «Основы любого дизайна» — часть 1

7. Симметрия и баланс

Симметрия — это визуальное качество, при котором части изображения повторяются по оси, в определенном направлении или вокруг центра.

Существует несколько основных типов симметрии:

  • Осевая (известная всем со школы) — симметрия, проведённая относительно прямой;
  • Центральная — проведённая относительно точки;
  • Трансляционная — тип симметрии, при котором свойства рассматриваемой системы не изменяются при сдвиге на определённый вектор;
  • Мозаичная — тип симметрии, основанный на ячейках. Примером могут послужить пчелиные соты или логотип Windows;
  • Скользящая зеркальная — это одновременно выполненные осевая и трансляционная симметрия. Как пример — следы человека на песке;
  • Вращательная — это симметрия объекта, повёрнутого на определённый угол.
Шпаргалка «Основы любого дизайна» — часть 1

Асимметрия, относится ко всему, что не является симметричным.

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

8. Построение дизайн-системы

Атомарный дизайн — это методология, которая поможет Вам проследить взаимосвязь и строение элементов любого дизайна.

Суть в том, чтобы создавать концепцию не сразу, а собирая отдельные элементы в объекты. Также, как атомы собираются в молекулы. Молекулы — в «ткани» и «органы». Органы — в единый организм, итоговую работу.

Рассмотрим её на примере создания дизайна страницы сайта:

Шпаргалка «Основы любого дизайна» — часть 1

В следующей части

Рассказать обо всех основных аспектах дизайна в одной статье невозможно. Да и вам нужно время, чтобы уложить в голове полученный из статьи материал.

В следующем выпуске вы узнаете:

Как «Магия цвета» может сделать дизайн дороже, какие «Пять законов восприятия» помогают нам разделять объекты и как правильно выбрать шрифт для своего дизайна

8
Начать дискуссию