Перейти к руководству
Search UXавтор Owl-Listener

Search UX Skill.

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

  • Проектирование взаимодействия
  • Поиск
Обзор источника · Search UXSKILL.md
Задача Проектирование взаимодействия Результат работы • Спецификация поля поиска и подсказок. • Содержимое карточек или строк результатов и поведение фильтров. • Восстановление при отсутствии результатов и требования к измерению поведения при поиске. Перед началом Поисковые сервисы и инструментирование запросов не входят в это руководство.
Редакционное резюме · источник проверен 2026-10-07 · не сгенерированный пример

01 Возможности

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

Полное руководство по интерфейсу поиска: ввод, подсказки, представление ранжирования, уточнение и восстановление при отсутствии результатов.

Рабочий процесс на основе источникаНе тест выполнения

Рабочий подход

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

Главный акцент сделан на восстановлении. Экран без результатов должен сохранять запрос, объяснять, что искали, и предлагать подходящие исправления или другие пути. Это требования к интерфейсу: допуск опечаток, ранжирование по релевантности и персонализация по-прежнему зависят от реальной поисковой системы.

Ожидаемые результаты

  • Спецификация поля поиска и подсказок.
  • Содержимое карточек или строк результатов и поведение фильтров.
  • Восстановление при отсутствии результатов и требования к измерению поведения при поиске.
Смотреть пример задания

От задания до проверки

  1. 01
    Определите, что можно искать

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

  2. 02
    Опишите поиск и уточнение

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

  3. 03
    Обработайте неудачные запросы

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

02 Когда использовать

Когда использовать

Поисковые сервисы и инструментирование запросов не входят в это руководство.

Хорошо подходит

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

Ограничения, которые стоит проверить

  • Это не поисковый движокИсточник не предоставляет бэкенд индексации и не реализует алгоритмы ранжирования.
  • Это не архитектура навигацииХороший интерфейс поиска не отменяет необходимости в понятных категориях и навигации.

Что подготовить

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

03 Важные решения

Важные решения

  1. Объясняйте, почему результат подходит

    Полезный сниппет или подсказка о совпавшем поле уменьшает догадки перед открытием результата.

  2. Фильтры можно отменить

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

04 Пример задания

Попробуйте целевое задание

Приведённое ниже задание не тестировалось. Перед использованием проверьте настройку навыка.

Проверьте настройку

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

Исходный файл в репозитории
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/search-ux/SKILL.md

Поисковые сервисы и инструментирование запросов не входят в это руководство.

Начните с одного результата

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

Пример задания
Используйте search-ux для библиотеки с шаблонами дизайна, авторами и руководствами. Спроектируйте подсказки, сгруппированные результаты и удаляемые фильтры. Включите запрос с опечаткой, не давший результатов, и навигационный запрос о настройках аккаунта. Отметьте любое поведение, которое требует доработки поискового бэкенда.

Проверьте результат

Сравните фактический результат с этими наблюдаемыми критериями.

  • Введённый запрос сохраняется при уточнении и при пустых результатах.
  • Применённые фильтры видны и их можно удалить.
  • Метаданные результатов помогают отличать похожие названия.

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

05 Источник и лицензия

Источник и лицензия

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

Владелец источника
Owl-Listener
Репозиторий
Owl-Listener/designer-skills
Лицензия
MIT
Проверенная версия
2026-10-07 · 9a6930cf84a8
Редакционное резюме источника
Полное руководство по интерфейсу поиска: ввод, подсказки, представление ранжирования, уточнение и восстановление при отсутствии результатов.

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

06 Вопросы перед началом

Вопросы перед началом

Можно ли добавить допуск опечаток?

Навык может описать желаемое поведение. Поисковый бэкенд должен поддерживать или реализовать его.

Всегда ли результаты должны быть сеткой?

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

Зачем включать навигационные разделы?

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

OpenDesign

Освободите место для следующей итерации дизайна.

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

Исходный файл в репозитории
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/search-ux/SKILL.md