Дизайн
#статьи

Что такое визуальная метафора

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

Иллюстрация: Аня Макарова для Skillbox Media

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

«Метафора» — это ведь термин из филологии?

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

А в визуальной метафоре такое сравнение и перенос смысла закладывают не словом, а графикой, картинкой.

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

В иллюстрации визуальная метафора — один из основных инструментов
Изображение: Bindy Xie / Behance

Можно пример?

Самое известное — это рабочий стол с иконками папок и файлов.

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

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

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

Иконка-кошелёк метафорически означает траты, изображение мешочка — накопления
Изображение: THE KLEN / Kate Pletneva / Behance

Визуальные метафоры нужны, чтобы показывать виртуальные понятия как реальные вещи?

Это одна из их функций.

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

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

Айдентика фестиваля построена на графическом представлении волны и свойства арбуза звонко звучать, когда его проверяют на спелость. Получилась визуальная метафора «арбуз как звуковая волна»
Изображение: Ирина Климашова / Behance

Значит, задача визуальных метафор — доступно объяснить непонятное?

Верно.

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

Форма тоже может быть визуальной метафорой. Упаковка ухода для кожи напоминает очень популярный в Юго-Восточной Азии и Северной Африке продукт — баночку молочного продукта с пробиотиками
Изображение: «Золотое Яблоко»

А что визуальные метафоры делают в рекламе и брендинге?

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

Визуальная метафора в логотипе кофейни: буква О как слайдер включения
Изображение: Soad Mady / Behance

Примеры такие разные! Как понять, что перед нами визуальная метафора?

Чётких правил нет: есть масса способов показать сравнение с помощью картинки. Может меняться форма, текстура или цвет объекта.

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

Креатив на баннере оформлен как карточка Pantone, потому что промокод — это слово, обозначающее яркий оттенок зелёного. И есть контекст, который знаком большинству: такой неоновый цвет бывает у стандартных наклеек-ценников
Изображение: «Золотое Яблоко»

Дизайн логотипов, рекламы или иконок всегда построен на метафорах?

Нет. Визуальная метафора — только один из дизайнерских приёмов.

Можно использовать абстрактные изображения или просто отрисовывать объекты в определённой стилистике — без всяких сравнений.

В дизайне фирменного стиля для скачек в Сиене нет метафор: голова лошади означает, что мероприятие посвящено лошадям, а паттерны отсылают к гербовой эстетике
Изображение: Francesca Melillo / Behance

А как выбирают объекты для сравнения? Визуальную метафору можно составить из чего угодно?

Не совсем.

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

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

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

Дизайнерка провела аналогию между пастой и букашками, и, кроме того, визуальное решение основано на качестве продукта: согласно концепции, в состав пасты входит порошок из насекомых
Изображение: Tanya Lebedeva / Behance

Кажется, придумывать визуальные метафоры непросто. Этому можно научиться?

Можно.

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

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

Также помогает работа с мудбордами — наборами изображений, деталей, цветов, текстур, текстов, которые визуализируют определённое настроение проекта.

Больше интересного про дизайн в нашем телеграм-канале. Подписывайтесь!

Научитесь: Профессия UX/UI-дизайнер Узнать больше
Понравилась статья?
Да

Пользуясь нашим сайтом, вы соглашаетесь с тем, что мы используем cookies 🍪

Ссылка скопирована