Mail.Ru Group: предварительные данные по выручке за III квартал 2016 года
Previous
выбрать за меня
Опубликовано исследование о тендерах на SEO-услуги
Next
юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux
Юзабилити

Оценка юзабилити: гид по когнитивным измерениям

Автор: Ия Пфанштиль26.10.2016

Юзабилити — это оценка того, насколько легко пользователям использовать интерфейс. Основной вопрос здесь: «Как легко пользователь может понять и использовать UI моего продукта для достижения своих целей?».

Существует множество подходов к оценке интерфейсов и определения возможностей для их улучшения. Один из них эвристика юзабилити или принципы дизайна. 10 эвристических подходов Nielsen Norman (опубликованные в 1995) – на сегодняшний день одна из самых популярных и широко используемых теорий. Но есть и альтернативные варианты, эффективные, но менее известные.

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

Когнитивное измерение рамок было впервые представлено Томасом Грином (niversity of Leeds) в 1989/1991. Спустя несколько лет в 1996 Томас Грин и Мариан Петре разработали более детальный анализ языков программирования, используя когнитивные измерения. Они подробно изучили, как работает каждое измерение и как его использовать.

До недавнего времени эти измерения можно было найти только в академических трудах, а попытки объяснить измерения и применить их к дизайну продукта практически не предпринимались. В сегодняшней статье мы сделаем шаг вперед в этом направлении и рассмотрим, как можно применить каждое из измерений к UX и дизайнерскому процессу.

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

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

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

14 когнитивных измерений системы обозначений

1. Вязкость

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

2. Видимость

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

3. Преждевременное обязательство

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

4. Скрытые зависимости

Это еще одна опция с выбором «да/нет». Все зависимости элементов системы должны быть очевидны.

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

Также вы можете группировать Символы, но здесь начинаются проблемы. Если вы наложите Символ A на Символ B, а на Символ A наложите Символ X (что сделает X зависимым от A), то при изменении Символа B эффект будет сложно определить или предсказать без поиска всех связанных Символов.

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

5. Экспрессивность ролей

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

6. Вероятность совершения ошибки

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

7. Абстракция

Абстракция — это набор сгруппированных вместе элементов, который должен расцениваться как единое целое, чтобы снизить вязкость или помочь пользователю понять UI элемент. Барьер абстракций — это число абстракций, которое должен освоить пользователь, чтобы использовать систему. Чем он ниже, тем лучше.

Абстракция меняет базовые взаимодействия. Обычно она их расширяет. Например, UI элементы, которые используются для набора номера в телефоне на iOS, это цифры 0-9. Но так как приложение предлагает функцию «избранные», существует более одного способа позвонить кому-либо. Так концепция совершения звонка расширяется.

8. Вторичная система обозначений

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

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

9. Близость результата

Близость результата — это то, как элементы интерфейса отображают свои результаты. Если кнопка «Добавить в корзину» отправляет товар в список желаний, а не корзину, этот элемент далек от результата, который он описывает.

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

10. Единообразие

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

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

11. Диффузность

Диффузность определяет число символов или объектов, необходимых для выражения значения. Чем меньше места используется, для передачи сообщения, тем лучше.

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

12. Сложные ментальные операции

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

Пример сложных ментальных операций — интерфейс Wolfram|Alpha, который требует ввода синтаксически сложных запросов. Пользователю приходится либо запоминать синтаксис, либо записывать его или искать ответ в интернете.

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

13. Предварительный взгляд

Предварительный взгляд позволяет пользователям делать ориентировочный выбор перед принятием основного решения. Он сглаживает преждевременное обязательство, что улучшает юзабилити системы.

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

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

14. Прогрессивная оценка

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

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

Применение на практике

Итак, мы познакомились с теорией. Пора переходить к практике. Давайте посмотрим, как работает этот подход на реальном примере.

Когнитивные измерения используются для понимания того, как пользователи взаимодействуют с продуктом. Они помогают специалистам принимать лучшие дизайнерские решения.

Проведем оценку по всем 14 критериям приложения InVision — инструмента для создания прототипов. Попробуем определить, почему оно пользуется успехом, и как его можно улучшить.

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

Хорошая видимость

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

Внутри прототипа вы можете видеть список всех экранов. Вся необходимая информация доступна на одной странице при наведении курсора.

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

Абстракции

Абстракция — это несколько элементов, воспринимаемых как единое целое, призванных помочь пользователю понять взаимодействие.

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

На фото ниже синие формы были созданы вручную, а зеленые при помощи шаблона.

Вторичные системы обозначений

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

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

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

Единообразие

Использование единообразных элементов позволяет пользователям распознавать знакомые символы.

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

юзабилити, UX-дизайн, функциональный дизайн, аналитика приложений, тестирование мобильных приложений, приложения, интерфейс, удобство пользования интерфейсом, пользовательский опыт, ui, ux

Прогрессивная оценка

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

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

Реакция на статью
поделюсь
0%
интересно
0%
полезно
0%
не уверен
0%
скучно
0%
где автор?
0%
Ия Пфанштиль
Стараюсь радовать читателей полезным и качественным контентом.
Комментарии
Оставить отзыв

    You must log in to post a comment

    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Уведомления о новостях, статьях и инфографике будут приходить раз в неделю.
    ПОДПИШИТЕСЬ НА НАШУ РАССЫЛКУ!
    Позвольте нам обновлять ваши знания раз в неделю.