Как писать просто, понятно и для интерфейсов: лучшие практики UX-редакторов Ozon

Привет всем! Это не обычная статья, это целый курс про UX-редактуру от Ozon. Мы с вами разберем, что такое UX-редактура, какие бывают форматы интерфейсных текстов и как их писать качественно, быстро и просто.

Меня зовут Кира Калимулина, мы с командой занимаемся всеми интерфейсными текстами в Ozon. Я задумала этот курс, чтобы помочь дизайнерам, продакт-менеджерам, копирайтерам, разработчикам и другим специалистам научиться писать тексты для интерфейсов.

Этот курс подойдёт тем, кто только погружается в мир UX-редактуры и хочет стать продуктовым редактором. А также тем, кто вынужден писать тексты для приложений, но не умеет (или думает, что не умеет).

Я подготовила 4 урока, где разобрала, как мы пишем тексты в Ozon. Для вашего удобства основная информация продублирована в видеоуроках. В роликах есть ещё много приколов, которые невозможно передать в статье, так что можно и смотреть, и читать — как вам удобнее! 

Урок 1: Что такое UX-тексты, и кто их пишет

Что такое UX-редактура? 

UX-редактура (User Experience-редактура, UX-копирайтинг, UX-писательство, UX-writing) — это редактура текстов для интерфейсов сайтов и приложений. Основной целью UX-редактуры является создание текстов, которые легко читать, понимать и применять.

В UX-редактуре важно не только написать хороший и ясный текст, но и учесть много факторов: формат, сочетание с другими элементами интерфейса, тональность, а также контекст, в котором находится пользователь.

Что такое UX — лирическое отступление

UX — это User Experience или пользовательский опыт. Он охватывает опыт пользователя при взаимодействии с продуктом (обычно сайтом или приложением). В него входит восприятие пользователем продукта, удобство использования, доступность, дизайн, эргономика, а также эмоциональные и психологические аспекты.

UX — это не только про приложения, но и про обычные бытовые предметы, которые нас окружают.

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

В итоге вы, не задумываясь, выбираете те предметы, которые вам больше подходят. Удобство использования, привлекательность и вызываемые эмоции — всё это влияет на то, будете ли вы пользоваться дальше таким предметом или таким приложением. 

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

А UX-текст — это текст в интерфейсе. Но это не просто какие-то фразы. Такой текст помогает пользователям продвигаться по флоу и облегчает тот самый пользовательский опыт.

Зачем нужны UX-тексты и где они встречаются

Задачи UX-текстов

Главная задача UX-текста — улучшить пользовательский опыт. А если конкретнее, такие тексты делают следующее:

• объясняют, что делать и куда идти,

• обозначают навигацию на сайте или в приложении,

• передают информацию о бренде или акциях,

• помогают пользователям лучше понять продукт.

Где встречаются UX-тексты

В мобильном приложении

Например, пользователь хочет заказать чайник через Ozon. Весь его опыт от захода в приложение, от желания заказать до оформления заказа — и есть опыт пользователя. 

То, каким будет этот опыт — положительным или отрицательным — зависит от дизайнеров и редакторов. Можно спрятать форму заказа как можно дальше и заставить клиента оставлять все паспортные данные снова и снова. А можно расположить кнопку заказа удобно и облегчить оформление заказа до 3 нажатий.

В банкоматах и постаматах

Интерфейс — это всё, с чем человек взаимодействует в реальной жизни. Например, в интерфейсе банкомата тоже используются UX-тексты, которые помогают пользователю: вот сюда карту, оттуда выйдет чек, туда класть деньги.

В объявлениях и плакатах

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

Кто пишет UX-тексты 

UX-текстами занимаются UX-редакторы. Они пишут и редактируют контент с учётом пользовательского опыта (User Experience). Главная задача UX-редактора — сделать так, чтобы тексты на сайте или в приложении были понятны пользователям и помогали им легко ориентироваться в продукте.

Чем занимаются UX-редакторы?

• Делают интерфейсные тексты. Могут написать, отредактировать, вычитать.

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

• Продумывают и поддерживают ToV (tone of voice или тональность текстов компании).

• Проводят исследования сами или используют результаты от UX-исследователей при написании текстов.

• Также во многих компаниях UX-редакторы могут помочь дизайнерам с адекватностью пользовательского пути, посмотреть на путь пользователя «взглядом новичка» и посоветовать изменения.

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

Многоликие UX-редакторы

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

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

Чем UX-тексты отличаются от маркетинговых

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

Если просто: маркетинговые тексты привлекают, а интерфейсные — помогают.

Если ещё проще: маркетинговый текст — это яркий зазывала на улице, который рассказывает бабушкам, что открылся новый магазин. А интерфейсный текст — это скромный пионер, который переводит этих самых бабушек через дорогу.

Урок 2: Форматы UX-текстов

Все UХ-тексты можно разделить на 3 больших группы. 

• Элементы — заголовок и подзаголовок, списки, ссылки, кнопки.

Это основные сборные компоненты для UX-текстов.

• Подсказки в приложении — алерт-баннер, онбординг, инпут, снэкбар, нотификации, модальное окно, тултип, пустое состояние, экраны ошибок и успеха.

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

• Внешние коммуникации — пуши, СМС, письма, релиз-ноутсы.

Также собираются из элементов. Такие коммуникации помогают общаться с пользователем и рассказывать о своём продукте за пределами приложения. 

1. Элементы

Это составные части, из которых можно собрать любые форматы UX-текстов. Их можно комбинировать друг с другом или же использовать по отдельности. 

Заголовки и подзаголовки

Эти форматы встречаются практически в каждом интерфейсном тексте. Общее правило написания такое: в заголовок выносим самое важное, в подзаголовок — дополнение и пояснения. 

В разных компаниях заголовки и подзаголовки могут оформляться по своим внутренним правилам. Например, мы в Ozon считаем, что заголовок и подзаголовок — это две единицы смысла. Поэтому в подзаголовке используем только полные фразы, чтобы их можно было прочитать по отдельности. И всегда начинаем их с большой буквы.

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

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

Списки

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

Списки могут быть нумерованными или маркированными. Если важен порядок поинтов, например, это последовательная инструкция, стоит использовать нумерованный список. В остальных случаях подойдёт маркированный (ненумерованный) список.

Ссылки

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

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

Из текста ссылки пользователю должно быть понятно, куда он перейдёт. Не используйте наречия места — тут, здесь.

Если ссылка расположена в тексте, стоит выделять ей 1–2 слова. Лучше, если выделенные ссылкой слова расположены в начале или в конце предложения. Одну ссылку нежелательно разбивать на 2 строки.

Кнопка 

Кнопка — это решение клиента, выраженное в интерфейсе. Чаще всего текст на кнопке пишут в форме инфинитива — купить, перейти, добавить. Можно проверить, правильно ли написан текст на кнопке, «примерив» его на реакцию пользователя. Например, на предложение купить товар он может принять такие решения: «Ок, купить» или «Нет, закрыть предложение».

При этом кнопка может быть и наречием, если пользователя просят только ознакомиться с информацией. Например: понятно, хорошо, отлично.

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

2. Подсказки в приложении

Подсказки в приложении также собираются из элементов. Они помогают пользователю ориентироваться в интерфейсе. Подсказки можно отнести к внутренним коммуникациям. С их помощью наш продукт общается с пользователем внутри приложения. 

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

Алерт-баннер 

Алерт — это короткое текстовое сообщение, которое используют, когда нужно сообщить об особенностях продукта и продуктового сценария или предупредить о возможных рисках или ограничениях. Например, что можно открыть спор с продавцом или что счёт нужно оплатить в течение 30 минут.

В Ozon мы называем такой формат «Дисклеймер» или «Информер» и, кстати, в разных компаниях вы можете встретить разные названия подсказок, но это к слову. 

Нотификейшн (Notification) и снэкбар (snackbar)

Это подсказки, которые всплывают в ответ на действие пользователя. Они могут информировать его о действии, которое он совершил в приложении прямо сейчас, например, что всё прошло хорошо или плохо. Или давать дополнительную информацию, например, что какой-то товар из корзины закончился и его уже нельзя купить.

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

Друг от друга они отличаются расположением — нотификейшны располагаются сверху, а снэкбары снизу экрана. У нас в Ozon мы объединили их в один формат. 

Тултип (Tooltip)

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

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

Модальное окно (Поп-ап)

Модальное окно или поп-ап появляется при нажатии на элемент интерфейса. Когда модалка появляется, все элементы под ней становятся неактивными, пока пользователь её не закроет.

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

В Ozon мы между собой называем такой формат «шторкой».

Онбординг (onboarding)

Онбординг — это сообщение, которое знакомит пользователя с продуктом или отдельной фичей.

Есть два основных вида онбординга: онбординг-сториз и онбординг-модалка.

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

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

Бейдж / Метка (Badge) 

Бейдж — это небольшая метка или значок, которая даёт самую важную информацию о товаре и привлекает внимание пользователей. Бейдж может содержать числовые значения (например, количество товара в корзине), текстовые метки (например, «новинка»), цветовые индикаторы (например, красный для ошибки, зелёный для успеха) и т. д.

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

В Ozon на товарах можно увидеть надписи «Баллы за отзыв», «Распродажа», «Хиты недели», «Цена что надо». Это и есть бейджи.

Инпут (Input)

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

У инпута есть название или заголовок (также он называется лейбл) и подзаголовок (плейсхолдер). 

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

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

Лейбл и плейсхолдер должны быть понятными для пользователя и максимально короткими.

И ещё 3 типа текстов для взаимодействия с пользователями

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

Пустое состояние — это сообщение, которое показывает, что в этой области интерфейса ничего нет. Ещё их могут называть заглушками. Пустое состояние может призывать пользователя заполнить данные или сообщать, что появится на экране, когда тот заполнится.

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

Экран успеха — это сообщение, которое показывает, что пользователь сделал правильное действие и всё получилось. 

Чтобы лучше разобраться с этими форматами и забрать 50 готовых шаблонов пустых состояний и ошибок, читайте мою статью на Хабре. 

3. Внешние коммуникации

Внешние коммуникации помогают общаться с клиентом не только внутри приложения. Среди таких форматов всем нам известные пуши, смс, электронные письма и релиз-ноутсы. Давайте разберёмся и с ними.

Пуш-уведомление (Push Notification)

Пуш — это короткое сообщение, которое отправляется на устройство пользователя. Его можно прочитать, даже когда приложение закрыто. 

С помощью пушей можно информировать пользователей о статусе заказа, акциях, новых фичах в продукте и т. д. Но не стоит отправлять их чрезмерное количество — это раздражает и вызывает «пушевую слепоту». 

Идеальный пуш выглядит так: весь текст умещается в сообщении и его не нужно раскрывать, есть привлекающий заголовок, который не дублируется с основным текстом. Ещё в него можно добавить эмодзи и картинку. Главное — не переборщить. 

СМС

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

СМС должны быть максимально короткими и без ошибок, чтобы не отбить желание его читать. Главная особенность формата в ограничении по количеству знаков — до 70 с пробелами. Если написать больше, то сообщение будет тарифицироваться в два раза дороже — как две эсэмэски.

Электронное письмо

Письмо — это сообщение, которые пользователь получает на свой e-mail. В них можно добавлять максимум информации, которую в другие форматы не вместить. Например, не только сообщить о статусе заказа, но и показать интересную подборку товаров или актуальные акции. 

У каждого письма должна быть тема и краткое описание. Они рассказывают пользователю, о чём пойдёт речь в письме ещё до его открытия. 

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

Релиз ноутсы (Release notes)

Релиз ноутсы — это сообщения в App Store, Google Play или другом магазине приложений о том, что изменилось в новой версии приложения. Основная цель релиз ноутса — рассказать об обновлении так, чтобы приложение захотелось обновить. 

Каждая компания устанавливает свои правила написания релиз ноутсов.

В Ozon мы придерживаемся вот таких: 

• релиз ноутсы подчиняются внутреннему ToV и редполитике;

• пишем про фичи и про акции, но без излишне продающих текстов;

• не касаемся чувствительных и полемических вопросов. 

А вот так релиз ноутсы отображаются в App Store: можно посмотреть последнее сообщение об обновлении и историю версий. 

А если хотите узнать больше про UX-редактуру, переходите в Гайд по текстам в интерфейсе. Там собраны все наши полезные материалы про UX-тексты, в том числе наш большой гайд по текстам в интерфейсе, в котором мы собрали основные интерфейсные правила и очень подробные описания форматов. Сохраняйте, чтобы всегда был под рукой. 

Урок 3: Как писать тексты для интерфейсов

Чтобы объяснить, какими должны быть UX-тексты, начнём с глобального — с их принципов. Это даст понимание, какими, вообще, должны быть интерфейсные тексты.

Вот на какие принципы мы опираемся, когда пишем UX-тексты в Ozon.

Принципы UX-текстов

Важное вперёд 

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

Например, у вас есть такое сообщение:

Но ведь здесь самая главная мысль — «Продлите подписку». Всё остальное уже обстоятельства: зачем продлевать, почему сейчас и т. д. Поэтому важное выносим в заголовок, а оставшуюся информацию в подзаголовок или тело сообщения.

Стакан UX-редактора всегда наполовину полон 

Превращайте негатив в позитив. Например, фразу «Информация исчезнет через 5 дней» можно заменить на более позитивную — «Информация будет доступна ещё 5 дней». Только обращайте внимание на контекст — такое превращение не должно искажать смысл. 

Информируйте

Пользователь всегда должен понимать, что происходит в данный момент и зачем ему делать то, что мы от него просим. Для этого сообщайте ему необходимые подробности. Например, если вы запрашиваете какие-то данные, объясните, для чего они нужны, и успокойте, что эти данные под защитой и не попадут мошенникам.

Меньше и проще

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

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

По делу и вовремя

Не пишите текст ради текста. Он всегда должен решать какую-то задачу. Например, подсказать об ошибке, которую совершил пользователь, или что оплата не прошла, потому что не хватает денег на карте. 

Если считаете, что где-то можно обойтись вообще без текста или сократить его, попробуйте это сделать. Но только без потери смысла. 

Тут мог быть текстовый пример, но мы решили обойтись без него. И это тоже пример!

Боритесь за консистентность

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

Не уверены в тональности? Пишите в инфостиле

Инфостиль — это приёмы редактирования, которые помогают очистить текст от мусора, наполнить его полезной информацией и сделать читаемым. Термин ввёл редактор Максим Ильяхов, автор книги «Пиши, сокращай». 

Инфостиль — это база для UX-текстов. Ведь важно, чтобы тексты были простыми и легко воспринимались пользователями. А для этого нужно избавляться от слов и фраз, которые делают текст громоздким и тяжёлым для восприятия. Ильяхов называет их стоп-словами.

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

А уже на инфостиль можно нанизать любую тональность, с которой общается ваше приложение.

А теперь мы готовы погрузиться в сложную тему, которая поможет вам виртуозно писать UX-тексты

Синтаксис интерфейса

Когда есть общее понимание «А какими должны быть все UX-тексты?», можно переходить к правилам написания самого текста. В русском языке за объединение слов в словосочетания и предложения отвечает синтаксис. В интерфейсе тоже есть свой синтаксис. Только он изучает сочетание элементов на экране.

Синтаксис в интерфейсе — это набор принципов, которые объясняют, как писать текст в интерфейсных элементах. Например, таких как кнопки, заголовки и подзаголовки. Этот набор принципов помогает разобраться, как лучше сочетать элементы друг с другом. 

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

Правило 1: текст в интерфейсе — это диалог между продуктом и пользователем

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

Чаще всего текст на кнопке пишут в форме инфинитива, который отвечает на вопрос «Что сделать?» — купить, перейти или заполнить.

Но если это кнопка-одобрение, то можно использовать и наречие. Например, «Хорошо», «Понятно», «Отлично». Важно учитывать, что мы просим от пользователя — если выполнить действие, то в кнопке должен быть инфинитив. А если просто информируем, то он может ответить наречием.

Правило 2: все элементы должны быть связаны по смыслу и грамматически

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

Самый простой способ проверить текст на связанность — посмотреть на заголовок и кнопку, не обращая внимания на другие элементы. По заголовку и кнопке вам понятно, что происходит на экране? Эти элементы сочетаются друг с другом? Если на оба вопроса вы ответили отрицательно, то и пользователь не разберётся, что делать, и не совершит нужного целевого действия. А если такое будет повторяться во всём приложении, то юзер просто перестанет им пользоваться и найдёт для себя более понятный сервис.

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

Бонусный урок. Как писать, если совсем не умеете

Я хочу вас успокоить: все способны писать тексты. 

Да-да, вы тоже.

Если я попрошу вас написать в комменты (а кстати, давайте попробуем!) что-то вроде вашего имени, профессии, опыта работы и карьерных планов, вы легко сможете это сделать. Вы постоянно используете тексты и пишете. Но при этом кажется, что написать текст сложно, как будто это какая-то магия.

Однако я хочу рассказать вам про методы, которые давно используются в юикс-редактуре. И вот они уже выглядят как настоящая магия. Эти методы отлично работают, и их можно использовать в любом тексте. 

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

Применяйте логику

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

• Какая у вас боль 

Прежде чем приступить к написанию текста, ответьте на следующий вопрос: какая у вас боль и как вам поможет текст? Наверняка у вас есть цель, которой вы хотите добиться с помощью своего сообщения — попросить о чём-либо, предъявить требование или просто передать информацию. Ответ на этот вопрос повлияет на тон текста и на приёмы, которые вы будете использовать. Например, нет смысла хамить в сообщении, если вы хотите кого-то о чём-то попросить (да и вообще никогда хамить не надо!).

• Для кого вы пишете

Определите, к кому именно вы обращаетесь. Важный момент — иногда люди пишут, думая, что их будет читать одна аудитория, а в результате их читают совсем другие люди. Например, в компании делают рассылку с новостями, ожидая, что их будут читать рядовые сотрудники. А те игнорируют рассылку, и в итоге её читает только высшее руководство. 

• О чём вы пишете

Уточните для себя, какой смысл хотите донести через своё сообщение. Если вы сами не до конца понимаете, что хотите сказать, то и текст ваш никто не поймёт (или поймёт неправильно). 

Когда вы всё это определите, написать текст будет очень просто. Сформулируйте то, что вы хотите сказать, при этом обращайтесь к вашей целевой аудитории. И держите в голове вашу основную цель, зачем вы пишите, — это позволит скорректировать тональность. 

Разберём на примере

Представьте ситуацию: вы живёте в прекрасной квартире с открытым балконом, но ваши соседи сверху любят курить и выбрасывать непотушенные окурки вниз. Вы уже ловили пару «бычков» у себя. Мало того, что это вас раздражает, так это ещё и опасно! 

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

Итак, вы пишете объявление. 

Какая боль? Вы хотите, чтобы соседи перестали кидать непотушенные окурки. 

Кто целевая аудитория? Ваши соседи. 

Что хотите сказать? Смысл тут простой и почти совпадает с целью: «Перестаньте выбрасывать горящие окурки!"№%:,.;())».

И вот у вас появляется объявление. Можно даже распечатать его и повесить на стену подъезда, чтобы все всё поняли. Возможно, текст пока не идеален, но мы только начали. 

Описывайте контекст

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

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

Разберём на примере

Вернёмся к нашим окуркам. Что знаете вы, но не знает человек, который выбрасывает? Возможно, он не понимает, что балкон может загореться. Ну или плохо помнит физику и не в курсе, что огонь идёт наверх, и ему будет хуже. 

Так давайте ему расскажем! Включите контекст в сообщение.

Учитывайте формат

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

В чём особенности и ограничения формата? Какие возможности он даёт, а что сделать невозможно? 

Разберём на примере

Например, подъездное объявление — это чаще всего белый лист формата А4. Мы можем написать объявление даже от руки, но тогда его, вероятно, будет сложно прочитать. В объявлении можно писать текст и размещать изображения, а вот видео по понятным причинам туда вставить невозможно. 

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

Копируйте чужое (aka Ищите лучшие практики)

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

Не стесняйтесь копировать. Всё равно то, что вы будете делать, будет нести на себе отпечаток вашей личности. Даже если вы будете пытаться скопировать чужой текст, вы неизбежно привнесёте в него что-то своё. 

Кстати, если вы задумались о написании своей редполитики, не стесняйтесь посмотреть гайд по UX-текстам от Ozon и скопировать то, что вам подошло. 

Разберём на примере

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

Вот мой текст (вы уже видели его выше). Он написан просто и без лишних описаний. Но я-то интерфейсница, написала, как привыкла. 

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

И ещё версия на ту же тему. Здесь человек пишет совершенно по-другому, призывает к рациональному. Можно представить, как человек взял окурок, упаковал в пакетик, сфотографировал, разместил на объявлении, которое распечатал на цветном принтере. 

Пишите по структуре

Во всём, что мы пишем, можно выделить структуру. Например, когда вы отправляете сообщение другу в телеграме, вы наверняка начинаете с приветствия, а потом уже переходите к сути — задаёте вопрос или что-то сообщаете. В электронном письме для коллег структура посложнее: там будет приветствие, затем тело письма сообщения, а ниже автоматическая подпись. 

Можно также выделить структуру и на уровне смыслов. Например, всем знакомый «бутерброд» для подачи обратной связи имеет следующую структуру: сначала похвалить, затем рассказать, что нужно исправить, в конце завершить похвалой-поддержкой.

Если вы разберёте любой текст на такие структурные единицы, вам будет просто собрать из них итоговый результат — как будто это просто конструктор. 

Разберём на примере

Чтобы выделить структуру объявления, погуглите объявления на эту же тему. 

Перед вами два объявления из первой выдачи, они довольно типичные. Можно попробовать выделить в них общую структуру.

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

Тексты совершенно разные, но написаны по одной структуре: кричащий заголовок, просьба, лёгкая угроза (в разной степени завуалированности). Если посмотреть другие объявления на эту тему, то они будут очень похожими. 

Теперь посмотрим, соответствует ли этой структуре наш текст. Вот заголовок, вот тело с просьбой. Кажется, даже угроза присутствует — опасность пожара. 

Не забывай свои корни

Этот метод не только напоминает нам, что есть вещи на порядок выше, но и о том, чем мы занимались до момента, когда сели писать текст. У каждого из нас есть бэкграунд, хобби, привычки, профессия. Так что смело используйте всё это и при написании текста. 

Например, писали в школе статьи — круто, вспоминайте, чему там научились, применяйте в тексте. Вы разработчик — прекрасно, значит у вас всё хорошо с аналитическим мышлением и вы можете сделать текст очень структурированным, например, с буллитным списком. Вы дизайнер — супер, используйте визуальное повествование, дополняйте ваш текст вёрсткой и изображениями! 

Разберём на примере

Автор этого объявления применил визуальное повествование — добавил к обычному тексту картинку. И вот уже объявление стало заметнее и даже передаёт эмоцию. Это маленький штрих, который позволяет значительно повлиять на результат. 

Самое важное при написании текста

• Помните: на базовом уровне тексты умеют писать все, и вы не исключение. Если вы вынуждены писать тексты, но не являетесь пишущим специалистом, просто напишите, как думаете. Самое главное — передать смысл.

• Не пытайтесь имитировать чужой стиль или писать так, как вы «должны» писать в этом случае. Пишите, как говорите в реальной жизни. Это придаст уникальности вашим текстам. 

• Не знаете, с чего начать? Всегда начинайте с самой сути. Есть такой копирайтерский приём. Нужно написать на листе «Короче…», и тогда текст польётся сам собой. 

• Всегда пишите текст сразу на формате, не пишите в гугл-доках. Делаете пост для соцсети — пишите в закрытой тестовой группе. Пишете для интерфейса — укладывайте текст сразу в блок формата в Figma. Это поможет вам почувствовать размеры текста и избежать ситуации, когда что-то надо сильно сокращать.

• Не забудьте проверить свой текст в конце. Можно прогнать его через чат-ботов, просто попросить отредактировать. Или проверить через сервис Главреда — он посоветует, как избавить текст от словесного мусора и улучшить его.

На этом всё! Спасибо, что прочитали. Надеюсь, вы узнали для себя много интересного про UX-редактуру 💙

Сохраняйте себе другие полезные материалы Ozon для дизайнеров, подписывайтесь на мой канал «Спросите Киру» и на коллективный телеграм-канал Ozon Design. 

Кредитсы:

Андрей Калимулин — съёмка и монтаж видеороликов

Светлана Валитова — редактура и помощь с двумя уроками 

Дарья Филичкина — дизайн визуальных примеров

Все товары из видео покупались на Ozon. Ни один селлер не пострадал 🙂