Быстренько фотошоплю форму заказа. Тут чуть пододвинул, там перенёс, здесь убрал лишнее — и хоп, стало в полтора раза короче без ущерба для смысла
Участница курса спрашивает, как найти грань, после которой длинную форму пора переделать на пошаговую
Небольшой кусочек про то, как полю недостаёт контекста, чтобы выглядеть как поле. 1 минутка
В интерфейсе участницы курса была форма, в ней поля выбора адреса, а в нём — поле поиска. И она хотела, чтобы значение этого поля использовалось как часть общей формы...
Обсуждаем соотношения размеров полей и текста в них, а также расположение и вид главной кнопки формы
Разбираем интерфейс ввода адреса в форме. Получилось слишком сложно: от пользователя требуется огромная внимательность при заполнении
Участница поставила пару необязательных элементов формы под главную кнопку, да ещё и сказала, что «вынесла за скобку»
традицию контекстно дисейблить кнопку, и почему она теряет актуальность в формах всякого екомерса. 2 минутки
Показываю, как навести порядок в размерах полей в форме. Это есть у меня в книге «Пользовательский интерфейс», поэтому показываю прямо из неё
Разбираем многословные и не очень полезные сообщения об ошибке в форме регистрации. 3 минуты
Всё начинается с вопроса участницы о том, как быть с формами, где много обязательных и необязательных полей, как их обозначать
Обсуждаем дизайн формы: кирпичная кладка, расположение финальной кнопки, непоследовательность в изображении элементов
Разбираем форму из нескольких шагов. Там и про кирпичную кладку, и про лишние поля, и про пространственное-сценарное решение, и про правило 7 элементов
Рассказываю, почему не стоит ставить плейсхолдеры в каждое поле формы. Привожу аналогию с иконками возле каждого пункта меню
О том, что программисту неплохо было бы не просто формально выполнять требования из ТЗ, но ещё и стараться понимать, откуда такие требования возникли и с какой бизнес-задачей связаны
Такая вам мысль на ночь. Человек заполнил форму, нажал кнопку «Купить» или там «Пожаловаться». Но не заполнил какое-то обязательное поле
Радуюсь хорошей подписи поля «Комментарий для курьера». 1 минута
Разбираем дизайн формы. Во-первых, убираем центровку, чтобы стало выглядеть нормально. Во-вторых, наводим порядок со смыслом элементов управления
Комментирую дизайн. Элементы прыгают между соседними экранами. Кнопки кажутся задизейбленными. Непонятен сценарий регистрации
Участница курса сделала форму, но не даёт заполнять её поля в том порядке, в котором я хочу. Я объясняю, что так нельзя, даже если это и оправдано сценарием