Еще один перевод статьи A List Apart. На этот раз речь идет о случайном выходе из программы без сохранения документа. Можно познакомиться с точкой зрения автора. Для свободно владеющих английским могу предложить оригинал статьи.

Никогда не используй предупреждения, а используй undo . Автор статьи – Аза Раскин.

Случалось ли вам ощущать внезапную слабость, когда вы осознавали – всего лишь на долю секунды позже – что не должны были кликать «ОК» в диалоговом окне «Вы уверены, что хотите выйти?»

Да? Что ж, вы в приятной компании – у каждого есть подобный опыт, поэтому нет необходимости стыдиться этого. Это не ваша ошибка – это ошибка вашего программного обеспечения.

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

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

Появление привычки, на самом деле, хорошо: это избавляет от необходимости задумываться, когда мы встречаем банальный интерфейс, и это уменьшает вероятность, что наша мысль будет потеряна. В случае с диалоговым окном «Вы уверены, что хотите выйти?» наши руки запомнили и закрытие, и подтверждение как единое непрерываемое действие. И это хорошо, потому что в большинстве случаев мы не хотим задаваться вопросом, правильно ли мы делаем. К сожалению, наши привычки иногда заставляют нас ошибаться: мы сначала делаем, а потом задумываемся.

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

Возможные решения

Как насчет того, чтобы делать предупреждения, которые труднее игнорировать? Слишком ненавязчивое предупреждение не будут замечать, так давайте выведем все возможные предупреждения: мы заставим мигать экран и громко проиграем продолжительный звук, чтобы обратить внимание пользователя. Проверьте – это не будет работать. Чем более назойливы предупреждения, тем скорее нам их хочется прервать (кликнув «ОК»), и тем больше ошибок мы наделаем. На самом деле, не важно, на сколько назойливо компьютер станет предупреждать нас – мы по-прежнему будем совершать ту же ошибку – кликать «ОК» даже тогда, когда не хотим этого делать. Но это опять не наша ошибка: до тех пор, пока у нас есть возможность привыкать к предупреждениям, мы будем привыкать, а затем будем совершать ошибки.

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

Этот подход совсем не новый: это нечто вроде «такое-то слово в этом предложение является правильным ответом». В игре «Guild Wars», например, для удаления персонажа требуется сначала кликнуть «Delete», а затем ввести имя персонажа в качестве подтверждения. К сожалению, и это не всегда работает. А именно:

1. Это заставляет нас концентрироваться на непривычной для рук работе, но не на желании или нежелании прекратить работу. Это значит, что предупреждения, которые невозможно игнорировать, несколько лучше, чем обычные предупреждения: мы обязательно перестанем случайно прекращать нашу работу. А неуправляемое прекращение работы – худший грех программного обеспечения.
2. Это необыкновенно раздражает, потому что постоянно требует нашего внимания, что, в свою очередь, обязательно отвлекает нас от работы (а это второй грех программного обеспечения).
3. Это всегда отнимает больше времени и сил, нежели обычное предупреждение. Таким образом, совершается третий страшный грех – приходится делать больше, чем необходимо.

Для приведенных в примере «Guild Wars» второй и третий пункты не особенно уместны, потому что удаление персонажа – действие редкое. Однако если бы нам пришлось вводить имя документа перед тем, как выйти без сохранения этого документа, мы нашли бы это весьма неудобным.

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

«Undo» спасет мир

Простое исчезновение предупреждений не спасет наши документы от опасности быть потерянными, но использование функции «Undo» сможет это сделать. Позвольте мне повторить: лекарство от наших горе-предупреждений – undo. С правильным undo мы сможем завершать нашу работу и оставаться уверенными, что к ней всегда можно будет вернуться. С undo мы потеряем это ужасное ощущение совершенной только что ошибки, так как документ можно снова открыть.

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

Это одно из основных и наиболее важных заклинаний проектировщика интерфейса: никогда не используй предупреждения, а используй undo.

Разработчики Google Mail используют это заклинание. Когда вы удаляете письмо, у вас сразу же появляется возможность отменить действие. Как предусмотрительно! Нас аккуратно избавили от окошка с предупреждением (равно как и от окошка с сообщением о возможности отмены действия). Когда мы совершаем ошибку (а мы обязательно совершаем), она не слишком нас пугает, потому что мы можем просто отменить ее. С undo мы меньше тратим времени на переживания и больше времени на работу.

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

Увы, Google Calendar этот урок пока не уяснил. И, естественно, я случайно удаляю события, которое удалять не хочу. Иногда я удаляю ненужные события, и самое плохое, что позже я не уверен, что удалил действительно ненужное. И без undo нет возможности убедиться в правильности действий.

На самом деле, даже Google Mail еще не до конца освоил этот урок. Когда вы удаляете ярлыки из Gmail, выскакивает одно из этих несчастных предупреждений. Почему же Google может сделать всё правильно в одном месте, а в паре кликах от него сделать всё совершенно неправильно? Возможно, потому, что привычка к предупреждениям настолько закоренелая, что она с героическими усилиями вылезает наружу. Даже те компании, что являются основными оплотами хорошего дизайна, например 37Signals, также обманываются:

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

Заключение

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

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

Иллюстрация Кевина Корнелла

Translated with the permission of A List Apart Magazine and the author. Переведено с разрешения A List Apart Magazine и автора.

Решил начать блог с публикации этого перевода. Не особенно он удачен местами (точнее, он сохранил признаки оригинала, хотя и не дословен, но мне все-таки не нравится местами), однако нужно его куда-то «приткнуть».

Представляет перевод собой материал с небезызвестного A List Apart, а если быть точным – вот это.

Сила - в »воздухе» (1) . Статья Марка Болтона

Моя первая работа в качестве дизайнера была связана с небольшим полиграфическим агентством в Манчестере, которое сотрудничало с различными печатными средствами массовой информации: дизайн обложки, верстка материалов, маркетинговые ходы и… прямая почтовая рассылка (2). Когда я работал над этой рассылкой, обратил внимание, что изучаемые в колледже принципы дизайна, здесь почти не используются – большой, жирный и плотный текст был самым популярным решением. По словам одного из клиентов, я их никогда не забуду – «воздух – это просто пустота».

Заказчики прямой почтовой рассылки ориентировались в первую очередь на рынок небогатых потребителей (3), потому как здесь зафиксированы основные продажи. А раз продажи высоки, неужели воздух действительно просто пустота?

Что такое «воздух»?
«Воздух» или «пустое место» – это пространство между некими элементами композиции. В частности, пространство между основными, крупными элементами – «макро воздух»

И соответственно, «микро воздух» – пустоты между деталями: пунктами списков, надписями, изображениями или между словами и буквами.

«Микро воздух» и читабельность.
Несколько месяцев назад мне удалось познакомиться с работой Эрика Спикерманна во время его лекции. Кроме прочего, речь шла об оптимизации верстки газеты «The Economist», которая была обусловлена нареканиями со стороны читателей относительно возникающих при чтении трудностей.

Материалы на полосе располагались слишком плотно. Иногда, как и в веб-дизайне, трудно добавить «воздух», если его появление ничем не мотивировано. Газетам часто приходится сталкиваться с необходимостью перехода на более легкий для чтения шрифт вкупе с микро воздухом между строками и буквами. Разговор об этом стал частью лекции Спикерманна.

Для начала, оставив причудливость оригинального шрифта «The Economist», Спикерманн внес небольшие изменения, добавив воздуха между символами. Затем он уменьшил кегль и увеличил интерлиньяж (4). Все эти изменения на микро уровне добавили воздух в материалы полосы. Работа была тонкая: читабельность увеличилась, общее восприятие блоков упростилось, а количество информации осталось прежним.

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

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

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

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

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

Когда пробел ведет читателя от одного элемента к другому – это называется «активный воздух». Рассмотрим пример:

Всё очень плотно. Нам необходимо добавить воздух для создания визуальной гармонии и комфорта для читателя. Во-первых, я добавляю поля, меняю шрифт и его размер, а также увеличиваю межстрочные интервалы (line-height в CSS). Всё это «пассивный воздух».

Кто-то может возразить, что на «пассивный воздух» можно не обращать внимания, что он не играет роли. Я не соглашусь: если вы не работаете со своим «воздухом», значит вы плохой дизайнер. «Пассивный воздух» создает иллюзию свободы и равновесия. Это важно.

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

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

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

Рудер был типографом-печатником, швейцарцем по национальности. Он умер в 1970 году. После 21-летней практики преподавания, он подготовил и выпустил книгу – «Typography: A Design Manual» (5) , где пишет:

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

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

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

(1) Я использовал при переводе газетный термин «воздух». Он наиболее точен. Воздухом называется пустое пространство на газетной полосе.
(2) Direct mail – метод маркетинга, при котором компании рассылают рекламные материалы и образцы своей продукции потенциальным покупателям.
(3) Down-market – рынок товаров для небогатых покупателей, предпочитающих покупать товары по низким или сниженным ценам.
(4) Кегль – размер шрифта. Интерлиньяж – межстрочный интервал.
(5) Книга заявлена на Озоне, но там не бывает – заказывайте и ждите. Печаталась в СССР двадцать пять лет назад: http://www.ozon.ru/context/detail/id/2676535/

Иллюстрации Кевина Корнелла

Translated with the permission of A List Apart Magazine and the author. Переведено с разрешения A List Apart Magazine и автора.