Всем привет!
Решил поделиться своими наработками по элементам на сайте, которые улучшают пользовательский опыт и облегчают взаимодействие.
Хочу сразу обратить внимание, что мой опыт не является последний инстанцией, скорее его можно рассматривать, как дополнительный материал и использовать в работе, как чек-лист.
1. Поиск по сайту.
Поиск, это та эта функция, которая должна облегчить пользователю найти нужную информацию, товар или услугу на сайте, но некоторые “прикручивают” поиск и на этом все.
Пример хорошей реализации поиска:
Пример плохой реализации поиска:
2. Элементы навигации.
Например те, которые позволяют вернуться на шаг назад или продолжить серфинг. Особенно это важно на мобильном устройстве.
Пример хорошей навигации:
Пример плохой навигации:
3. Всплывающие подсказки.
Когда пользователь что-то не сделал, на что-то должен обратить внимание, что-то ввел некорректно и т.д.
Пример хорошей подсказки:
Пример плохой подсказки:
4. Отображение контента.
Возможность выбора отображения контента на сайте, будь то карточка товара или блог со статьями.
5. Большие задачи делить на маленькие.
Все большие формы, или формы, которые имеют деление на несколько логических блоков, разделять на шаги.
6. Информирование и количестве.
Информировать о количестве материала на сайте или наличии товара.
7. Информирование о персональных скидках.
Пример хорошей реализации:
8. Информировать об ограничениях.
Например, нельзя примерить без покупки. Пример хорошей реализации:
9. Информировать сколько осталось до какой-либо выгоды для клиента.
Пример хорошей реализации:
10. Автоматическое определение местоположения пользователя.
Для отображения удаленности магазина, мероприятия и т.д.
Пример хорошей реализации:
11. Информативные сообщения об ошибках.
Пример хорошей реализации:
Пример плохой реализации:
12. Использовать правильные формы ввода.
Если текст, то текстовая клавиатура, телефон, то набор цифр, если почта, то наличие @.
13. Раскрывающиеся элементы.
Не стоит показывать все сразу, пусть пользователь сначала изучит что-то одно.
Пример хорошей реализации:
Пример плохой реализации:
Можно еще углубиться в дизайн, и поговорить о контрасте, цвете, акцентах, шрифтах и т.д. Но кажется, что это тема отдельной статьи, да и большим опытом не обладаю, чтобы эту часть осветить.
На VC, была хорошая статья про психологию и UX, можно почитать её тут.
Буду рад любым комментариям, особенно тем, где вы поделитесь своими наработками.
Готовлю следующую статью, если вам интересны темы ниже, то прошу отметить то, что больше откликается.
Почитать о том: Как построен процесс по генерации, приоритизации и проверки гипотез. Как проводятся тесты и эксперименты. Как организована работа с командой и подрядчиками. Как формируется бэклог по задачам для развития и улучшения продукта. Как работать с клиентами в интернет-магазине.
Источник: vc.ru
