🛸🧑🏿‍🦲🇺🇸 День Независимости (1996): принцип сходства в восприятии

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

Если графика это учитывает – то общая форма и цвет будут обозначать, что объекты связаны по функции или смыслу между собой. Например, папки каналов в Телеграме — они выделены одним и тем же цветом (сходство по цвету) или аватарки каналов в виде кружков (сходство по форме) позволяют нам быстро ориентироваться в высоконагруженной графическими элементами среде.

👎 Мой же «кинопример» из разряда фейлов. Карта это не интерфейс в плане интерактивности, но принцип сходства, а точнее его неправильное использование создаёт проблемы.

👀 Присмотритесь к карте, где указаны Moscow, London, Bombay. Нарушение принципа сходства в том, что объекты совершенно разного порядка: 1) столицы (например, Moscow), 2) страны (Germany) и 3) явления (Fire Phenomenon) написаны одинаковым наклонным шрифтом, что создаёт путаницу. За секунду телеэфира понять, что где происходит весьма сложно.

Второстепенные проблемы добавляют хаоса: крайне странные очертания материков, масштаб НЛО, визуальный мусор типа желтых стрелок, указывающих на белые линии 🤯 и.... и куда делось Средиземное море!?

Ну и пользуясь случаем не мог не добавить кадр с Новосйойрском, Петроrрадом (в 1996 году) и зловещей надписью ТУЧА!!! 🙈 — ну что поделаешь Голливуду в те времена видимо жалко было тратить деньги на консультанта по русскому языку.

💭 Вывод:

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

🐱🚪 Пятый элемент (1997): миссия «впустить кота»

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

Знакомство с главным героем, Корбаном Далласом, начинается в его микро-апартаментах. Занимаясь утренней рутиной, он подходит к двери — и на панели управления мы видим набор кнопок с абстрактными пиктограммами. И одну — с котом 😽

Угадайте, какая читается быстрее всех (не учитывая шакальное качество скриншота 🙈)?

🎛 Неконсистентность

Панель выглядит как смесь:

📍геометрических символов,

📍условных иконок,

📍и одного конкретного образа — кота (причём задублированного: и мордочка, и силуэт).

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

Но с точки зрения восприятия — кот выигрывает. Он конкретен, эмоционален и однозначен.

🧠 Почему так работает

1️⃣ Узнаваемость конкретных объектов
Реальные, знакомые объекты мозг распознаёт быстрее, чем абстрактные символы.

2️⃣ Сила метафоры
Интерфейс понятнее, когда действие выражено через знакомый физический мир.

🐱 Вывод

Кнопка (особенно в быту) не должна говорить: «Активировать нижний шлюз 2B».
Хорошо, когда она сообщает: «Я могу впустить кота!».

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

⛴ Машинный телеграф: интерфейс капитана

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

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

❓Как он работает?

Представьте два одинаковых устройства: одно — на мостике, где стоит капитан; второе — в машинном отделении, рядом с механиками.

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

Позиции на шкале — это не числа и не параметры двигателя, а понятные режимы работы:
• Стоп
• Малый ход
• Средний ход
• Полный ход
• Самый полный вперёд

и те же режимы назад

Важно: телеграф не управляет двигателем напрямую. Он передаёт команду человеку. Механик смотрит на стрелку, выполняет приказ — и переводит свою рукоятку в то же положение. Когда обе стрелки совпадают — команда подтверждена.

❓ Почему рукоятку нужно дергать «туда-сюда»?

В кино часто видно, как капитан резко переводит рукоятку, а потом механик делает то же самое в ответ.

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

Почему этот интерфейс так хорош?

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

Любимец кинематографа

Режиссёры любят машинный телеграф не случайно. Потому что это интерфейс, который выглядит не как посредник, а как действие.

Это не какая-то рандомная скучная кнопка. Капитан самолично и очень визуально отдаёт приказ.

Рука на латунной рукоятке.
Широкий жест.
Резкий щелчок.
Звон в глубине корабля.

И где-то в машинном отделении огромный двигатель начинает менять ход.

🧜‍♀️Итого

Когда от действия зависит судьба целого судна, то стоит убедиться что это действие, которое:

📍невозможно пропустить
📍невозможно неправильно понять
📍и которое обязательно требует подтверждения.

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

Примеры из: Хроники хищных городов (2018), Титаник (1997), Жестокий романс (1984)

💵📈 «Дурные деньги»: иллюзия контроля в финтехе

Фильм «Дурные деньги» рассказывает историю финансового бунта 2021 года вокруг акций сети магазинов GameStop.

Блогер и инвестор Ревущий котёнок (Roaring Kitty) начинает на стримах покупать акции компании и объяснять свою стратегию в Ютубе и на Reddit-сообществе r/WallStreetBets. За ним следуют тысячи частных инвесторов.

Они массово скупают акции и запускают знаменитый short squeeze: хедж-фонды, которые ставили на падение акций компании, вынуждены срочно выкупать их обратно. Цена начинает стремительно расти.

📈 Финансовый интерфейс

Авторы скрупулёзно воссоздают атмосферу 2021 года: лайвстримы на YouTube, бесконечные треды на Reddit, мемкоины, трейдинговые программы.

Одним из главных «героев» становится трейдинговое приложение Robinhood, через которое миллионы частных инвесторов покупали акции GameStop.

И в один из ключевых моментов происходит то, что в реальности вызвало огромный скандал.

❓ Куда делась кнопка?

В приложении становится неактивной кнопка "Купить"!

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

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

У Robinhood просто не оказалось таких денег прямо в тот момент, поэтому покупки пришлось временно остановить.

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

✨ Иллюзия контроля

Именно здесь фильм показывает важную вещь — иллюзию контроля, которую создают современные финтех-интерфейсы.

Приложения вроде Robinhood делают инвестиции похожими на простое и понятное действие: график, баланс, кнопки Buy и Sell — и вот, деньги у меня на счету!

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

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

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

💱 Итого

Пока кнопка Buy работает — кажется, что контроль у тебя.

Когда она исчезает — становится понятно, что ты управлял не рынком.

Ты управлял интерфейсом.

Иногда весь сложнейший финансовый рынок представлен для пользователя одной кнопкой. И пока она активна — система кажется простой и доступной. Но именно в тот момент, когда кнопка «Купить» становится серой, становится видно, где на самом деле находится контроль. 📉

⚾️🧢 «Человек, который изменил всё» (2011): таблицы как интерфейс управления

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

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

И его главным инструментом становится таблица с показателями игроков.

🪧 Но почему? Что такого делает таблица?

Таблица — это не просто хранение данных. Это способ разложить реальность на признаки.

Игрок больше не «харизматичный» или «пожилой». Он — набор чисел в колонках. Хотя при желании можешь добавить колонку «харизматичность» — и вуаля! — можешь заполнять параметр. Причем можешь оценивать харизму в формате «да / нет», в формате шкалы от 0 до 10, в формате художественного описания: да как угодно, хоть всё вместе — просто добавляй нужные столбцы!

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

🪧 Почему Excel победил?

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

🎯 Итого

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

🎯 посчитать

🎯 сравнить

🎯 контролировать

Но вместе с этим таблица подменяет вопрос «что важно?» на «что можно записать в столбец?».

И в какой-то момент можно начать управлять не реальностью, а её табличной версией, всё дальше удаляясь от проблем и несостыковок.