Лого vc.ru

Форма регистрации в мобильном интерфейсе: Как расположение кнопок влияет на её эффективность

Форма регистрации в мобильном интерфейсе: Как расположение кнопок влияет на её эффективность

Директор студии Samplar Антон Григорьев перевел для ЦП заметку UX Movement с рекомендациями по созданию формы для мобильных интерфейсов — где и как расположить кнопки, с какими проблемами может столкнуться пользователь в процессе заполнения и как их избежать.

Поделиться

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

Исследование показало, что пользователи часто не видят кнопок отправки формы и сохранения изменений, если они — на панели действий (action bar, navigation bar). Пользователи уходят, оставив изменения несохранёнными.

Неожиданное расположение

Они не замечают кнопок на панели действий, потому что смотрят в другое место. Заполняя форму, они двигаются сверху вниз.

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

Взгляд двигается по форме сверху вниз. Движение вверх — как возвращение назад. Это не то, чего пользователь ждёт. Это неправильное место для кнопки.

Закрепление

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

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

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

Непонятные кнопки сохранения

Из-за таких кнопок пользователи не сохраняют изменения. На панели действий есть «Назад», название страницы и кнопка «Сохранить». Последнюю опознать труднее всего.

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

Недостаточная ясность панели действий приводит к ошибкам.

Чиним кнопку сохранения

Вместо панели действий используйте закреплённую модальную форму. Пользователь получит понятные кнопки сохранения и отмены вместо непонятной кнопки «Назад».

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

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

Заключение

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

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

Популярные статьи
Показать еще
Комментарии отсортированы
как обычно по времени по популярности

Это все? Ради двух примеров высосали статью? Показали очевидные банальные вещи?

Директор насосал у ЦП, ЦП написало. Чо удивляться?
По факту, если продукт заебись— люди готовы заполнить 23 поля. На этом всё.

0

Выхлопа не хватило

0

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

0

На самом деле, для тех кто только начал проектировать интерфейсы и только начал изучать ui ux статья будет полезной.

0

Тема не раскрыта полностью

0

В продолжение темы - перевод статьи «A Checklist for Designing Mobile Input Fields»: uxtranslate.wordpress.com/2015/06/20/checklist-design-poley-vvoda-mobilnye/

0

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

Сейчас обсуждают
Volodymyr Fedorychak
WebExpert Lab

А затем смотрите трафик по Симиларвеб. По сайту-примеру, кстати, могу организовать размещение всего за 500 грн, при 1000+ трафика и с репостом на странице с 13k подписчиков в FB. Владелец - коллега по цеху ) Надеюсь, чем-то да помог :)

Длинная дистанция: как владелец SEO-студии учился работать с контент-маркетингом, и что из этого вышло
0
Volodymyr Fedorychak
WebExpert Lab

Самый простой пример:

Длинная дистанция: как владелец SEO-студии учился работать с контент-маркетингом, и что из этого вышло
0
Ron Bullet

ну - я русский, потому что российских русских, украинцев и белорусов считаю "русскими", в истинно-историческом значении этого слова. В каждой и этих стран своя деформация прошла, но тем не менее мы все русы.
А выборка ограничена не родным языком, а сферой и кругом общения. Если окружение вокруг европейское, то русские, возникающие в нем, сразу начинают выделяться на общем фоне, да вообще любой народ. В результате начинаешь копить какую-то статистику, она безличная: эти такие а вот эти такие, тд. Я здесь отметил только то, что я замечаю за русскими, просто скрыв то, что замечаю за остальными. И я теперь могу отмечать так же более точно и то, как мы ведем у себя дома.
Насчет мигрантов согласен, я и не забываю о всех остальных - просто за них я не отвечаю, их представителем не являюсь, в отличии от "русских". Если мы начнем больше обращать внимания на то, какими нас видят на самом деле (вместо того, чтобы молча минусовать тексты тех, кто это уже отметил) - то мы же сможем измениться в лучшую сторону, а ведь это же круто! Если русские действительно великий народ (а не только считают себя такими) - то и стиль у них должен быть соответствующий, более благородный. И низшие слои в этом плане надо жестко воспитывать кнутом и пряником, а не поить херовой водкой 100 лет и травить по лагерям интеллигенцию. Да короче)) Ранимый стал - за державу обидно)))

Жизнь в Риге глазами издателя «Медузы»: банки, услуги, жильё, язык и транспорт
0
Rustavel_edm

Держу один небольшой проект на таймвебе посещаемость до 100 человек в день - это мой первый хостер пользуюсь 6 месяцев.

1 - Нравится аккуратный лаконичный дизайн морды, все удобно, доступно, понятно.
2 - За пол года обращался раза 4 в техподдержку (время ответа в пределах 20-30 минут), три по пустякам и незнанию, один раз сайт лежал с утра до вечера. Намечались тех.работы оповестили, после них сайт лег, так и не понял, то ли по моей вине, то ли по вине таймвеба в поддержки сказали косяк с моей стороны, логи восстановить не удалось, что бы проверить достоверность инфы. Тем не менее помогли все восстановить и поднять сайт, спасибо поддержки.
3 - До этого читал другую статью на VC про TimeWeb был один негатив, отзывы вроде конструктивные, не фейковые, немного очково конечно стало. Теперь задумываюсь стоит ли выкатывать серьезный проект на хостинг.


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

ЗЫ: Посоветуйте еще хостеров! Желательно надежных где все стабильно!

Глава Timeweb Александр Бойков решил покинуть пост ради проектов в Кремниевой долине
0
Евгений Ткач

Странно, что насчёт стены ничего не слышно.

Дуров подтвердил планы Telegram добавить аудиозвонки в мессенджер
1
Показать еще