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

В этом курсе статей вы узнаете все, что необходимо любому начинающему дизайнеру.

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

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

Содержание

  1. Введение
  2. Тема «Композиция»

Введение

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  • По мере удаления цвета становятся менее контрастными, как в дымке на примере;
  • Размытые объекты также кажутся более отдаленными.

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

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

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

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

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

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

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

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

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

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

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

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

  • Восходящие линии создают ощущение роста и трудностей;
  • Нисходящие — передают легкость.

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

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

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

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

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

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

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

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

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

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

Анонс следующей части

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

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

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

Новости «Пролога»