Как почувствовать себя пользователем: ИА и Lego

UX/UI-дизайн 9 июля 2022 г.

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

Я открыла большую коробку со всеми деталями Lego и… Застыла, не зная, с чего начать? Просто огромная мешанина форм, цветов и размеров. А мельчайшие детали так вообще самая большая боль — за ними дальше всего тянуться, и нужное сто процентов не найдется легко и быстро.

Информационная архитектура. И большая коробка несортированных деталей Lego. Наверно, так и выглядит плохо организованная структура сайта со стороны? Когда вы не знаете, с чего начать, и вам трудно угадать, где спрятано то, что вы ищете?

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

Организация и маркировка

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

Организационная проблема номер один — где мой пользователь ожидает найти те или иные детали Lego? 

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

Тогда я выбрала пять основных категорий: большие детали, средние детали, мелкие детали, мини-фигурки и аксессуары.

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

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

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

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

«Эй, зачем ты положила туда эти пирожные?!» — такой была реакция моего пользователя.

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

Навигация и поиск

После того, как я помогла своей дочери разобраться с ее Lego, я дала волю своему любопытству и погуглила сайты, продающие детали Lego. Просто посмотреть, как они справились с этим и как на самом деле назывались детальки (у меня было смутное подозрение, что не будет деталей под названием «пирожное»).

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

Панель навигации сайта была довольно минималистичной — «Магазин», «Поиск» и «Помощь». Я направилась прямо в магазин, а затем, через подменю с несколькими категориями, — в «Выбрать кирпич» (дословно), так как это звучало как что-то, где можно найти все детали.

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

На сайте предлагалась сортировка деталей по категориям, подкатегориям, точному цвету или семейству цветов.

Я подумала о предмете, который хотела бы найти, и попыталась скорректировать поиск: категория — «Пластины» (наверное?); подкатегория — «Пластины, Круглые и угловатые» (Plates, Round & Angles). Мне не нужно было настраивать цвет, так как я уже видела искомую деталь во второй строке результатов поиска. Довольно быстро!

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

У меня было 207 прямоугольников и пластин на выбор — некоторые из них были круглыми (удивительно!) и некоторые даже красными (ни за что!), и была куча других деталей, чьей прямой связи с моими ключевыми словами я так и не выявила.

Всего было 11 страниц результатов поиска, по 20 элементов на каждой. Без возможности увеличить количество элементов на странице, чтобы просмотреть меньше страниц (облом!). К счастью, та деталь, которую я искала, была прямо на странице 1. Это был 10-й (!) элемент на странице, и из 9 деталей, предшествующих ему, 5 были круглыми и 1 красной (хоть и не круглой). Довольно интересные результаты.

Время расплачиваться

Я нажала «Выбрать» ту деталь, которая мне нужна. Так что, она сейчас в моей корзине? Никаких указаний, но я догадалась, что это так, и перешла туда — «У вас в корзине ничего нет». Странно. Я вернулась на предыдущую страницу. Ага! Нашла — противоречивый блок с надписью «Добавлено в корзину», который отображает мою детальку, но в то же время побуждает меня нажать на кнопку «Поместить деталь в корзину». Разве я еще не поместила? 

Нажимаю «Поместить предметы в корзину», и меня автоматически перенаправляют в «Корзину для покупок». Хотела ли я туда перейти? Да. Но что, если бы нет? Что, если бы я хотел только убедиться, что товар помещен в корзину, и продолжить покупки?

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

Теперь давайте подумаем об этом опыте с точки зрения эвристик ИА.

Хороший сайт должен быть:

  • Легко находимым. Официальный сайт Lego был лучшим результатом моего поиска.
  • Доступным. Пробовала перемещаться по сайту с клавиатуры. Застряла, не в силах поставить галочку. Шрифт довольно мелкий, но читабельный (по крайней мере, для человека со слабым зрением).
  • Понятным. В принципе, это так. Однако мой путь к корзине для покупок был немного запутанным.
  • Информативным. Навигация и метки были информативными и полезными. Было легко понять, где я нахожусь и куда мне нужно идти дальше.
  • Полезным. Выполнение задачи, ради которой я пришла туда, было почти пустяком (за исключением того противоречивого дополнительного шага с корзиной для покупок, опять же).
  • Заслуживающим доверия. Я бы сказала, сайт заслуживает доверия, потому что это известная торговая марка, которая уже завоевала много клиентов. На этапе оформления заказа ничего подозрительного не было. Также было уведомление о возможных задержках доставки, что было приятно узнать заранее.
  • Управляемым. Информация и задачи, которые я хотела выполнить, были доступны. Все элементы управления были четко обозначены. Однако предложения по требованиям к паролю вы получите только после того, как создадите его неправильным. Сайт мог бы использовать лучшую защиту от ошибок.
  • Ценным. Сайт был прост в использовании, а дизайн ассоциировался с моим любимым продуктом. Я была счастлива, что так быстро нашла то, что искала. Ну и цены вполне приемлемые.
  • Поддающимся изучению. Тут легко учиться и легко запомнить все для следующего раза, когда вам понадобиться использовать этот сайт. ИА хорошо структурирована, логична и проста. Ничего слишком сложного.
  • Удовлетворяющим. Сайт приятно использовать благодаря прочной ассоциации с самим продуктом. Все изображения и дизайн напоминают об увлекательном опыте создания новых вещей.

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

Теги