Со времён работы в рекламных агентствах я уделял большое внимание текстам. Опыт совместной работы с лучшими копирайтерами пригодился мне не только в рекламе, но и в проектировании интерфейсов – от общего tone of voice до лаконичных, понятных каждому текстов, которые направляют пользователя по нужному пути.
Например, в WeavePay я убедил юристов заменить казённые формулировки вроде «являетесь ли вы ПДЛ?» на более человечные, типа «я публичное должностное лицо».
Кто ясно мыслит, тот ясно излагает. Стремясь сделать текст простым и понятным для пользователя, мы упорядочиваем логику сценария в собственной голове. Это помогает переосмыслить сложный интерфейс и пересказать его как простую историю. Я всегда прошу дизайнеров сначала решить задачу текстом и только потом браться за макеты. Вот как изменился интерфейс формы Open Investments после того, как я переформулировал тексты. Даже количество действий, требуемых от пользователя, сократилось!
Составление словаря терминов – важнейшая часть работы. Я занимался этим в Open Investments, TaskMe, Ingos Investments, начал эту работу в InvestEngine, а затем нанял писателя. Во многих компаниях существуют зачатки словаря, но они обычно охватывают только специфические термины и служат другим целям – документация, локализация, шпаргалка для новых сотрудников.
Вот типичный результат моей работы на примере Ingos Investments:
Проблема
В разных продуктах и даже в сценариях одного продукта нет единообразия текстов: одни и те же сущности могут называться по-разному. Обилие синонимов порождает варианты толкования, это осложняет взаимодействие пользователя с интерфейсом. Тон общения и речевые обороты также не совпадают в разных сценариях. Это разрушает ощущение целостности продукта и солидности компании.
Решение
Словарь терминов и выражений позволяет решить как проблему пользователя (понятность, однозначность текстов и ощущение солидности продукта), так и проблему дизайнеров: не нужно каждый раз изобретать формулировки с нуля. Вот как пользоваться словарём:
- Определите, о чём вы хотите написать в интерфейсе.
- Поиском на странице словаря найдите похожие варианты.
- Если выражение нашлось в колонке “Неправильно”, не используйте его.
- Прочитайте аргументы в колонке “Обоснование”. Если есть возражения, напишите комментарий.
- Возьмите термин или выражение из колонки “Правильно”.
Общие рекомендации
- В заголовках лучше избегать глаголов, особенно повелительного наклонения, за исключением случаев, когда мы действительно хотим надавить на пользователя.
- Кнопки по возможности должны содержать глаголы.
- Если в заголовке не описано, что произойдёт при нажатии на кнопку, текст кнопки должен разъяснять подробности. В этом случае допускается использование на кнопке больше одного слова.
- Подсказка поля ввода по возможности должна быть существительным. Глаголов в поле ввода лучше избегать.
- Текст заголовка, подзаголовка, подсказки поля ввода и кнопки не должны дублировать друг друга. Повторение слов оправдано только если на странице несколько сущностей, которые можно спутать.
- Текст ошибки не должен обвинять пользователя. Желательно объяснить что произошло с данными, а не указывать пользователю что ему делать.
- Сообщения лучше излагать от лица программы, а не людей – местоимение “мы” не должно использоваться.
- Команды (действия при нажатии кнопок и т.п.) отдаём компьютеру, а не пользователю, поэтому пишем “показать все новости” (повеление компьютеру), а не “смотреть все новости” (повеление человеку).
Вот лишь небольшая выборка из словаря:
| Тип | Правильно | Неправильно | Обоснование |
|---|---|---|---|
| Ошибка | Все поля должны быть заполнены | Пустое поле, Обязательное поле, Введите значение, Заполните данные | При множественных ошибках на странице отображаем только одну, первую из них, чтобы не раздражать пользователя (может быть пользователь не ошибся, а решил заполнить поля в произвольном порядке или вернуться к заполнению позже). Поэтому хорошо дать рекомендацию на будущее, подходящую и к другим полям. |
| Заголовок | Вход | Войти, Логин, Представьтесь | Для мобильного приложения |
| Заголовок | Вход в личный кабинет | Войти, Логин, Представьтесь | Для web |
| Поле ввода | Мобильный телефон | Телефон, Ваш телефон | Напоминаем, что телефон не стационарный. Не пишем “ваш”, поскольку мобильный телефон и так считается персональным устройством, а номер привязан к личности (паспорту). |
| Ошибка | Некорректный номер | Ошибка номера, Номер не существует, Неверный номер. | Если код оператора не начинается с 9 (а лучше проверить фиксированный набор действительных кодов). Выводим ошибку в процессе ввода номера. |
| Ошибка | Укажите номер телефона | Пустое поле, Не указан телефон, Заполните телефон | При пустом поле (если это единственная ошибка на экране). |
| Кнопка | Отправить код подтверждения | Продолжить, Далее, Отправить SMS | На кнопках стараемся использовать глаголы. Если заголовок не поясняет однозначно, что произойдёт при нажатии на кнопку, пишем это на самой кнопке. |
| Заголовок | Код из SMS | Введите код из SMS, Подтвердите вход. | Название процесса. Без повелительного наклонения. |
| Подзаголовок | Код подтверждения отправлен на телефонный номер +7 (903) 987-65-43 | Мы отправили SMS с 6-значным кодом на телефонный номер +7 (903) ***-**-43 | Избегаем местоимений (кто “мы”?). В заголовке уже есть слово “SMS”. Сколько разрядов в коде видно по полю ввода. Если на предыдущем шаге пользователь вводил телефон, показывать его полностью. Так пользователь сможет заметить опечатку. |
| Подзаголовок | Код подтверждения отправлен на телефонный номер +7 (903) ***-**-43 | Если на предыдущем шаге пользователь не вводил телефон, частично скрываем его. | |
| Информация | Отправить код повторно можно через N сек. | Подождите N сек. | Это информационное сообщение превратится в кнопку (ссылку), поэтому оно также должно содержать глагол. |
| Кнопка | Отправить код повторно | Выслать, Повторить | Кнопка может быть оформлена как ссылка. Содержит глагол. Слово “SMS” уже не нужно, оно есть в заголовке. |
| Ошибка | Код введён неверно. Осталось N попытки | При N>2 меняем текст на “Код введён неверно. Осталась 1 попытка”. | |
| Информация | Проверка данных | Получаем данные | Заглушка при переходе к следующему шагу. Избегаем местоимений. |
| Поле ввода | Электронная почта | email, e-mail, почта, почтовый адрес | Пишем по-русски. Просто “почта” может быть не электронной |
| Ошибка | Укажите адрес электронной почты | Введите почту | |
| Ошибка | Проверьте адрес электронной почты | Неправильная почта | |
| Ошибка | Недопустимые символы | Для полей, у которых нет индивидуального сообщения на несовпадение с маской. | |
| Кнопка | Войти | Вход, далее | На кнопках стараемся использовать глаголы. В заголовке страницы должно быть написано куда именно пользователь войдёт. Если заголовка нет, придётся писать на кнопке более развёрнуто. |
| Кнопка | Не помню пароль | Забыли пароль? Восстановление пароля. | Описываем ситуацию пользователя. Не задаём лишних вопросов. Не предлагаем действие, которое может быть интерпретировано неоднозначно. |
| Ошибка | Пароль не подходит | Неверный пароль. Ошибка пароля. | По аналогии с “ключ не подходит” (к замку). Не стоит обвинять пользователя в том, что он совершил ошибку или неверное действие. Пусть попробует другой ключ – обычная бытовая ситуация без негативного оттенка. |
| Ошибка | Введите пароль от личного кабинета | Укажите пароль | Для пароля и PIN-кода используем глагол “введите”. Для остальных полей глагол “укажите” (текст ошибки пустого поля). |
| Заголовок | Создание пароля | Задайте пароль | Название процесса. Без повелительного наклонения. |
| Заголовок | Создание нового пароля | Придумайте пароль | Название процесса. Без повелительного наклонения. |
| Заголовок | Старый пароль | Введите старый пароль, текущий пароль | Название процесса. Без повелительного наклонения. |
| Кнопка | Продолжить | Далее | На кнопках используем глаголы |
| Поле ввода | Пароль от личного кабинета | Введите пароль. Пароль. | Люди держат в голове много паролей и нередко теряются: если в качестве логина была электронная почта, то какой пароль нужно ввести? От своей электронной почты? Может быть пин-код приложения? Кодовое слово для финансовых операций? Поэтому лучше прямо писать пароль от какого сервиса требуется. Кроме того, избегаем глаголов в полях (глаголы используются в кнопках). |
| Поле ввода | Новый пароль | Пароль, Создать пароль, Придумайте пароль | В полях ввода избегаем глаголов |
| Поле ввода | Подтверждение пароля | Подтвердите пароль, Повторить пароль | В полях ввода избегаем глаголов |
| Подзаголовок | Длина пароля не менее 8 символов. Допускаются буквы A-Z, a-z, цифры и специальные символы (!,@,# и т.д.) | Пароль должен состоять… Длина пароля не менее 8 символов. Допускаются символы A-Z, a-z, 0-9 и специальные символы (!,@,# и т.д.) | Без повелительного наклонения. Меньше повторяющихся слов |
| Кнопка | Создать пароль | Далее, Создать | Первое создание пароля. На кнопках используем глаголы |
| Кнопка | Создать новый пароль | Далее, Создать, Изменить, Запомнить | Изменение пароля на новый. На кнопках используем глаголы |
| Ошибка | Пароль не соответствует требованиям безопасности | Недопустимые символы, Пароль должен… | Пишем про свойства пароля, а не про то, что пользователь допустил ошибку. Избегаем повелительного наклонения. |
| Информация | Пароль соответствует требованиям безопасности | Надёжный пароль | Пишем только если уже возникала ошибка (несоответствие требованиям безопасности). |
| Ошибка | Пароли не совпадают | Ошибка пароля, Неверный пароль, Пароли должны совпадать. | Описываем текущую ситуацию. Не ругаем и не обязываем пользователя. |
| Ошибка | Новый пароль должен отличаться со старого | Новый пароль не должен совпадать со старым, Пароли совпадают, Измените пароль | Пишем про свойства пароля, а не про то, что пользователь допустил ошибку. Избегаем отрицательных частиц. Хорошо бы избежать и повелительного наклонения, но непонятно как, пока можно сделать исключение. |
| Alert dialog | Заголовок: Пароль изменён Подзаголовок: Используйте новый пароль также для входа в личный кабинет на ingosinvest.ru |
Пароль исправлен | При успешном изменении пароля показываем сообщение об успехе. |
| Заголовок | Введите PIN-код | Вход в приложение, PIN-код | При запуске приложения. Кажется избыточным, может быть вообще откажемся от заголовка. |
| Кнопка | Выйти | Сменить пользователя, Перелогиниться, Завершить, Закончить сеанс | Кнопка-ссылка, не должна бросаться в глаза. |
| Заголовок | Придумайте PIN-код | Создание PIN-кода | Исключение. Хотелось бы без повелительного наклонения в заголовке, но эта часть интерфейса больше похожа на системный экран и может отличаться тоном общения от основного продукта. |
| Подзаголовок | Вход в приложение станет быстрей и проще | Объясняем пользователю пользу. Резервируем место для другого сообщения (см. ниже). | |
| Подзаголовок | Пожалуйста, запомните введённый код | Вход в приложение станет быстрей и проще | Показываем вместо предыдущего подзаголовка если была ошибка подтверждения PIN-кода. Хотим обратить внимание пользователя на важность этого кода. |
| Заголовок | Подтвердите PIN-код | Повторите PIN-код, Повторно введите PIN-код | |
| Ошибка | Коды не совпадают | Ошибка, Неверный PIN-код | Описываем текущую ситуацию. Не ругаем и не обязываем пользователя. При ошибке направляем пользователя на создание PIN-кода (а не на подтверждение). |
| Заголовок | Восстановление пароля | Восстановить пароль, Введите почту | Название процесса. Без глаголов и тем более без повелительного наклонения. |
| Подзаголовок | Укажите адрес электронной почты, на которую будет отправлена ссылка для создания нового пароля | Укажите адрес электронной почты, на которую мы вышлем ссылку для создания нового пароля | Избегаем местоимений. |
| Кнопка | Отправить письмо | Далее, Продолжить, Восстановить | Точно описано что программа сделает при нажатии на кнопку. |
| Заголовок | Проверьте электронную почту | Пароль восстановлен | Исключение: глагол в заголовке. Это тупик в сценарии, пользователь не может пользоваться программой, пока не пройдёт по ссылке из почты. Нужно принудить пользователя открыть почтовую программу. |
| Подзаголовок | Ссылка для создания нового пароля отправлена на вашу электронную почту user@gmail.com | Мы отправили ссылку для создания нового пароля на вашу электронную почту user@gmail.com | Избегаем местоимений (кто “мы”?). |
| Термин | Персональные данные | Личная информация, Личные данные, Анкетные данные | Личное – не то, чем люди хотят делиться с незнакомцами. Анкета – не всегда уместно, потому что эти данные могут использоваться и не в контексте анкеты. |
| Ошибка | Отправить код можно через 10 минут | Слишком много SMS | Когда превышен лимит на запрос отправки SMS-кода, скрываем кнопку “Отправить код повторно”. Пользователь может вернуться на экран ввода телефона. Если пользователь введёт тот же телефон, что и раньше, под полем ввода телефона появится ошибка с таймером, а кнопка “Отправить код подтверждения” будет неактивной. |
| Alert dialog | Заголовок: Неверный код подтверждения Подзаголовок: В целях безопасности вход в приложение заблокирован на [значение из ответа сервиса] |
Превышено число, Повторный вход будет доступен… | Избегать казённых формулировок. |
| Ошибка | Слишком простой пароль | Найден в базе взломанных паролей | Пользователю должно быть однозначно понятно как исправить свою ошибку: “слишком простой” – значит усложнить. |
| Alert dialog | Заголовок: Время ожидания истекло Подзаголовок: Повторите вход в приложение |
Превышено время ожидания, Авторизация не пройдена, Повторите аутентификацию | Избегаем обвинений, казённых формулировок и технических терминов. |
| Подзаголовок | Пожалуйста, введите пароль. После этого вам нужно будет придумать новый, более надёжный пароль. | Ваш пароль не соответствует требованиям безопасности, Мы изменили требования к паролю | Не ищем виноватых. Сразу сообщаем что нужно сделать и как от этого улучшится жизнь. |
| Транспортная ошибка | Убедитесь, что ваше интернет-соединение в порядке, и не включён VPN | Нет соединения с Интернет | Такая ошибка может возникнуть почти на любом экране. |
| Транспортная ошибка | Приносим извинения за технические проблемы. Попробуйте ещё раз. | Сервер не отвечает, Что-то пошло не так | Такая ошибка может возникнуть почти на любом экране. |
