Chip

Chip (Чип / Тег / Пилюля) — компактный интерактивный элемент для фильтрации, выбора категорий и отображения атрибутов. Реализации: filter chip (выбор параметра), input chip (введённый тег), suggestion

Chip (Чип / Тег / Пилюля) — компактный интерактивный элемент для фильтрации, выбора категорий и отображения атрибутов. Реализации: filter chip (выбор параметра), input chip (введённый тег), suggestion chip (подсказка). Лучшие практики: горизонтальный скролл для длинного ряда чипов, активный чип — заливка или галочка, группы чипов не смешивать в одном ряду. Чипы vs dropdown: чипы эффективнее при 3–8 опциях и частом переключении. Антипаттерн: чипы с текстом длиннее 3 слов или с иконкой без текста для неочевидных действий.

Экран поиска автомобилей Volkswagen Golf с пробегом с возможностью фильтрации по цене, году, пробегу и другим параметрам. Пользователь видит список предложений…
Экран поиска автомобилей Volkswagen Golf с пробегом с возможностью фильтрации по цене, году, пробегу и другим параметрам. Пользователь видит список предложений…

Что покрывает эта подборка

Подборка screens с chips для filters, tags and compact selection patterns. В подборке 200 экранов из 114 сценариев и 3 приложений. Репрезентативный пример: Авто ру_39.Фильтры_001.webp в сценарии Фильтры приложения Авто.ру.

Контекст страницы

Семейство
Элементы интерфейса
Фокус
Chip
Экранов
200
Сценариев
114
Приложений
3

Семантический профиль

Семейство
Элементы интерфейса
Фокус
Chip
Экраны
200
Сценарии
114
Приложения
3

Путь пользователя

Намерение пользователя
Искать (search), 4
Этап воронки
Обнаружение (discovery), 5
Роль шага
Начальный шаг (entry), 11

Паттерны и действия

Основное CTA
Другое (other), 5
Паттерн раскладки
Список (list), 5
Навигационный паттерн
Нижние вкладки (tab_bar), 7
Платформа
iOS (ios), 1
Тема
Светлая тема (light), 10

Семантические сигналы

Типы экранов
Поиск (search), Главный экран (home), Список (list), Детальная страница (detail)
Состояния экранов
Обычное состояние (default)
Основные CTA
Искать (search), Другое (other), Добавить в корзину (add_to_cart)
Паттерны раскладки
Список (list), Стопка карточек (card_stack), Форма (form), Один главный фокус (single_focus), Карта (map)
Навигационные паттерны
Нижние вкладки (tab_bar), Переход вглубь (drill_down)
Намерения пользователя
Фильтровать (filter), Управлять аккаунтом (manage_account), Просматривать (browse), Искать (search), Другое (other)
Этапы воронки
Обнаружение (discovery), Удержание (retention), Вход в сценарий (entry), Оценка выбора (evaluation)
Темы
Светлая тема (light)
Платформы
iOS (ios)
Роли шага
Начальный шаг (entry), Ввод данных (input)

Элементы интерфейса

  • Поиск (search) (ai_screen_type)
  • Главный экран (home) (ai_screen_type)
  • Список (list) (ai_screen_type)
  • Детальная страница (detail) (ai_screen_type)
  • Обычное состояние (default) (ai_screen_state)
  • Искать (search) (ai_primary_cta_type)
  • Другое (other) (ai_primary_cta_type)
  • Добавить в корзину (add_to_cart) (ai_primary_cta_type)

Теги

  • авто
  • поиск
  • фильтры
  • volkswagen
  • golf
  • с пробегом
  • модели близнецы
  • каталог
  • баланс
  • расходы
  • подключённые услуги
  • тариф

Ключевые действия

  • Добавить в поиск (Кнопка (button))
  • пополнить (Кнопка (button))
  • семейная группа (Кнопка (button))
  • мой тариф (Кнопка (button))
  • сменить тариф (Кнопка (button))
  • Позвонить (Кнопка (button))
  • Написать (Кнопка (button))
  • Смотреть 8 438 объявлений (Кнопка (button))

Подходящие страницы