Как я ждал столик в местном ресторане другой день, я пролистал пару бесплатных объявлений документов.Я был потрясен, чтобы понять, насколько зависимы Я вырос на трех простых функций, которые просто не доступны в аналоговом мире. поиска, сортировки и filter
AutoDirect и некоторых других бесплатных организованы по категориям (например, грузовых автомобилей, микроавтобусов, внедорожников), но другие, как Greensheet, просто список, страница за страницей товаров для продажи.Я бы на самом деле нужно читать каждый объявление в газету, чтобы найти то, что я хотел.Нет, спасибо, я буду использовать Craigslist на мой телефон instead.
Но после взглянуть на Craigslist мобильной, стало очевидно, мы все могли бы извлечь выгоду из некоторых лучших практик вокруг мобильного поиска, сортировки и фильтрации дизайн пользовательского интерфейса.В данной статье рассматриваются десятки различных способов поверхность и уточнить данные ваших клиентов want.
Поиск Patterns
Прежде чем вы пытаетесь создать поисковый интерфейс для любой платформы, покупать и читать эти две книги: шаблоны поиска: Дизайн для Discovery Петр Morville и Джеффри Callender, и Проектирование поиска: UX стратегии электронной коммерции SuccessГрег Нудельман.
Тогда взгляните на эти шаблоны поиска, специфичные для мобильных приложений:
- Явные Search
- Auto-Complete
- Dynamic Search
- Scoped Search
- Сохранено & Последняя
- Поиск Form
- Поиск Results
Явные Search
Явный поиск опирается на явные действия для выполнения поиска и просмотра результатов.Это действие может быть, чтобы нажать на кнопку поиска на экране, как Walmart, или на клавиатуре, как Target.Результаты, как правило, отображается в области ниже строки поиска.Рассмотрим сопряжение явный шаблон поиска с автозаполнением шаблону.
Walmart используются кнопки поиска (Go) на экране, Target использует поиск по keyboard.
Target загрузки и отображения поиска results.
Предложение четко кнопку в поле и возможность отменить поиск.Используйте обратную связь, чтобы показать, поиск выполняется.
Auto-Complete
Наверное, самый полезный шаблон поиска, чтопоявились в Web 2.0 является автоматическое заполнение.Typing сразу поверхности множества возможных результатов, просто нажмите на одну выбранным она и поиск будет выполнен.Или продолжайте вводить собственные критерии, а затем нажмите кнопку явного поиска.
Android Marketplace (Google Play) и Netflix как использование авто-complete
В идеале результаты будут отображаться сразу, а индикатор (searching…) должны быть использованы для системы обратной связи.Netflix (см. выше) используют показатель в поле поиска, в то время как Fidelity (см. ниже) отображает тот, где результат в конечном итоге будет displayed.
Fidelity показывает обратную связь при загрузке автоматическое заполнение options.
TripAdvisor предоставляет расширенные автоматическое заполнение, группировку результатов популярные направления, отелей, ресторанов.LinkedIn делает нечто подобное, показывая прямого соединения, а затем другие люди в LinkedIn.
TripAdvisor и LinkedIn группа предложила options.
Обеспечить обратную связь, если не может быть задержки в отображении результатов.Рассмотрим подчеркнув, соответствующий текст для поиска в результатах поиска.
Dynamic Search
Эта модель также может называться динамической фильтрации.Ввод текста в поле поиска будет динамически (OnKeyPress) фильтровать данные на экране.Отметим, что примеры могут выглядеть автозаполнения, но есть другая модель interation.Динамический шаблон поиска используется для уточнения или свести на нет существующие и видимый список объектов.В этих примерах из BlackBerry App World и WorldMate на Android, приложения и отели, соответственно, уже отображается на странице.
BlackBerry App World и WorldMate предложение динамический поиск для уточнения большой список results.
Работает хорошо для уточнения ограниченного набора данных, таких как адресная книга или личной медиа-библиотеки, но может быть непрактичным для поиска больших наборов данных из нескольких источников.
Scoped Search
Иногда проще (и быстрее), чтобы добраться до желаемого результата обзорного критерии поиска перед выполнением поиска.Google и Photobucket используют различные конструкции для той же цели.
Google использует наложение представить возможных вариантов, в то время Photobucket использует dialog.
Allrecipes также позволяет выбрать критерии (или фильтры) перед отправкой поиска.Dropbox по умолчанию начальные возможности для всех, но вы можете переключить его на файлы и папки до или после нажатия кнопки поиска.
AllRecipes толкает предел параметры областей, Dropbox держит его простым только с 3.
Предложение разумное параметры областей, основанных на наборе данных.От трех до шести обзорного вариантов множество, рассмотрим форму поиска для продвинутых возможностей поиска.
Сохранено & Recent
Успешные мобильных интерфейсов следовать основным Максим юзабилити: уважать пользователей усилия.Сохраняется и последних поисков сделать это делает его легко выбрать из предыдущих поисков, а не перепечатки те же ключевые слова или условия поиска.
eBay позволяет клиентам явно сохранять результаты поиска.Оба eBay и Walmart неявно сохранения customers’ Недавно искали.
Другие варианты уважать усилия пользователей включать в зависимости от местоположения поиск вариантов, как Trulia, и поиски штрих-код, как PriceCheck по Amazon.
Trulia предлагает в зависимости от местоположения поиска, Amazon предлагает 4 способа поиска.
Google Shopper предложения сканировать и говорить параметры поиска и вся история поиска, сгруппированные по дате поиска.
Сохраненные поиски как правило, требуют дополнительных шагов, чтобы назвать поиска для дальнейшего использования, в то время как последние запросы неявно сохранены и всплыл.Рассмотрим, какой из них лучше служить потребностям клиентов.
Поиск Form
Эта модель характеризуется отдельные формы для ввода критериев поиска, и явный поиск button.
поиск форм на WorldMate и airbnb.
WholeFood’ s рецепт поиска позволяет пользователям добавлять несколько критериев, конечно, категории, специальные диеты и ключевые слова.
Сведите к минимуму количество полей ввода.Реализация OS конкретные элементы управления вводом правильно.Следите формы дизайна передового опыта (выравнивание, этикетки, размер)
Поиск Results
После того, как поиск осуществляется результаты могут быть представлены в том же экране или на экране посвятить результаты.Результаты могут быть отображены в виде таблицы или списка, на карте или спутниковом или в виде эскизов.Несколько вариантов представления могут быть использованы в зависимости от типа результата и предпочтений пользователя.
Kayak и Foursquare (WebOS) показать результаты в таблицу.
airbnb показывает результаты в виде списка и предлагает вид карты переключения.
Zappos открывается вид списка и альтернативный взгляд на каруселипросмотр результатов поиска.
Ленивая загрузка распространенный метод использовать, так что некоторые результаты будут отображаться в то время как остальные загружаются.Многие программы предлагают либо кнопкой явно “больше результатов” или автоматически загрузит другой результат, когда экран щелкнул.
Label результат с числом вернулся.Использование отложенной загрузки вместо подкачки.Применить разумный порядок сортировки по умолчанию.Избе …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров