Кирилл Егерев - Этой кнопке нужен текст [O UX-писательстве коротко и понятно] [litres]

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

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

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

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

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

Атомарный дизайн – одна из тех штук, из-за которых я советую начинающим UX-писателям держаться поближе к дизайнерам и не увлекаться тем, что говорят и творят редакторы, копирайтеры и прочие подобные люди. Я сейчас о тех, которые пишут много чего, в том числе для интерфейсов, и любят хвалиться, как между реально стоящими делами могут «даже страницу 404 написать». Мало у кого из пишущих, тем более у таких, которые «между делом», вы научитесь систематизации и организации дизайнерского уровня.

Итак, атомы. Вот что интересного здесь есть для писателя:

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

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

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

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

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

Текст и кнопки образуют… много чего – подсказки, предупреждения, сообщения об ошибках. Такое универсальное сочетание помогает даже решать всякие юридические вопросы:

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

Чекбокс при кнопке, как в примере выше, теперь скорее не нужен – разве что юристы потребуют оставить именно двойное подтверждение. Ладно, бывает. Но вот оцените тотальную бессмысленность такой истории:

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

Правда, время от времени появляются, казалось бы, невозможные сочетания. Например, поле для ввода текста можно встроить в меню – в виде поля для ввода поискового запроса. Вот пункты меню, а вот поисковая строка. Не ждали? Смотрите, как хорошо они уживаются друг с другом.

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

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