Концептуальные модели: скрытая структура вашего следующего великолепного интерфейса

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

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

В этом видео Уильям Хадсон Пользовательский опыт Стратег и основатель Syntagm Ltd использует примеры развивающегося интерфейса Amazon, чтобы показать, как концептуальные модели раскрывают основные концепции дизайна и гарантируют, что пользователи смогут легко понять, как работает система.

Последовательность Amazon укрепляет доверие и взаимопонимание пользователей

В видео Уильям рассказал о британском веб-сайте Amazon с точки зрения концептуальных моделей. Скриншоты воспроизведены ниже. Одним из основных моментов является то, что, несмотря на многочисленные изменения визуального презентация более 20 лет, концептуальная модель основного сайта электронной коммерции не изменилась.

Модель (вверху) и скриншоты (внизу) наглядно демонстрируют основные концепции:

• Корзина для покупок

• Счет

• Отделы

• Поиск

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

Сопоставьте свой интерфейс с тем, как думают пользователи, и сделайте интерфейсы удобными

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

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

Модель пользователя

Модель пользователя проста:

1. Вы запрашиваете лифт с помощью кнопки вызова.

2. Внешний индикатор этажа показывает, где сейчас находится лифт.

3. Дверь открывается, когда приезжает лифт.

4. Вы вводите и выбираете этаж назначения с помощью кнопки внутри («выбор этажа» на схеме).

Хотя многие лифты работают аналогично описанному выше, в более крупных зданиях с многочисленными лифтами теперь используется существенно другая модель:

1. Вы выбираете этаж назначения на общей панели в вестибюле лифта, и вам говорят, какой лифт использовать. (См. изображение ниже.)

2. Когда приедет лифт, вы входите и ждете, пока вам покажут ваш этаж.

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

Модель инженера

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

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

Вывод

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

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

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

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

Рекомендации и где узнать больше

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

Главное изображение: © Уильям Хадсон, используется с разрешения и перерисовано Интерактивный дизайн Фонд, CC BY-SA 4.0