Требования к реализации Поиска

Обновлено 26.11.2018

Все требования заточены под интернет-магазины индустрий Fashion и Activewear. Но будут полезны и для других сфер.

Общие требования к Поиску:

  • Высокая скорость работы. Задержка показа подсказок и/или товаров в Search Box не должна составлять более 0,02 сек..
  • Корректность данных:
    • Отображение актуального количества единиц продукции возле каждой подсказки.
    • Соответствие "количество в подсказке" с "количество найденных товаров".
  • Полнотекстовый поиск. Учитывает морфологию, синонимы и осуществляется не только по названиям товаров, но и по их характеристикам.
  • Масштабируемость. Возможность внесения изменений в работу Поиска, а также добавление собственных словарей.
  • Нечеткий поиск. Работа с грамматическими ошибками, опечатками и неправильной раскладкой.
  • Работа с синонимами. Добавление собственных словарей.
  • Аналитика. Качественные и количественные данные поисковых запросов.

Требования по взаимодействию и визуальному оформлению (UX/UI)

01. Пользователь не должен тратить время и усилия, чтобы воспользоваться Поиском.

  • Иконка лупы обязательна во всех случаях и экранах, так как именно по ней пользователь попытается идентифицировать Поиск. По этой причине не следует вместо иконки использовать слово "Поиск".
  • Если элементов в хедере много, то следует добавлять окошко (search box) к иконке лупы.
  • Если элементов мало (частый случай для Fashion-индустрии), то допустимо использовать только иконку. Однако Пользователь должен легко ее находить.
  • В десктоп-версии Поиск расположен в правой верхней части страницы:

  • Поиск в header desctop
  • В мобильной версии можно повторить окошко (как на примере Бартона) или оставить лишь иконку лупы (см. ниже). Во втором случае иконка должна быть хорошо различима и не должна сливаться с другими элементами. Ни в коем случае нельзя прятать Поиск в меню.

    Поиск в header mobile
    Поиск в header mobile

02. В интернет-магазинах с большим разнообразием товаров и сложным меню будет нелишним сильнее акцентировать внимание на Поиске (если он полностью реализован согласно требованиям):

Поиск в header
  • Если путь пользователя в большинстве начинается с Главной страницы, то отдельно для нее можно задать иное представление, выделив важность и функциональность работы Поиска:

  • Поиск на главной

03. При вводе первого символа появляется иконка "крестик" (опция стереть введенные данные) и становится активна иконка "лупа" (активирует действие "искать").

04. При вводе второго символа срабатывает Autosuggest* (выпадающий список с подсказками).

Поиск в header

*Autosuggest представляет из себя выпадающий список вариантов выбора. Выбрать вариант можно с помощью клавиши "Стрелка вниз" или щелкнув мышью. Предложения показываются после введения второго или третьего символа.

Примечание
Данная реализация справедлива для интернет магазина (ИМ) одежды, обуви, аксессуаров. Если это ИМ техники, например, то нужно выводить модели с наименованиями и ценами.
Исключение
Если ассортимент ИМ очень небольшой, то показываем одиночные товары с миниатюрами, названием и ценой.
Поиск, если ассортимент ИМ очень небольшой
  • Не выводим более 10 подсказок.
  • Никакого скролла в "выпадашке".

05. Следует сохранять и показывать историю пользовательских запросов с возможностью ее очистить.

  • Не стоит запоминать и выводить более 5-10 запросов.
Поиск - история пользовательских запросов

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

Поиск - категории или группы товаров

Search Box States

  1. Default.
  2. Selected and Empty (c/без истории запросов).
  3. Filed (с autosuggest по группам товаров, а также поиском в рамках категорий)
Search Box States

Требования по функциональной части

  • 01. Поиск необходимо осуществлять по N-граммам, а не по корню слова. Причем на N-граммы разбивается только начало слов (см. пример).

    Поиск по N-граммам
  • 02. Сортировать подсказки по релевантности, а не по количеству подобранных товаров.

  • 03. Если Пользователь ввел слово полностью, а N-грамма этого слова совпадает с другими словами, то не стоит выводить другие слова в подсказках. Как минимум, должен быть расставлен приоритет с сортировкой.

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

    • В случаях, если пользователь случайно ввел лишнюю букву/символ в конце (или любой части) запроса или же допустил ошибку в написании какого-либо слова, мы НЕ исправляем его подсказками, но выводим результаты по запросу без ошибок и опечаток.
    • Если Пользователь забыл переключить раскладку и вместо "лонгслив" ввел "kjyuckbd", то подсказки должны формироваться как при вводе слова "лонгслив".
  • 05. Синонимы, сленговые выражения и аббревиатуры. Совершенно недопустимо, чтобы у синонимов была своя выдача товаров. Доступна возможность формировать собственный словарь синонимом. В котором одно слово является основным (согласно номенклатуре), а все остальные закрепляются за ним как синонимы. Например, в базе есть "Футболка длинный рукав", а Пользователи часто ищут по ключу "Лонгслив". Добавляем "лонгслив" в качестве синонима к фразе "футболка длинный рукав" и в подсказках при вводе "лонгслив" будет выводиться "Футболка длинный рукав".