Чек-лист по юзабилити интернет-магазинов
Апофеоз сотни холиваров и улучшения работы QA — чек-лист по юзабилити интернет-магазинов. В нем частично задействованы прошлые документы — чек-листы по формам и фильтрам. Пользуйтесь.
Страница каталога
Возможно добавление каждого товара в корзину.
Добавление в корзину
После добавления товара в корзину выводится визуальное подтверждение.
Пример: DAVICI.
Почему именно так:
Пользователь должен понимать, что товар уже в корзине, чтобы не отправлять его туда повторно.
Пользователь должен понимать, что товар уже в корзине, чтобы не отправлять его туда повторно.
При добавлении или удалении позиций происходит пересчет суммы и количества товаров в блоке корзины.
Изменение мини-корзины
Если у товаров есть заданные в админке параметры «Новинка», «Лидер продаж», «Распродажа» и так далее, они выводятся в карточке и на странице каталога.
Ярлыки
Страница товара
Корректно сгенерирован заголовок страницы.
Заголовок страницы
Почему именно так:
В идеале система сама должна генерировать нормальные заголовки — как минимум без специальных символов и тегов. Если предусмотрен ручной ввод, этот параметр остается на совести владельца ресурса.
В идеале система сама должна генерировать нормальные заголовки — как минимум без специальных символов и тегов. Если предусмотрен ручной ввод, этот параметр остается на совести владельца ресурса.
Заголовок страницы содержит название товара.
Корректно выводится информация о товаре.
Информация о товаре
Почему именно так:
Проверить стоит — возможно, неверно отображаются фотографии или в тексте описания появляются теги.
Проверить стоит — возможно, неверно отображаются фотографии или в тексте описания появляются теги.
Возможно добавление товара в корзину.
Добавление в корзину
После добавления товара в корзину выводится визуальное подтверждение.
Присутствует ссылка для возврата к списку товаров или хлебные крошки.
Возврат к списку товаров
При добавлении товаров в блоке корзины обновляется количество товаров.
Счетчик товаров
Если предусмотрен вывод блоков «С этим товаром также покупают», «Рекомендуем», «Товары, которые вы смотрели», в них выводятся корректные товары.
Вывод дополнительных блоков
При добавлении товаров в корзину учитывается выбранное количество, если есть возможность его указания.
Количество единиц товара
Если есть ярлыки «Новинка», «Лидер продаж», «Распродажа», они выводятся на странице товара.
Ярлыки
Корзина
Чек-лист по формам есть в предыдущей статье.
На странице корзины выполняются все чек-листы по формам
Выясните принципы работы скидок, проверьте алгоритмы расчета на сайте.
Корректно применяются все существующие скидки
Сумма заказа рассчитывается с учетом купонов и скидок, стоимости доставки, комиссий и так далее. Если есть ярлыки «Новинка», «Лидер продаж», «Распродажа», они выводятся на странице товара.
Корректный расчет общей суммы заказа
При вводе слишком большого количества символов ожидается корректное изменение данных либо на введенное, либо на максимальное число. При этом появляется предупреждение.
Ввод в поле «Количество»
При вводе небольшого числа в поле ожидается немедленное изменение количества на корректное.
При вводе нуля предполагается удаление товара из корзины. При этом желательно подтверждение действия пользователя.
При вводе букв или символов ожидается запрет ввода, восстановление предыдущего значения или сообщение об ошибке.
Пример: book24.
При вводе отрицательных чисел ожидается запрет ввода, сброс к предыдущему значению или сообщение об ошибке.
Опционально — задание кнопок переключения количества вместо полей со свободным вводом.
Пример: iboto.
При вводе чисел в поле «Количество» происходит немедленный корректный пересчет суммы заказа и стоимости товара с учетом внесенных данных.
Пересчет сумм при изменении количества
Пример: Сладуница.
Есть ссылка для возврата пользователя в каталог товаров.
Возврат в каталог
По клику на кнопку оформления заказа происходит переход на страницу заказа или следующий шаг оформления.
Переход к оформлению заказа
На странице корзины нет мини-корзины.
Мини-корзина
Пример: Fitness Formula.
Мини-корзина есть, но она ведет себя синхронно с основной.
На странице корзины есть работающие ссылки для удаления товаров.
Удаление товаров
При удалении всех товаров в корзине выводится сообщение «Пока корзина пуста» или аналогичное, а шапка таблицы списка и элементы вывода суммы скрываются.
По клику на ссылку для удаления товар удаляется без перезагрузки страницы и происходит пересчет суммы заказа.
Пример: Орматек.
Оформление заказа
Корректно выводится информация о заказываемых товарах и их количестве.
Информация о заказе
Корректно выводится общая сумма заказа.
Сумма заказа
Если предусмотрено сохранение адресов доставки для авторизованного пользователя, выводится поле для выбора сохраненного или создания нового адреса.
Выбор адреса доставки
При выборе сохраненного адреса поля адреса заполняются корректно.
Почему именно так:
Вводить адрес вручную при каждой покупке — не для слабонервных.
Вводить адрес вручную при каждой покупке — не для слабонервных.
При сохранении в системе заказ выводится у пользователя в личном кабинете на странице «История заказов» с корректным статусом и данными.
Вывод заказа в истории заказов
Почему именно так:
А где его еще искать?
А где его еще искать?
Администратор видит выбранный способ оплаты и доставки в электронном письме и админке.
Вывод информации для администратора
При успешном оформлении на указанный пользователем email направляется письмо с информацией о заказе.
Отправка email
При оплате заказа на e-mail администратора направляется письмо с информацией о новом оплаченном заказе.
Почему именно так:
Пользователю важно знать, что его заказ принят, и принят успешно. Письмо администратору отправляется для оперативной реакции на заявку.
Пользователю важно знать, что его заказ принят, и принят успешно. Письмо администратору отправляется для оперативной реакции на заявку.
Для авторизованных пользователей поля форм автоматически заполняются известными данными из профиля.
Автозаполнение форм
Почему именно так:
Для экономии времени пользователя. Заполнять вручную индекс, адрес доставки, телефон и прочие данные долго — посетители сайта затем и регистрируются, чтобы свести к минимуму ручное заполнение форм. Точнее, это одна из причин.
Для экономии времени пользователя. Заполнять вручную индекс, адрес доставки, телефон и прочие данные долго — посетители сайта затем и регистрируются, чтобы свести к минимуму ручное заполнение форм. Точнее, это одна из причин.
При оформлении заказа корректно выводятся варианты оплаты относительно способа доставки и наоборот. Применяется, если такие взаимосвязи есть.
Зависимость оплаты и доставки
Если для оформления заказа необходима регистрация, для неавторизованного пользователя выводится форма ленивой регистрации, ссылка на регистрацию, а также ссылка на авторизацию.
Неавторизованный пользователь
Пример: asos.
При выборе нового адреса поля адреса очищаются.
Новый адрес доставки
На боевом сервере включена реальная платежная система.
Оплата
При переходе к оплате передается выбранный способ оплаты.
Все данные корректно передаются в админ-панель (включая сумму, скидки, примечания, структуру заказа).
Передача данных в административную панель
Корректный пересчет суммы заказа с учетом способа доставки.
Пересчет суммы
Пример: DAVICI.
Корректный пересчет суммы заказа с учетом способа оплаты.
Важно:
Применяется, если есть наценки и скидки в зависимости от способа оплаты.
Применяется, если есть наценки и скидки в зависимости от способа оплаты.
При прерывании заказа на этапе оформления товары не удаляются из корзины.
Прерывание оформления заказа
Почему именно так:
Пользователь может отвлечься, временно передумать, захотеть купить что-то еще, поэтому нужно дать ему возможность закончить свои дела и снова вернуться к оформлению заказа.
Пользователь может отвлечься, временно передумать, захотеть купить что-то еще, поэтому нужно дать ему возможность закончить свои дела и снова вернуться к оформлению заказа.
Все данные корректно передаются в админ-панель (включая сумму, скидки, примечания, структуру заказа).
Передача данных в административную панель
Письмо пользователю с информацией о заказе содержит корректную ссылку на страницу истории заказов.
Содержание письма о заказе для пользователя
После успешной оплаты заказа онлайн пользователь переводится на страницу с сообщением о том, что и за сколько оплачено, и с дальнейшими действиями.
Сообщение после оплаты или неоплаты
В случае ошибки оплаты указывается, как предпринять повторную попытку.
При сохранении заказа в систему корректно передаются все данные о товарах, их количестве, адресе доставки, получателе, способах оплаты и доставки.
Сохранение данных заказа
Присутствует ссылка для возврата к редактированию заказа.
Ссылка для возврата к корзине
Почему именно так:
В самый последний момент пользователь вспоминает, что ему нужна не одна такая футболка, а целых три. Если есть ссылка возврата к редактированию заказа, задача упрощается — перешел, поменял количество, продолжил оформление.
В самый последний момент пользователь вспоминает, что ему нужна не одна такая футболка, а целых три. Если есть ссылка возврата к редактированию заказа, задача упрощается — перешел, поменял количество, продолжил оформление.
При успешном прохождении процедуры заказа пользователь переводится на страницу с краткой информацией о заказе и описанием дальнейших действий магазина.
Страница «Спасибо»
При успешном оформлении заказа товары удаляются из корзины.
Удаление товаров из корзины после оформления заказа
При сохранении заказа в системе заказу присваивается корректный статус («Ожидает оплаты» для неоплаченных заказов, «Оплачен» для оплаченных).
Установка статуса при сохранении
Прочее
Если есть функционал формирования квитанций для оплаты, то есть ссылка на их генерацию и печать.
Квитанции для оплаты
Квитанции для оплаты генерируются правильно.
Администратор сайта может изменить статус заказа, оплаты, доставки.
Изменение статусов
Адрес администратора для отправки письма о новом заказе возможно поменять через настройки.