Соответствие между системой и реальным миром (юзабилити эвристика #2)

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

Когда элементы управления спроектированы с соблюдением норм, стандартов реального мира и соответствуют желаемым результатам (это называется естественной проекцией*) пользователям становится проще понять и запомнить принципы работы интерфейса. Это позволяет создать интуитивно понятный пользовательский опыт.

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

** В дополнение хотелось бы привести в качестве разъяснения пример из вышеупомянутой книги — «Дизайн привычных вещей».
«Традиционные варианты расположения конфорок на плите представлены на рис. А и Б: конфорки расположены прямоугольником, а регуляторы выстроены в прямую линию. Обычно имеет место частичная естественная проекция, когда два левых регулятора отвечают за левые конфорки, а два правых — за правые. Даже если так, есть четыре возможных варианта проекций регуляторов и конфорок, и все четыре используются в кухонных плитах. Единственный способ узнать какой регулятор отвечает за какую конфорку, — прочитать подписи. Но если бы регуляторы также были расположены четырехугольником (рис. В) или конфорки были бы расположены в шахматном порядке (рис. Г), не нужно было бы никаких подписей. Запоминать было бы просто, количество ошибок бы уменьшилось.»

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

Как профессионалы в сфере UX проектирования мы никогда не должны полагать, что наша собственная интерпретация и понимание слов или объектов такие же, как и у пользователей. (В этом вопросе Вы ≠ Пользователь, как это сказано на ваших футболках.) То, как мы воспринимаем и объясняем окружающий нас мир, зависит от различных субъективных и косвенных факторов. Наш личный опыт, то, как мы выстраиваем взаимосвязи, наши убеждения, идеи и ценности — всё это в совокупности влияет на выводы, лежащие в основе сформировавшихся значений, отличия в интерпретации которых варьируются от индивидуальности к индивидуальности. Чтобы подробнее понять данную эвристику, давайте разобьем её на части и рассмотрим каждую их них подробнее.

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

Пользователи должны иметь возможность понимать используемые вами значения без необходимости прибегать к помощи поисковых систем для их расшифровки. К примеру, на сайте профилактики здоровья BlueCross BlueShield of North Carolina пользователям ясны для понимания заголовки и относящаяся к ним информация. Их описание изложено понятными значениями и примерами, которые позволяют доходчиво разъяснить, что такое профилактика здоровья и почему она так важна. Также сайт предоставляет ответы на часто задаваемые вопросы о профилактике здоровья и объясняет, в чём заключаются преимущества компании BlueCross BlueShield.

Рассмотрим противоположный пример — страница «О продукте» сайта программного обеспечения Abacus, предназначенного для юридической отрасли, контентная составляющая которого написана техническим языком и изобилует специфическими терминами. В секции страницы Abacus Private Cloud Quick Facts использован неоправданно сложный язык с неясным для пользователем значением фраз, специфика которых может быть понятна исключительно профессионалам из IT отрасли (ни юристам, являющимся основной ЦА продукта, ни, уж тем более, обычному пользователю.) Более того, текст содержит акронимы без какой-либо расшифровки используемых сокращений. Никогда не стоит рассчитывать на то, что пользователи поймут значения аббревиатур и акронимов при первом прочтении. Изначально предоставляйте информацию без сокращений, прописывайте фразы полностью, объясняя что они означают и почему это так важно, прежде чем сводить их к сокращенной мнемонике.

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

Всё потому, что пользователи выстраивают ментальные модели либо предположения о том, как работает представленная система, опираясь на имеющийся опыт, который был приобретён в реальном мире. Таким образом, когда пользователи переходят из физического мира в мир цифровой, они переносят с собой устоявшиеся (сформированные) интерпретации. Пользователи ожидают, что элементы интерфейса, представленные в виде материальных объектов, предоставляют такие же возможности, как и в реальном мире. Например, одна из функции iPhone — приложение «Компас» выполняет то же назначение, что и соответствующее устройство в реальном мире. Хотя в этом приложении «Плоский», минималистичный дизайн предпочли скевоморфизму, включение в интерфейс отображения узнаваемых графических элементов и ожидаемо привычных возможностей позволят пользователям с лёгкостью пройти опыт взаимодействия с данной функцией.

Несостыковки в понимании могут в действительности стать причиной возникновения проблем для пользователей в случае, если графические элементы интерфейса не соответствуют своим версиям из реального мира. К примеру, на сайте Cars.com, в нижней части изображения мы заметили серые полукруги с белыми символами. Данные объекты представлены в виде элементов управления для перелистывания галереи изображений слева-направо и наоборот. Несмотря на то, что они едва ли напоминают уголки для фотографий, используемые для оформления фотоальбомов, данные элементы совсем не похожи ни на кнопки или стрелки, ни даже на узнаваемые символы, которые используются для обозначения перелистывания (пагинации) в реальном мире или цифровом пространстве. Данное решение демонстрирует неудачную попытку воплощения скевоморфного дизайна.

Способы усиления ознакомления с системой посредством ассоциаций из реального мира лежат за пределами только лишь визуального сходства элементов интерфейса с физическими объектами. В каждой культуре есть общепринятые, широко распространенные метафоры, которые должны быть приняты во внимание при проектировании интерфейса. (Углубленные дискуссии об упомянутых метафорах вы можете найти в книге Джорджа Лакоффа и Марка Джонсона «Метафоры, которыми мы живём».) К примеру, на Западе мы ассоциируем верх с «больше», а низ — с «меньше». Используя данную метафору спроектирован дизайн наушников, в котором расположение кнопок для управления звуком представляет собой естественную проекцию — кнопка увеличения громкости находится над кнопкой уменьшения громкости. Такие естественные проекции, которые следуют пользовательским ожиданиям и соответствуют их восприятию мира, упрощают, делают интуитивно понятным выполнение задач без необходимости запоминать дополнительную информацию.

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

Чтобы соответствовать пользовательским ожиданиям и ранее приобретенному опыту с системами реального мира, информация должна быть представлена логическим и естественным образом. Пример, где представление информации является неясным и нелогичным, вы можете наблюдать в мобильной версии сайта Таможенной и пограничной службы США, когда пользователи начинают процесс регистрации на Global Entry (программа, которая позволяет ускорить оформление предварительно одобренных путешественников по прибытии в США). После перехода на страницу на пользователя сыпятся неуместные, несвоевременные уведомления, которые не соответствуют первому этапу регистрации. Более того, первое уведомление содержит техническую терминологию и сокращения для внутреннего пользования (специфические акронимы, используемые сотрудниками службы), которое не помогает пользователям понять, что нужно сделать в том случае, если у них уже есть аккаунт. Для улучшения пользовательского опыта уведомления, подобные описанным, всегда должны контекстно соответствовать текущему процессу пользовательского сценария, своевременно отображаться в той части запущенного процесса, где они имеют наибольшее значение для релевантной группы пользователей. Пользователи не будут обращать внимания на уведомления в текущей их реализации и могут упустить важную информацию.

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

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