И ещё 26 советов по созданию хорошего интерфейса

Последняя часть — мы перевели советы с сайта goodui.org. Прошлые выпуски: первая часть, вторая часть.

50. Давайте гарантию

qU4rrC5LXyQGmJ5k47N6sqXzUgx-lCQLH7RHUHKh

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

51. Визуально занижайте цену

EgO9jYrJHumYUjRwWPPD5r9qk8fua2Uez0GX6Lyv

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

Цены также можно разбивать. Например:»30 центов за страницу» вместо »30 долларов за книгу», или »1 доллар в день» вместо »30 долларов в месяц» за абонемент. Можно пользоваться и набившим оскомину приемом с ценой, заканчивающейся на -9- вместо какого-нибудь круглого числа. И, наконец, цену можно указывать с меньшим количеством цифр (не 30000 рублей, а 30 т.р.) для создания визуальной иллюзии.

52. Благодарите своих клиентов

a1RfHHj1M3HzpV-9359-P5Q13uaSUCeTd7MKSG20

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

53. Делайте вычисления за клиентов, не заставляйте их ломать голову

Dp-AP-obzANZfSvYqnJpnucD-Jq5FzaGk0xAWnTI

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

Вот только один пример: скажем, появляется сообщение, что доступные на счету средства почти израсходованы. Гораздо конструктивнее, когда в том же сообщении сказано, на сколько еще дней хватит оставшихся денег, прежде чем сервис станет недоступен. Или еще один пример, даже более простой и наглядный — это когда мы смотрим на многочисленные строки с данными и пытаемся определить, как давно были сделаны эти записи. В этом случае не самое точное »3 минуты назад» куда информативнее и проще для понимания, чем точное »16:37, 2 сентября». Вашим клиентам не нужна лишняя головная боль, не вынуждайте их заниматься подсчетами.

54. Давайте свободу выбора

A04OGibrNiJ2Wu7XbNmg3_qSn-Pmr-l281JJZP2n

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

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

55. Будьте непредсказуемы: пусть клиенты ждут ваших предложений

0weLXZoy3yHiYWnkR7yQHmlkaLv1GMSX1Iyrs7cI

Непредсказуемость — отличный способ подсадить клиентов на крючок. Когда мы (ну, или подопытные мыши) жмем на кнопку, а лакомство появляется вовсе не всегда, условный рефлекс вырабатывается с просто рекордной скоростью. Если аналогии с мышами вам неинтересны, тогда вспомните, какой захватывающей может быть проверка почты, если не знаешь, когда в ней появится что-то действительно «полезное».

56. Акцентируйте внимание

gNJXs_4f4bRE3PfCS1yUjWBnUfCi4QLgqvFLAmx0

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

57. Сделайте сопоставление удобным и простым

e0rUgbIGYdoXyMOyNiqEIwAUW5PwQ5dCYwLDx4-T

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

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

58. Предлагайте вещи в наборах, а не по отдельности

DAcOd5KjpAjvRZ19Lv2Cnf2cuJl2Plv5VC5Qrt1O

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

59. Поясняйте клиентам, чего им дальше ждать, а не оставляйте в подвешенном состоянии

h6GZYg8sQsW1KVj_gsMQm257fdOJaX2OupT_iw5O

Хорошо, когда людей держат в курсе дела. Не так уж сложно дать человеку знать, сколько ему осталось пройти до завершения задачи. Вы сделали шаг 1 на пути к X. Этот выбор приведет вас к Y. Перед Z вы что-то получите. Эти маленькие подсказки и обещания не просто информируют, но и выстраивают доверительные отношения. В противном же случае клиент так и будет бродить в потемках, и отношения с вашим сайтом сложатся несколько прохладными.

60. Не будьте так серьезны

IPDEiIArBM7KzUV_b5UUZ8pGZ3tibRuKJ5fUXP3o

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

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

61. Подтверждайте совершение действия, не молчите

xCmQQTQs1E8ABsSwfDX_GRumBeNXdagzB6qQt-zB

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

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

62. Постарайтесь предвосхитить желания клиента

44gUUtAPg3_PNt47dcSedFdXGILpuG7Z8z_0YFxm

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

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

63. Добавьте воздуха, не лепите всё друг на друга

XE8H7q8Gz_KOkUx3Ncbn0HNGNSLYlTWh0ci5dHpa

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

64. Используйте силу историй вместо сухого перечисления фактов

TZH_iDVwQNBLZCDbcaL9i2AJ5d4k-fZ_u6Rqd3po

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

65. Будьте честны

Q6GywMYeRaAE73RQHPGoxmN4WD1farcPjw89nie9

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

66. Убирайте ненужное

Vsh1LYyMVLpiGuEJO8kqp5LtQOSgc8v9CbWjLogL

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

67. Делайте упор не на себе, а на других

v0ae7kSVd0cgAWZq2icuBO9EhThSuAeQn_a_0Zhe

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

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

68. Давайте подсказки, не считайте, что всё очевидно

udi-ctEw6ecJnmCdMxcPDmo55c_qTR6Urc7vGutZ

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

69. Будьте кратки

FJLb1kIfkVuy_NVPEZAydU4ftFD914mFaLuyglP3

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

Посмотрите, как советует сокращать текст Максим Ильяхов.

70. Используйте адаптивную верстку

yfjetj3znpJHAxTlZDNSjE8ra3_yG4A12RtvuqBw

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

71. Будьте визуально выразительны

BZyPTchBWiMplGj1kwuJITBi3ykxSAGjjnyDWWy-

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

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

72. Добавьте возможность исправлений

I1rvwOYJja9N01RFGAdqUBwf37T9xj2zrfkXRoJ8

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

73. Добавьте возможность взять на себя социальные обязательства

Fjv-s5Wb_IYULDJElDxRaOtXUBh41uA8EnIlK-H8

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

74. Давайте возможность повторить действие

GBw4FxRP7YFUxws2sSRPoRhFW1YJVZFUbeKOqAJE

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

75. Ограничьте выбор несколькими вариантами

iVdKmORv_gyUosf9zvkN5AJmh4Ag65DS0_Zw7CIJ

Выбор не должен быть слишком большим. Чем больше выбор, тем сложнее принятие решения. И, что интересно, чем больше выбор, тем меньше удовлетворения, когда выбор наконец сделан: возрастают ожидания, появляются сожаления и желание отработать назад. Однако выбор должен быть обязательно (не забываем про свободу воли). Нужно просто ограничить его 3–4 позициями.

Полный текст статьи читайте на Нетология