Исследуем визуальные индикаторы в реальной жизни

Элементы пользовательского опыта и дизайна интерфейсов за пределами цифровых продуктов.

Конспект материала UX-дизайнера студии DesignMap Джо Карона подготовили Ольга Жолудова и Ринат Шайхутдинов.

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

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

В цифровом мире примеры индикаторов повсюду. В Gmail иконка скрепки символизирует вложение, а жёлтой звёздочкой отмечаются сохранённые диалоги. Пользователи Todolist используют цвета для определения приоритетов, а благодаря символу «Сообщение» сразу видят, к каким делам добавлены комментарии. А когда в iOS скачиваются обновления, мы видим статус загрузки поверх иконки приложения.

В UX и дизайне интерфейсов все принципы работы можно переложить на реальный мир. Индикаторы, как и аффордансы (сигналы, что объект подходит для выполнения конкретного действия), существуют в окружающем мире — и передают сообщения, как в digital-мире. Распространённый визуальный индикатор — дополнительный текст, например, ярлычки в магазине «Скидка 20%».

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

Статус

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

Предмет: почтовый ящик.

Индикатор: флажок в поднятом состоянии (есть посылка или нет).

Для кого: для почтальона.

Сообщение: «Пришло письмо, нужно забрать».

Предмет: счёт в ресторане.

Индикатор: из счёта торчит карточка (статус оплаты).

Для кого: для официантов.

Сообщение: «Можно принимать оплату».

Предмет: турбина самолёта.

Индикатор: спираль в движении (работает или нет).

Для кого: для работников аэропорта.

Сообщение: «Двигатель самолёта запущен».

Бонус: этот индикатор иногда помогает отпугивать птиц.

Прогресс

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

Предмет: книга.

Индикатор: закладка на определённой странице (прогресс чтения).

Для кого: для читателя.

Сообщение: «Смотри, сколько ты уже прочитал. Ты уже на полпути».

Предмет: тормозные колодки на велосипеде.

Индикатор: насколько использованы тормоза.

Для кого: для велосипедиста.

Сообщение: «Колодки почти стёрлись, пора покупать новые».

Предмет: авокадо.

Индикатор: цвет под стебельком (степень спелости).

Для кого: для покупателей и голодных любителей гуакамоле.

Сообщение: коричневый цвет — перезрелый или побитый. Зелёный — спелый, можно есть.

Мои любимчики

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

Предмет: пивная банка.

Индикатор: вмятина на банке (владение).

Для кого: для всех, кто пытается украсть моё пиво.

Сообщение: «Это не ваше пиво».

Бонус: ярлычки для бокалов вина (и подвески для полотенец) работают по такому же принципу.

Предмет: чайник в ресторане.

Индикатор: расположение крышки на чайнике (пустой или полный).

Для кого: для официантов.

Сообщение: «Чайник пустой. Можете добавить воды?»

Предмет: рубашки.

Индикатор: положение крючка вешалки (чистая или уже надевал)

Для кого: для меня.

Сообщение: крючок от себя — рубашка чистая. Крючок к себе — уже надевал.

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

0
50 комментариев
Написать комментарий...
Anton Zhitarev

Зачем ношеную рубашку вешать в шкаф?

Ответить
Развернуть ветку
Миша Сделал

Нафиг шкаф. Для этого есть спинка стула.

Ответить
Развернуть ветку
Anton Zhitarev

На стуле кот.

Ответить
Развернуть ветку
Eduard Vereshaka

Пхахахаха, классика

Ответить
Развернуть ветку
sdff

А куда её девать?

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

Ответить
Развернуть ветку
Anton Zhitarev

Как куда? В корзину для грязного белья.
А потерявшая вид рубашка выбрасывается/отдаётся в приют для хипстеров и покупается новая.

Ответить
Развернуть ветку
sdff

Глупости пишите.

Ответить
Развернуть ветку
Anton Zhitarev

Если это призыв писать глупости, то он, скорее обращён к Вам.
Если же вы пытались сказать, что я пишу глупости, то следовало писать "глупости пишЕте).

Ответить
Развернуть ветку
sdff

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

Ответить
Развернуть ветку
Anton Zhitarev

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

Ответить
Развернуть ветку
sdff

Быть, а не казаться. Слышали такое выражение?
И ещё, простите конечно за бестактность, но чем вы занимаетесь и как часто моетесь, если вам после каждой носки требуется стирка рубашки?

Ответить
Развернуть ветку
Anton Zhitarev

Вот-вот. Быть, а не казаться. Если в Вашем случае "казаться, а не быть", то в моём именно "быть, а не казаться".
Цивилизованным культурным человеком. От которого не несёт потом, а воротник рубашки чистый.

Хотя, готовьтесь, ближе к 15 годам у Вас тоже начнётся гормональный рост.

Ответить
Развернуть ветку
sdff
Хотя, готовьтесь, ближе к 15 годам у Вас тоже начнётся гормональный рост.

Открою тайну. Не все мужики воняют как грязные потные собаки.

Ответить
Развернуть ветку
Юрий Б.

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

Ответить
Развернуть ветку
sdff

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

Ответить
Развернуть ветку
Anton Zhitarev

Не обязательно "вонять", достаточно пахнуть. И обоняние у всех разное.

Ответить
Развернуть ветку
sdff
Вот-вот. Быть, а не казаться. Если в Вашем случае "казаться, а не быть", то в моём именно "быть, а не казаться".

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

Ответить
Развернуть ветку
Anton Zhitarev

И что с моей рукой не так?

Ответить
Развернуть ветку
sdff

Бесплатный совет. Вещи стирают, если они грязные. Пользуйтесь.

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

Ответить
Развернуть ветку
Anton Zhitarev

Спасибо за совет.
Но с рукой-то что не так? Почему Вы решили, что я не похож на человека у которого нет рубашек?

Ответить
Развернуть ветку
sdff

Я не сказал, что у вас нет рубашек. Читайте внимательно.

Ответить
Развернуть ветку
Anton Zhitarev

Я не знаю, что Вы там себе напридумывали, но у меня всегда в шкафу висит 25 свежих выглаженных рубашек. И 4 свежих костюма.

Ответить
Развернуть ветку
sdff
у меня всегда в шкафу висит 25 свежих выглаженных рубашек. И 4 свежих костюма.

АХАХАХ. Живите с этим.

Напомню только: Быть, а не казаться.

Ответить
Развернуть ветку
Anton Zhitarev

Я, видимо, не улавливаю соли.
Не поясните?

Ответить
Развернуть ветку
sdff
От которого не несёт потом, а воротник рубашки чистый.

Повторю вопрос:

И ещё, простите конечно за бестактность, но чем вы занимаетесь и как часто моетесь?
Ответить
Развернуть ветку
Anton Zhitarev

Моюсь каждый день, а что?
В жаркие дни или в дни тренировок иногда больше.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Anton Zhitarev

Так я и не лез. Это мне начали доказывать, что я не так живу и делать выводы по моей руке.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Anton Zhitarev

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

Ответить
Развернуть ветку
Злой Одуванчик

Сатанист

Ответить
Развернуть ветку
Александр Лукьянов

Вы про рубашки в принципе или только про белые сорочки?

Ответить
Развернуть ветку
Anton Zhitarev

Про любую рубашку, которая надевается на тело.

Ответить
Развернуть ветку
Ася Цыганкова

есть специальные открытые комнатные вешалки, чтобы не в шкаф)

Ответить
Развернуть ветку
sdff

Ну это всё меняет. ;)

Ответить
Развернуть ветку
sando

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

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Timur Kuzmin

Ну, как тебе жена? — Хороший жена, только очень грязный, однако! — Как, грязная?! — Если чукча чистый, зачем ему мыться? А жена каждый утро моется!

Ответить
Развернуть ветку
Pavel Dolgov

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

Ответить
Развернуть ветку
Roman Smirnov

Закладка в книге - для отображения прогресса чтения?
Извините, но нет.

Ответить
Развернуть ветку
Катерина Лялина

Объясните, пожалуйста, зачем эта статья? Я где-то идеи не уловила. Определение индикатора можно и покороче сделать...

Ответить
Развернуть ветку
Timur Kuzmin

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

Ответить
Развернуть ветку
Катерина Лялина

"Для развития усложненного понимания простых и привычных вещей" - круто! Спасибо, буду пользоваться ;)

Ответить
Развернуть ветку
Виталий Воробьев

А как же красный/зеленый цвет на замке общественного туалета?

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Ольга Жолудова
Автор

визуальный индикатор говорит "закрыто", а национальный фактор — "да наверняка сломано!" :)

Ответить
Развернуть ветку
Wladimir

Чайник с перевёрнутой крышкой - неудачный пример.

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

Если в общепринятом застольном этикете нет этой фичи, официант не догадается что перевёрнутая крышка это сигнал о том, что чай закончился :)

Ответить
Развернуть ветку
Timur Kuzmin

Черт, так вот зачем все эти странности в мире за экраном моего смартфона! Учту)

Ответить
Развернуть ветку
Yan Yanov

Неплохо

Ответить
Развернуть ветку
Александр Албул
Ответить
Развернуть ветку
Ivor Barhansky
«Чайник пустой. Можете добавить воды?»

В реальности на просьбу добавить воды прилетают какие-то неадекватности вроде:
- требование доплатить за воду;
- ошалевший взгляд и отказ;
- доливают но с завышенным презрением, как для нищебродов.

Хотя казалось бы… Особенно актуально для сортов чая, которые не раскрываются полностью на первом заливе.

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
47 комментариев
Раскрывать всегда