Понятный текст для интерфейса позволяет пользователю легко и эффективно взаимодействовать с цифровыми продуктами. Текст, который сложно понимать, может вызвать как минимум раздражение пользователя, а как максимум — отказ от использования продукта, если особой заинтересованности в нём нет.
Наталья Буянина перевела и адаптировала статью Norman Nielsen Group о том, как сделать текст элементов интерфейса простым и логичным.
наталья буянина
Перевела и адаптировала материал
Если вы ещё не знаете, что из себя представляет интерфейсный текст, сначала можно прочитать эту статью.
Рекомендации для названий кнопок и команд
Называем команду коротко, но понятно
Для текста предусмотрено немного места в интерфейсе приложения, поэтому текст на кнопках и названия команд должны быть короткими и отражать самую суть. При этом нужно учитывать, что если пользователь видит команду впервые, с помощью одного слова вряд ли удастся точно донести посыл.
Старайтесь использовать не больше 2‒4 слов — обычно этого достаточно для чёткого описания команды.
Пишем, что произойдёт при нажатии на кнопку
Если нажать на кнопку «Пауза» при просмотре видео, его воспроизведение остановится и появится надпись «Смотреть». Это то, что случится с видео при повторном нажатии на кнопку, а не его текущее состояние.
Такой подход экономит место. К примеру, команды в меню сообщения в Телеграме меняются в зависимости от состояния. Если в чате нет закреплённых сообщений, пользователь видит «Закрепить сообщение». Если сообщение закреплено, он увидит «Открепить сообщение».
Используем глаголы для обозначения действий и предоставления информации
Команды «Назад», «Вперёд», «Далее» или «Настройки» понятные, но могут быть слишком общими.
Если кнопка инициирует действие, лучше использовать глаголы. Понятные команды «Распечатать», «Удалить», «Войти» подскажут, что случится при нажатии на кнопку.
Указываем прилагательные для изменения состояния элемента
Прилагательные показывают, каким будет элемент: «Жирный», «Полужирный», «Зачёркнутый» и другие. Эти лаконичные определения не требуют дополнительных связок с глаголом — «сделать жирным», «сделать зачёркнутым». Этот приём обычно используется в текстовых редакторах.
Добавляем подсказки, где нужна дополнительная информация
Если пользователь видит команду в первый раз, стоит добавить подсказки. Они могут появляться при наведении курсора на текст или при нажатии на специальный символ.
Используйте подсказки только там, где пользователю нужна дополнительная информация для совершения действия.
Уточняем команды в зависимости от контекста
Если в одном меню встречается несколько похожих команд, но они относятся к разным объектам, используем глаголы в связке с существительным, чтобы избежать неоднозначности. Например, «Нарисовать таблицу» и «Удалить папку», а не «Нарисовать» и «Удалить».
Избегаем общих фраз вроде ОK
Текст кнопки ОK в окнах подтверждения иногда может запутать. Пользователь может нажать на кнопку по привычке, не читая всего сообщения и предполагая, что это правильный вариант.
Нужно чётко указать, что последует за нажатием кнопки, чтобы пользователь не совершил ошибку. Также добавить кнопку с возможностью отмены действия.
Ставим многоточие при необходимости уточнения информации
Если для выполнения команды требуется выбор опций и дополнительное меню, нужно поставить многоточие. Так пользователь сможет отличить немедленные действия от составных.
Курс- Научитесь создавать и анализировать пользовательские сценарии
- Сможете писать микротексты и соблюдать tone of voice
- Узнаете, как проектировать дружелюбный интерфейс в паре с дизайнером
Рекомендации для оформления быстрых клавиш
Быстрые (горячие) клавиши — это комбинации клавиш на клавиатуре, которые позволяют пользователям быстро выполнять частые команды. Примеры быстрых клавиш — Ctrl + S (Windows) для сохранения или Command + N (MacOS) для открытия нового окна браузера.
Горячие клавиши ускоряют передвижение по продукту и упрощают выполнение популярных задач. Нажать, например, Ctrl + V или Command + V быстрее, чем искать функции копирования и вставки из меню.
Чтобы пользователи могли сэкономить время, нужны понятные и лёгкие для запоминания обозначения быстрых клавиш — рассказываем, как это можно сделать.
Фиксируем быстрые клавиши для часто выполняемых задач
Не для каждой задачи нужна горячая клавиша. Посмотрите, как пользователи взаимодействуют с программой и какими командами пользуются чаще всего. Это поможет расставить приоритеты для горячих клавиш.
Например, при просмотре в браузере фейсбук предлагает горячие клавиши, чтобы быстро перемещаться по ленте, поставить лайк или выполнить другие действия.
Не меняем стандартные сочетания клавиш
Если создаёте собственные сочетания клавиш, учтите распространённые варианты, чтобы не путать пользователя. Например, встречающиеся во многих продуктах Ctrl + C для копирования и Ctrl + V для вставки.
Делаем быстрые клавиши одинаковыми для схожих систем
Одинаковые сочетания должны быть доступны как для операционных систем MacOS, так и Windows. Также пользователи должны иметь возможность устанавливать собственные клавиши, помимо параметров по умолчанию.
Стоит сделать всплывающие подсказки к иконке функции — описание команды и быстрые клавиши, а также добавить список сочетаний клавиш в справочный раздел.
Устанавливаем сочетания клавиш, которые легко запоминаются
Не программируйте быстрые клавиши только потому, что считаете комбинацию уникальной. Основной критерий — сочетание клавиш должно без особых усилий остаться в памяти пользователей.
Используйте чёткую последовательную систему, связывайте функцию с кнопкой на клавиатуре. Многие пользователи не знают, что означают определённые символы или названия кнопок, если не смотрят на клавиатуру.
Используем комбинации в одну-две клавиши
Чем меньше клавиш в сочетании, тем проще их запомнить. Используйте одну или две клавиши, чтобы помогать пользователю, а не нагружать его память.
Резюмируем
Плохой текст в интерфейсе сбивает с толку и заставляет пользователей тратить время на понимание, как пользоваться продуктом.
Старайтесь называть команды и устанавливать быстрые клавиши так, чтобы пользователи легко и быстро находили нужные функции и чаще пользовались вашим цифровым продуктом.
Мнение автора и редакции может не совпадать. Хотите написать колонку для Нетологии? Читайте наши условия публикации. Чтобы быть в курсе всех новостей и читать новые статьи, присоединяйтесь к Телеграм-каналу Нетологии.
наталья буянина
Перевела и адаптировала материал