Ланч-тайм 292: краткий
перевод свежих статей о digital

Здесь собраны несколько советов по созданию строки поиска.

1. Сделайте ее очевидной

Строка поиска всегда должна быть размещена там, где ее будет легче найти пользователю: например, в верхней части приложения или веб-сайта. Не заставляйте пользователя искать окно поиска.

Отличный пример — строка поиска Amazon.

Если сделаете строку поиска слишком маленькой, пользователь может запутаться. Увеличьте строку поиска и задайте ей цвет, отличный от фона.

2. Сделайте ее простой

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

Строка поиска Google — один из лучших примеров простого дизайна поиска.

3. Покажите сообщение, когда ничего не найдено

Не оставляйте страницу пустой — это может быть сообщение об ошибке 404, предложение сбросить фильтр, выполнить поиск снова и т. д.

Этот небольшой шаг поможет пользователю попытаться найти то, что нужно еще раз 1 а это улучшит пользовательский опыт.

4. Поработайте над автозаполнением предложений

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

Однако если предложения автозаполнения будут работать плохо, это запутает пользователя. Тестируйте.

Вот как Amazon предлагает функцию автозаполнения.

5. Обеспечьте опцию быстрой сортировки

Если ваш веб-сайт или приложение содержит различные типы продуктов и вещей, будет лучше показать опцию быстрой сортировки, которая показывает различные варианты в раскрывающемся меню.

Amazon использует вариант сортировки с раскрывающимся списком, который помогает пользователю выполнять поиск очень специфическим образом.

6. Показывайте пользователю запрос вверху

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

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

7. Показывайте историю поиска

Не забудьте показать историю поиска, которая помогает пользователю узнать, что он искал ранее. Еще это экономит время пользователя — им не приходится повторно вводить один и тот же запрос.

Пример с историей поиска мы все видели на YouTube. И добавьте кнопку «Очистить историю» — это тоже хорошая штука.

8. Оптимизируйте результат поиска

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

И снова хороший пример от Amazon. Алгоритм поиска так умеет :)

В дизайн-системы влюблены многие. Этот тренд перешел от просто популярной идеи к полноценному движению. Но никто не говорит о минусах. Кажется, что и критика была нервно приглушенной и осторожной. Давайте посмотрим.

Корень проблемы с дизайн-системами можно найти в их определении.

«Дизайн-система — это единый источник истины, который объединяет все элементы, которые позволят командам спроектировать, реализовать и разработать продукт». Собственно, это все, что вам нужно знать о дизайн-системах :)

Это попытка взять существующие инструменты и практики, такие как руководства по стилю и шаблоны, и добавить другие менее осязаемые концепты, такие как ценности и способы работы, которые, вместе взятые, представляют систему дизайна как законченный процесс от начала до конца. Это ошибка. Само словосочетание «дизайн-система» должно вызывать тревогу.

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

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

Это обесценивает дизайн и навыки дизайнеров.

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

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

Это правда, что дизайн-системы позволяют вам работать быстрее в одном контексте — когда вы движетесь в неправильном направлении. Как только вы, наконец, подготовите свою дизайн-систему, вы можете решить любую спорную ситуацию до конца дня. Но, сокращая процесс дизайна и уделяя слишком много внимания скорости, дизайн-системы стирают тот момент, который необходим для того, чтобы подвергнуть сомнению предположения, лежащие в основе задачи, осмыслить новые возможности или даже спросить, нужна ли эта новая функция или экран вообще.

Дизайн-система отвлекает от основного ориентира любого дизайнера: от контекста.

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

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

Широко распространенное мнение о том, что дизайн-система должна постоянно развиваться, само по себе является признанием того, что она никогда не будет достаточно адекватной для решения реальных проблем, с которыми она сталкивается. Это часто преподносится как предостережение, но это показывает ошибочное и неуместное мышление. Если что-то всегда нуждается в обновлении, когда оно применяется на практике, как на это можно положиться?

Дизайн-системы предпочитают последовательность и удобство, нежели творчество и мастерство. Если случается последовательность в погоне за единообразием, вы создаете слишком много ненужных правил, которые ограничивают творческое мышление еще до того, как оно начнется. Если случается удобство в погоне за скоростью, вы убиваете целый рабочий процесс, необходимый для развития дизайнерского мастерства.

Дизайн-системы действуют из лучших побуждений, и никто не может винить их амбиции. Но, расчленяя процесс создания дизайна с помощью предписывающих пошаговых правил, он ограничивает свободу дизайнера для творческой работы.

Одна из основных причин внедрения дизайн-системы — желание достигнуть согласованности. Построение дизайн-системы приводит к тому, что дизайнеры могут теряться в деталях компонентов, упуская из виду более крупные проблемы дизайна продукта. Пользователям все равно, одинаковы ли все границы радиуса у ваших кнопок. Но они быстро откажутся от вашего продукта, если вам не удастся решить основные проблемы взаимодействия.

Новый год близко! Всем праздничного настроения :)