Содержание
Хороший UI — это больше, чем просто красивая графика и стильные шрифты. Это касается всех «мелочей», которые являются составляющими качественного, профессионального и убедительного присутствия бренда в сети.
Речь идет о создании таких сайтов, в которых нуждаются пользователи. Тех, которые они будут просматривать и использовать с удовольствием. Так какие же хитрости UI можно использовать, чтобы значительно повысить процент конверсии на сайте? Давайте рассмотрим поближе:
Призыв к действию
Мы знаем, что вы подумали: «Опять про CTA? Ну сколько можно!»
Да, тема заезженная.
Тем не менее наличие большой кликабельной области с CTA порой является решающим фактором (особенно для тех сайтов, пользователи которых часто заходят со смартфонов).
В то время как большинство кнопок уже давно делаются графическими, всё еще есть сайты, на которых стоят маленькие текстовые ссылки, противоречащие принципам интуитивно понятного и удобного интерфейса.
Маленькие ссылки могут выглядеть мило и изящно на компьютере, но они заставляют пользователей щуриться и разочаровываться, когда они видят их на смартфоне.
И, если вы беспокоитесь о времени загрузки сайта, то можете поменять изображение сложной CSS кнопки на графическую копию, созданную с PureCSS.
PureCSS позволяет проектировать кнопки, используя CSS и дает возможность скопировать и вставить код,.
Сообщения об ошибках
Каким должно быть сообщение об ошибке?
Нас всегда и везде все учили делать дружественные сообщения об ошибках. Но зачем вообще этим заниматься, если лучше всего, в первую очередь, минимизировать вероятность появления этих ошибок. Как часто вы натыкаетесь на подобные сообщения?
Что мы имеем ввиду под «минимизацией вероятности появления ошибок»?
Например, если вы тестируете двусторонний интерфейс, который позволяет перелистывать страницы на подобие книги при помощи мышки, а пользователи нажимают на клавиши со стрелками вместо этого. Почему бы не дополнить возможности интерфейса, чтобы сделать эти все варианты действий выполнимыми?
Навигация может быть разной. Но пользовательские интерфейсы не должны наказывать нас за то, что мы изучаем их.
Поэтому вместо того, чтобы долго думать, как сделать сообщение об ошибке, лучше не оставляйте пользователю возможности натыкаться на них.
Постройте всё вокруг результата, а не нужд и потребностей
Как правило, внимание дизайнеров при проектировании интерфейсов сконцентрированы на таких вопросах как: «Чего хочет пользователь?» или «Что ему нужно?».
Просто поразительно, насколько это не верно!
Люди хотят результатов. И они хотят видеть, что они на правильном пути к достижению этих результатов.
Включите навигацию, пошагово демонстрирующие процесс достижения результата. Она позволит пользователю быстрее принимать решения и легко ориентироваться.
К сожалению, возможности дизайна не имеют отношения к конечному результату, который получает пользователь. Однако они способны заинтересовать и помочь добиться поставленной цели с минимальным разочарованием. Чем проще вы сделаете процесс, тем больше это оценит ваш пользователь и, вероятно, он будет возвращаться и рассказать своим друзьям о положительном опыте покупки.
Иконки – наше всё
Иконки помогают дать пользователям точку отсчета. Особенно при навигации сайта или при прокрутке и сканирование по странице. Эти маленькие идентифицируемые лакомые кусочки предназначены для информирования пользователя с первого взгляда, но иногда они могут принести больше вреда, чем пользы.
Иконка для сауны
Это может показаться скучным, но простые и незамысловатые иконки могут быть лучшим выбором. Особенно, если вы обслуживаете международную аудиторию, где более креативные иконки могут оказаться не всем понятными.
Что вы думаете это может означать? Безопасность? Награды? Мощность? Избранные? Ювелирные изделия?
Если вы собираетесь использовать какие-нибудь «эзотерические значки», не забудьте подписать их, чтобы не было никаких недоразумений. Помните, иконки должны использоваться в дополнение к вашей навигации, а не заменять её.
То же самое касается изображений…
Используйте слайдеры аккуратно
Слайдеры сейчас чрезвычайно популярны среди многих современных сайтов по нескольким причинам. Это модно. Они позволяют скомпоновать сразу много информации в верхней части страницы, а так же выделить ключевые моменты и сфокусироваться. Например, на акциях, скидках или специальных предложениях.
Но порой эти слайдеры так быстро меняются и в них вложено так много информации, что основная цель (привлечение внимания) теряется.
Найдите навигацию слайдера.
Вместо того, чтобы упрощать навигацию, сократите количество слайдов и сделайте тексты более лаконичными, чтобы донести основные идеи и главный посыл в нескольких словах.
И наконец, решите, есть ли смысл использовать слайдер или для вашей целевой аудитории больше подойдут статичные картинки. Возможно, имеет смысл запустить сплит-тест, чтобы определить, что лучше работает именно для вас.
Не забывайте о пробелах
Белое пространство — часто запоздалая мысль в дизайне пользовательского интерфейса.
Ведь для многих дизайнеров — это просто пространство экрана, которое должно быть заполнено. И, когда вы работаете с ограниченным пространством экрана (например, проектирование для мобильного), может быть довольно заманчиво заполнить его информацией максимально .
Белое пространство в сочетании с хорошими изображениями и коротким, но убедительным текстом действует намного лучше, чем попытки уместить все в небольшом, замкнутом пространстве.
Правильное использование белых пространства заставляет сфокусироваться на определённых визуальных элементах, заголовках, призывах и другие частях сайта.
Это делает сайт более открытым и доступным для восприятия. Именно то, чего мы хотим добиться!
А что вы думаете на эту тему?
Какие ещё хитрости интерфейса можно применить для того чтобы улучшить показатели конверсии? Поделитесь собственным опытом и дополните нашу статью своими комментариями.
Перевод и адаптация материала: kissmetrics.com
