Connect with us

Дизайн и прототипирование

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

Опубликовано

/

     
     

UX — это процесс открытия. Мы часто утверждаем, что пользовательский опыт не начинается и не заканчивается в проекте. Пока ваш продукт жив, процесс UX никогда не заканчивается. Когда дело доходит до цифровых продуктов, всегда есть возможности для улучшения и роста, которые стоит изучить. Поэтому процесс проектирования является неотъемлемой частью пути роста.

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

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

1. Самый эффективный призыв к действию

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Ваша кнопка призыва к действию всегда будет работать лучше, если вы добавите к действию некоторый контекст. Но постарайтесь, чтобы он содержал не более трех слов. Вместо «Добавить» можно использовать «В корзину», а вместо «Купить» — «Купить сейчас».

2. Текст на мобильном

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Было проведено множество тестов, доказывающих, что лучшая удобочитаемость на мобильных устройствах — не более 9 слов в строке или 50–60 символов.

3. CTA на мобильном телефоне

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Он должен быть больше, чем то, что использует большинство дизайнеров. Исследование Human Fingertips в MIT Touch Lab показало, что средняя ширина указательного пальца у большинства взрослых составляет 16–20 мм, что делает идеальным размером кнопки 40–50 пикселей в высоту.

4. Списки товаров

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

5. Страницы или бесконечная прокрутка

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

6. Выбор по умолчанию — быть или не быть

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

7. Как использовать иконки

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Чрезмерное использование иконок — это ошибка пользовательского интерфейса, часто ставящая под угрозу UX. Использование иконок всегда должно иметь правильное значение, усиливая то, что нельзя сказать словами, и никогда не скрывать функциональность за расплывчатым изображением. Золотое правило UX: используйте значки, когда текста недостаточно для объяснения действия.

8. Сообщения об ошибках

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

9. Чек-листы или радио-кнопки?

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

10. Используйте placeholder, чтобы показать пример.

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Использование заполнителя улучшает контекст и увеличивает конверсию формы. Но вам следует пойти еще дальше — вместо имени необходимого поля используйте пример. Например, введите образец номера телефона (+44 757 869…) вместо «номер телефона» или «hi@pony.studio» вместо «электронная почта». Это проверенный принцип UX.

11. Более широкая область тапа на смартфоне

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

12. Используйте цвета для классификации

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

13. Кнопки полей формы

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

14. Идеальная высота линии

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

Мы все хотим, чтобы между размером шрифта и межстрочным интервалом было идеальное соотношение, но не всегда делаем правильно. Универсальное правило UX — для лучшей читаемости поддерживайте высоту строки минимум на 20–30% больше, чем высота символа, поэтому в большинстве случаев подойдет все, что находится в этом диапазоне.

15. Всегда работающий размер шрифта

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

16. Наложение изображений для безупречного вида

16 советов по UX и UI дизайну, которые всегда обеспечивают рост

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

Источник

Если вы нашли опечатку - выделите ее и нажмите Ctrl + Enter! Для связи с нами вы можете использовать info@apptractor.ru.
Advertisement

Популярное

Спасибо!

Теперь редакторы в курсе.