{"id":14290,"url":"\/distributions\/14290\/click?bit=1&hash=bece6ae8cf715298895ba844b6416416882fe02c5d18dab2837319deacd2c478","title":"\u041a\u043e\u0440\u043f\u043e\u0440\u0430\u0446\u0438\u0438 \u043a\u0430\u043a \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u043d\u044c\u0448\u0435 \u0445\u043e\u0442\u044f\u0442 \u0441\u043e\u0442\u0440\u0443\u0434\u043d\u0438\u0447\u0430\u0442\u044c \u0441 \u043c\u0430\u043b\u044b\u043c \u0431\u0438\u0437\u043d\u0435\u0441\u043e\u043c","buttonText":"","imageUuid":""}

UX writing: чекбоксы, туллтипы и ховер подсказки

Всем привет! Хочу поделиться с вами важными пунктами по UX-writing небольших текстов в чекбоксах, туллтипах и ховер подсказках. Эти нюансы помогут вам писать качественные тексты, чтобы они были максимально четкими и понятными для юзера.

Начнём с определений больших терминов: UX writing и Microcopy.

UX writing — это более общее понятие, включает в себя почти все тексты, которые мы видим в интерфейсе от заголовков до инструкций.

Microcopy — микротексты, короткие фразы или слова, небольшие интерфейсные тексты (короче, пока что нет согласованного и единого перевода), которые мы видим на кнопках и всплывающих окнах.

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

Разговорный стиль — это такой подход к написанию тексту, который придает неформальный тон беседы между продуктом и юзером. Тут используется естественный около-бытовой язык, с простыми словами, которые понятны каждому.

Преимущества:

  • Понятность
  • Легкость восприятия
  • Повышение удовлетворения от использования (ощущение комфорта и юзер быстрее вникает).

А теперь к делу!

Кнопки — фундаментальный инструмент всех систем.

По типу их можно разделить на:

  • Маркетинговые (или сall to action) — мотивируют выполнить действие (например, ”Подписаться”, “Купить”)
  • Функциональные — ничего не продают, нужны, чтобы взаимодействовать с приложением (например, ”Войти”, “Отправить”).

Сегодня уделим внимание именно функциональным кнопкам. Ниже перечислю, каким лучше сделать текст на таких кнопках:

  • Соответствовать контексту
  • Быть короткими насколько это возможно
  • Говорить “что делать”, а не “что не делает” эта кнопка
  • Быть без сокращений и аббревиатур.

Еще микро-текст пишется в чекбоксах и тогглах. Основное саммари по ним:

  • Использовать глаголы действия ("Get product updates" вместо "Updates", "Enable dark mode" вместо "Dark mode for enhanced user experience")
  • Избегать использования двойных отрицаний ("Erase data each 7 days" вместо "Request that the browser doesn’t erase your data after 7 days")
  • Использовать sentence case, то есть с заглавной буквы начинается только первое слово, остальные строчные (такое написание считается более дружелюбным).

Все выше пункты по написанию текста относятся также к туллтипам и ховер подсказкам.

Когда мы используем туллтипы:

  • Как подсказку при наведении курсором на кнопку, иконку или ссылку, кратко подсказывая, что за кнопка и как ее использовать
  • Как расшифровку и пояснение аббревиатур, если используются.

Ховер подсказки (hover help) содержат справочную информацию, не относящуюся к функционалу кнопки. Когда мы используем ховер подсказки:

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

Это всё! Постаралась кратенько засуммировать нюансы. Надеюсь, такой конспект поможет сформировать тон интерфейса и писать краткие внятные тексты.

0
Комментарии
-3 комментариев
Раскрывать всегда