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

 

Визуальный сторителлинг — именно тот инструмент, который тебе нужно для этого освоить. Если быть точнее, это целый набор инструментов, с которым ты сможешь сделать свои работы эффектнее, понятнее и живее.

 

Сам термин «визуальный сторителлинг» (также известный как «визуальный нарратив») появился сравнительно недавно. Большинство словарей не знают о таком словосочетании, академические программы университетов не учат этому понятию. Но художники открыли для себя метод визуального сторителлинга уже давно — гораздо раньше, чем появилось название.

 

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

 

Наскальная живопись
Наскальная живопись. Источник

 

Зачем мне визуальный сторителлинг? Разве не проще использовать слова?

Действительно, язык стал настолько универсальным инструментом общения, что использовать его намного проще, чем пытаться передать ту же мысль другими средствами. Но вопрос: будет ли это эффективно?

 

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

 

Конечно, того же эффекта можно добиться текстом. Например, около дома персонажа может окликнуть другой человек, сказав что-нибудь вроде: «Привет, сосед! Что, с работы идешь? Ну, удачно отдохнуть дома!». 

 

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

 

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

 

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

 

Композиция и плановость

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

 

Типа крутые легавые
Источник

 

Кадр из комедии «Типа крутые легавые»: персонажи образуют классическую «геройскую» композицию, но обратная плановость создает комический эффект. Ключевой персонаж сюжета расположен в центре, но задвинут на дальний план и в итоге теряется. Это ломает композицию и глаз сначала воспринимает совершенно неважные элементы. 

 

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

 

Золотое сечение

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

 

Золотое сечение в композиции фотографии
Золотое сечение в композиции фотографии. Источник

 

Пример использования золотого сечения в фотографии: крупные формы, обрамляющие кадр, делятся на сегменты. Линия горизонта обозначает новый виток спирали, поле вписано в виток поменьше, а силуэт человека расположен в самом центре спирали. Мы неосознанно движемся по этому пути, охватывая все элементы по очереди.

 

Если вкратце, меньшая часть должна относиться к большей так, как большая относится ко всему целому. Все в природе стремится к такому соотношению, и человеческий глаз привык воспринимать информацию «по спирали». Принцип «от большого к малому» направляет взгляд зрителя и плавно приводит его в ключевую точку произведения. Такая работа с пропорциями картинки упорядочивает фрагменты математически и делает изображение гармоничным.

 

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

 

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

 

Фото агентства Reuters
Фото агентства Reuters. Источник

 

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

 

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

 

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

 

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

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

 

В результате получается сетка, которая служит опорой для изображения. Сами линии и точки их пересечения — это те участки, на которые человеческий глаз бессознательно обращает наибольшее внимание. А значит, именно в них стоит расположить важные для общей картины объекты. 

 

Также, согласно этому правилу, объекты должны располагаться вдоль направляющих линий сетки. Так картинка будет выглядеть эстетично и легко читаться.

 

Композиция кадра из фильма «Сияние»
Композиция кадра из фильма «Сияние». Источник

 

Даже если на картине или в кадре предполагается много пустого пространства, правило третей позволяет его сбалансировать. Возьмем всемирно известный кадр из фильма «Сияние». Голова Джека Торренса занимает треть от общего кадра, но внимание не рассеивается, потому что все линии и объекты расположены вдоль вертикальных направляющих.  

 

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

 

Фрейминг

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

 

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


 

Кадр из Halo 4 (2012)

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

 

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

 

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

 

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

 

Не стоит ограничиваться рамками кадра. Для кадрирования можно использовать менее существенные объекты.

 

Еще мы часто видим главного героя, Уолтера Уайта, «захваченного» в тесную рамку. Это дополняет образ персонажа и показывает его переживания.

 

Кадр из сериала «Во все тяжкие»
Кадр из сериала «Во все тяжкие». Источник

 

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

 

А еще фрейминг — это отличный способ показать динамику. Наверняка ты слышал, что в повествовании можно «сломать четвертую стену». Обычно речь идет о том, что мы включаем читателя или зрителя в историю, напоминаем, что это все понарошку. Но ведь можно сломать четвертую стену и в прямом смысле!

 

Если изображение имеет реальные границы, можно использовать их как элемент произведения. Это часто используется в иллюстрации, комиксах и графическом дизайне. Допустим, ты изображаешь драку между главным героем и антагонистом. Чтобы сделать сцену динамичнее, можно «сломать» фрейм и вывести часть персонажа за него.

 

 

Страницы из серии комиксов «Скотт Пилигрим», Брайан Ли
Одна из страниц комикса о Скотте Пилигриме
Страницы из серии комиксов «Скотт Пилигрим», Брайан Ли
Страницы из серии комиксов «Скотт Пилигрим», Брайан Ли. Источник

 

 

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

 

Глубина изображения

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

 

Для этого художники размечают планы: передний, средний и дальний. Это улучшает читаемость изображения и помогает наметить акценты. Вот пример того, как разделение картины на планы играет на руку истории:

 

Кадр из фильма «Падшие ангелы»
Кадр из фильма «Падшие ангелы». Источник

 

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

 

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

 

Кадр из сериала «Шерлох Холмс»
Кадр из сериала «Шерлох Холмс». Источник

 

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

 

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

 

Негативное пространство

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

 

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

 

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

 

Силуэты персонажей мультфильма «Коралина»
Силуэты персонажей мультфильма «Коралина». Источник

 

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

 

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

 

 

Обложка мультфильма «Frozen»
Обложка мультфильма «Frozen»

 

 

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

 

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

 

Смотри, как умело использовал пустоту художник Оуэн Дейви в графической новелле «Лайка, собака-космонавт». В этой сцене автор хотел показать, как одиноко Лайке, и поэтому расположил все остальные объекты максимально далеко. Оуэн специально развернул изображение, чтобы задействовать самую длинную диагональ страницы и добавить как можно больше пустого места между собакой и всем остальным миром.

 

Лайка, собака-космонавт
«Лайка, собака-космонавт». Источник

 

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

 

Формы и линии

В психологии есть эффект «буба — кики». Он показывает, как мы сопоставляем звуки с визуальными объектами. Посмотри на картинку ниже и подумай: какая из этих форм «буба», а какая — «кики»?

 

Буба и Кики
Буба и Кики. Источник

 

95% процентов людей отвечают, что округлая форма — это «буба». Людям свойственно связывать звуковые, визуальные и эмоциональные признаки. Так проще осознавать реальность, и это приводит к формированию стереотипов, которые помогают познавать мир. 

 

А теперь посмотри снова на фигуры и скажи: какая из них добрая, а какая злая? Скорее всего, ответ не придется долго искать, и он будет одинаков для большинства людей. И неважно, откуда человек: из мегаполиса посреди пустыни или забытого острова где-то севернее Австралии.

 

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

 

Персонажи Хогвартса
Персонажи Хогвартса. Источник

 

Формы и линии — это способ не только построить сцену композиционно, но и рассказать зрителям историю. Будет улица прямой или со множеством поворотов? Носит персонаж меховую шубу или строгий костюм-тройку? Все эти детали определяют эмоциональную составляющую изображения.

 

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

 

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

 

Кадр из фильма «Гравитация»
Кадр из фильма «Гравитация». Источник

 

Ощущение спокойствия достигается комбинацией нескольких приемов: поза эмбриона образует круг и чувство безопасности, кадрирование фиксирует взгляд и усиливает эффект, а центрирование делает эмоцию ключевой в кадре.

 

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

 

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