8 800 500 30 94
9:00-19:00 по МСК
9:00-19:00 по МСК
* Нажимая на кнопку, вы даете согласие на обработку своих персональных данных и получение sms-, email-сообщений и сообщений в# мессенджерах от Среды обучения
Метафоры в дизайне
Большинство из нас помнят термин «метафора» с уроков литературы. На самом деле скрытыми сравнениями пользуются не только поэты. Мы часто говорим метафорами, не замечая этого: например, в таких выражениях, как «время — деньги», «часы стоят» или «снег идет».
Метафоры — не просто приправа к речи. Они «вшиты» в наш язык, без них мы не можем общаться.
Дизайн постоянно опирается на метафоры: на них основаны компьютерные иконки и терминология (например, «облака» в интернете).
Вы наверняка видели вот такой значок: ⚙. Это метафора для «настроек», причем она понятна любому человеку. Уместные метафоры делают дизайн интуитивным.
Дизайн постоянно опирается на метафоры: на них основаны компьютерные иконки и терминология (например, «облака» в интернете).
Вы наверняка видели вот такой значок: ⚙. Это метафора для «настроек», причем она понятна любому человеку. Уместные метафоры делают дизайн интуитивным.
Метафоры, которыми мы живем
Джордж Лакофф — известный американский лингвист, который всю жизнь писал о роли метафоры в мышлении индивида и общественной жизни. Вместе с соавтором Марком Джонсоном он создал книгу «Метафоры, которыми мы живем», доказав, что наша повседневная речь пропитана метафорами — и это влияет на наше восприятие реальности.
Кстати, вы обратили внимание на метафоры в этом тексте? «Речь пропитана метафорами», «дизайн опирается на метафоры», «приправа к речи».
Кстати, вы обратили внимание на метафоры в этом тексте? «Речь пропитана метафорами», «дизайн опирается на метафоры», «приправа к речи».
Метафоры в дизайне
Мы используем метафоры, не задумываясь об этом, — и в речи, и в дизайне.
Когда мы нажимаем на ✏, чтобы отредактировать текст, о реальном карандаше мы не думаем. Нажимая на иконку «лупа», мы не воспринимаем эту кнопку как лупу, мы вспоминаем слово «увеличить».
Все пользователи компьютерных интерфейсов видели эти картинки сотни тысяч раз. Даже если эти значки не подписаны, мы прекрасно понимаем, что они означают.
Все пользователи компьютерных интерфейсов видели эти картинки сотни тысяч раз. Даже если эти значки не подписаны, мы прекрасно понимаем, что они означают.
Кнопка для похвалы
Помните, как в Medium появилась кнопка «хлопающие ладоши»? Это метафорой сервис заявил: «Статья на Medium — это выступление».
Термины, связанные с театром, распространились по всему сайту: теперь автору можно «похлопать», вокруг авторов возникают «фанаты» и «зрители». Обычно текст такими словами не описывают. Хотя Medium мог бы пойти еще дальше: внедрить термины вроде «закулисья» или «повтор на бис».
Метафоры используются везде. Например, на компьютере есть «файлы», «папки», «рабочий стол». С помощью этих метафор ноутбук уподобляется офису.
Термины, связанные с театром, распространились по всему сайту: теперь автору можно «похлопать», вокруг авторов возникают «фанаты» и «зрители». Обычно текст такими словами не описывают. Хотя Medium мог бы пойти еще дальше: внедрить термины вроде «закулисья» или «повтор на бис».
Метафоры используются везде. Например, на компьютере есть «файлы», «папки», «рабочий стол». С помощью этих метафор ноутбук уподобляется офису.
Почему это важно?
Метафоры делают дизайн интуитивным. Если дизайн основан на изображении реальных, осязаемых предметов, людям проще его понять. Если вы используете слишком абстрактные значки, скорее всего, пользователю придется нелегко.
Вот, например, кнопка включения какого-то прибора.
Вот, например, кнопка включения какого-то прибора.
Понятно ли вам, где «вкл.» и где «выкл.»? Скорее всего, нет, так как значки не основаны на картинках из реальной жизни. В отличие от этих:
Метафоры всегда подсказывают интересные решения. И если вы соединяете свои идеи с предметами из реального мира, людям будет очень легко пользоваться вашим дизайном.
Как метафоры всех запутывают
Иногда метафоры не нужны.
Вспомните иконку «камера» на вашем телефоне. Она выглядит как камера, никаких сюрпризов. А теперь представьте, что дизайнер интерфейса решил использовать метафору — например, изображение глаза или что-то еще.
Это только запутало бы пользователя.
Вспомните иконку «камера» на вашем телефоне. Она выглядит как камера, никаких сюрпризов. А теперь представьте, что дизайнер интерфейса решил использовать метафору — например, изображение глаза или что-то еще.
Это только запутало бы пользователя.
Не нужно использовать метафоры, если вы можете просто поставить изображение предмета!
Нагруженные метафоры
Иногда дизайнеру приходится придумывать кнопки, которые выполняют сразу несколько действий. Такие иконки можно назвать нагруженной метафорой: они передают множество смыслов.
Вот пример нагруженной метафоры из операционной системы iPhone: стрелочка вверх подразумевает сразу несколько действий.
Вот пример нагруженной метафоры из операционной системы iPhone: стрелочка вверх подразумевает сразу несколько действий.
Она означает «поделиться» через AirDrop, «добавить» в избранное, «сохранить», «скопировать» и даже «открыть» в другом приложении.
Как назвать такую кнопку? Поделиться? Добавить? Открыть? Одно имя придумать невозможно, поэтому дизайнер поставил абстрактную иконку.
Часто такие метафоры понять сложно — из-за уровня их абстракции. Для того чтобы интерфейс был более интуитивным, лучше разбить все эти действия на разные кнопки.
Как назвать такую кнопку? Поделиться? Добавить? Открыть? Одно имя придумать невозможно, поэтому дизайнер поставил абстрактную иконку.
Часто такие метафоры понять сложно — из-за уровня их абстракции. Для того чтобы интерфейс был более интуитивным, лучше разбить все эти действия на разные кнопки.
Как обучиться мастерству метафор?
С помощью метафоры вы можете легко объяснить любую идею, проассоциировав ее с предметом реального мира.
Дизайнерам, иллюстраторам, писателям бывает сложно найти правильную метафору. Вот несколько ресурсов, которые могут помочь:
Дизайнерам, иллюстраторам, писателям бывает сложно найти правильную метафору. Вот несколько ресурсов, которые могут помочь:
The Noun Project — это огромная база иконок практически обо всем на свете. По любому ключевому слову вы найдете множество картинок. Золотая жила для дизайнеров, иллюстраторов и писателей.
Попробуйте поискать нужное вам слово в Google Картинках — иногда сервис выдает слишком много грязи, но часто попадаются настоящие находки.
Тезаурус — или словарь синонимов — может выручить иллюстраторов и писателей, подсказав новые идеи (Eng!)
Словарь крылатых выражений — секретное оружие копирайтера. Он поможет, если вы ищете точную или необычную метафору. Крылатые выражения чаще всего основаны на конкретных предметах и явлениях; они пригодятся, если вы хотите, чтобы читатель или пользователь увидел в своем воображении ясную картинку (Eng!)
К ДРУГИМ МАТЕРИАЛАМ