Доброго дня!
Публикую шестую часть (пункты 61-70) переведённой мной статьи от 1990 agency по принципам разработки UX, как обещал.
Ссылка на 1-ю часть (пункты 1-10) - клик.
Ссылка на 2-ю часть (пункты 11-20) - клик.
Ссылка на 3-ю часть (пункты 21-30) - клик.
Ссылка на 4-ю часть (пункты 31-40) - клик.
Ссылка на 5-ю часть (пункты 41-50) - клик.
Ссылка на 6-ю часть (пункты 51-60) - клик.
Дисклеймер: поставил себе цель переводить по 10 пунктов из адекватных (:D) источников (пока взял 1990 agency) каждый день и публиковать их здесь. Пока перевел 10 пунктов. На литературный перевод не претендую: иногда старался подгонять под русский язык, иногда делал упор на важность донесения контекста.
Ссылка на оригинальный источник будет в конце статьи (все изображения так же взял из оригинального источника).
61. Старайтесь добрать обратную связь вместо молчания.
Когда мы выполняем действие или решаем задачу, мы хотим понимать, когда задача (или действие) выполнена успешна. Итоговая обратная связь даёт возможность логически завершить действие. Такая обратная связь может быть как едва заметной, как высохшие чернила на бумаге или, так и «в лицо» (например сообщение о том, что ваше письмо было доставлено).
Молчание же, напротив, вызывает неуверенность. Я действительно выполнил то действие, которое хотел? Я слышал здесь «клик»? Я точно нажал на эту кнопку? Может мне стоит попробовать ещё раз? Обратная связь позволяет отвечать на все подобные вопросы. Всё это крайне важно для того, чтобы выстроить эффективное взаимодействие с пользователем.
62. Попробуйте предугадывать намерение вместо того, чтобы быть недальновидным.
Такое чувство, как «да, это именно то, что я хотел найти» можно дать пользователю благодаря заранее продуманному интерфейсу, который будет предугадывать намерение пользователя. UI, который успешно с этим справляется, взаимен даст довольного пользователя и $$$ (или, как минимум, уберёт «кислую мину» с его лица).
В качестве примера может взять Amazon.com: они достигли подобного эффекта на уровне микровзаимодействий благодаря их мега-большому раскрывающемуся меню. Меню, по сути, это меню корректно определяет, какое «подменю» отобразить благодаря использованию интересных геометрических фронт-энд решений. Это позволяет сэкономить время пользователя: ему теперь не нужно передвигать курсор мыши по диагонали для того, чтобы добраться до нужного ему подменю и обнаружить, что категория подменю внезапно изменилась или это меню вообще пропало.
Определение намерения пользователя до сих пор открыто для более продвинутых способов решения подобной задачи, что, однако, может потребовать более развитых и продвинутых технологий ИИ.
63. Попробуйте использовать дополнительные отступы между элементами вместо того, чтобы засорять пространство.
Белые пробелы (речь идёт о пространстве) определённо могут сделать контент и/или информацию более читаемыми. Когда элементы в достаточной мере отделены друг от друга, их проще воспринимать как что-то отдельное. Этот способ хорошо подойдёт для списков, таблиц, параграфов или любых других групп элементов на экране.
Один из стандартных путей использования белых пробелов – добавить отступы элементов со всех сторон. Без адекватных отступов элементы начинают сливаться воедино и их очень сложно визуально отделить друг от друга. Так что, когда читабельность важна, отступы могут помочь.
64. Попробуйте рассказывать истории вместо перечисления фактов.
Рассказ историй – один из старейших форм коммуникации, который можно использовать на лэндинговых страницах, обращениях и при различных взаимодействиях пользователя с UI. Вместо того, чтобы перечислять в списке информацию, почему бы не попробовать использовать нарратив (речь идёт о повествовании). Классическая простая история будет иметь сеттинг (т.е. определённое заданное положение вещей и атмосферу), действующих лиц с определёнными намерениями и проблемной ситуацией.
Истории вызывают более эмоциональный ответ, т.к. позволяют поверить в то, что описанный в истории опыт действительно имел место быть в реальности. Истории поэтому и лучше запоминаются. К примеру, длинные «продающие» письма активно использовали этот приём, что может быть одной из причин, почему такие письма эффективны и по сей день.
65. Будьте аутентичны вместо того, чтобы делать вид.
Большинство людей чуют ложь за километр. Аутентичность может быть тем самым ключом к тому, чтобы ваш продукт вызывал больше доверия. Картинки с улыбающимися людьми, взятые с фотостоков без веской на то причины, могут стать первыми «подозреваемыми», что может подорвать к вам доверие.
Ещё одна из областей, вызывающих скептическое отношение – отзывы о продукте. Лучше иметь смешанные обзоры и оценки (хорошие и плохие) вместо того, чтобы отображать только положительные.
Наконец, демонстрация членов вашей команды «без прекрас» так же может быть воспринято, как нечто более правдоподобное.
66. Попробуйте «постепенное снижение/уменьшение» UI вместо того, чтобы быть статичным.
«Постепенное уменьшение» активно обсуждалось компанией LayerVault. Это достаточно простая идея: пользователи учатся пользоваться вашим интерфейсом или приложением. Со временем, функции, которые были для пользователя более важными для понимания при обучении пользованию продуктом, стали менее значимыми и простыми в использовании. К примеру, некоторые «призывы к действию», которые были на виду у пользователя, можно отодвинуть в сторону: это позволит их заменить на новый и более актуальный контент. Ещё пример: со временем, можно спрятать подписи к иконкам, т.к. люди уже более-менее привыкли к вашему интерфейсу.
67. Попробуйте вначале думать о других вместо того, чтобы быть сосредоточенным на себе.
Идея ставить потребности людей выше своих (позволяющая, в итоге, расширять своё социальное влияние) совсем не нова. Переосмысление модели диалога с «Я» на «Вы/Ты», умение слушать и слышать и искренняя заинтересованность в других людях – центральный мотив в книге Дэйла Карнеги, написанной почти век назад, «Как завоёвывать друзей и оказывать влияние на людей».
Наша способность встать на место нашей аудитории и «быть ей»; на место нашего клиента или пользователя напрямую влияет на то, каким языком мы выражаем свою позицию и на то, как мы взаимодействуем с аудиторией. Более того, человек, который ещё и способен действовать не в своих интересах (т.е. производит впечатление человека, которому правда важнее выгоды) вполне может получить серьёзное доверие.
Иногда способность смотреть глазами другого человека и говорить его языком может привести (даже если не сразу) к конструктивным действиям и, в итоге, принести пользу всем сторонам.
68. Попробуйте пояснять вместо построения предположений о том, что все всё итак прекрасно понимают.
Некоторые моменты, которые могут быть для нас очевидны, могут быть менее очевидны для других людей. Вот здесь нам и приходят на помощь пояснения, описания и подсказки. Эти самый подсказки в контексте ситуации могут убрать немало факторов, вызывающих непонимание: причину, вызывающую само непонимание; незнание, как заполнить поле; непонимание, какое поле обязательно к заполнению; непонимание, где найти информацию, о которой спрашивают пользователя.
Однако, стоит держать в голове следующее: не стоит контекстные подсказки в качестве плейсхолдеров внутри самого поля – об этом нас предупреждает Джейкоб Нильсон.
69. Не используйте ненужные слова.
Переходите сразу к сути: сделайте предложения более короткими, используя меньше сложных слов. Как только напишите свой драфт, посмотрите, сможете ли вы его ужать (без потери в качестве материала). Демонстрация сути вашего послания/сообщения позволит сразу донести то, о чём вы хотели сказать и без потери внимания пользователя.
70. Адаптируйте ваш интерфейс вместо того, чтобы делать его статичным.
Нет ничего хуже в мире, чем двойная прокрутка на странице (сверху-вниз и слева-направо). Серьёзно, это настолько же давящее на мозги занятие, как пытаться рассмотреть карту через замочную скважину. Некоторые подобные ситуации являются непреднамеренными, когда пользователь, например, смотрит ваш сайт через другое устройство.
Одним из очевидных способов решить подобную проблему – включить автоматическую адаптацию отображения страницы на разных устройствах.
Ссылка на оригинал статьи: https://www.1990.agency/en/77-things-to-remember-when-designing-ui/
Любые конструктивные замечания по переводы приветствуются!
