8 полезных советов по улучшению UX во Flutter

Ваше приложение может работать идеально — безумно быстро, без исключений, без ошибок, без сбоев — как и ожидалось. Но если вы не дадите пользователям удобный и полезный опыт, ваш продукт будет обычным приложением, а не потрясающим. Хуже того, пользователи могут быть недовольны опытом и со временем сойти с ума.
(Например, не закрывая клавиатуру после нажатия на кнопку поиска.)
Итак, давайте сделаем наши приложения выделяющимися!
1. Сделайте прокручиваемые виджеты всегда прокручиваемыми.
BouncingScrollPhysics — это здорово! Но если у нас недостаточно элементов, чтобы выйти за пределы представления, оно вообще не будет отскакивать. На самом деле это имеет смысл.
Но что, если мы хотим обновить список?
Чтобы создать эффект отскока/прокрутки независимо от размера элементов, мы должны использовать с ним AlwaysScrollableScrollPhysics .

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

3. Убедитесь, что текстовое поле видно.
Предположим, у нас есть форма и нам нужно проверить некоторые входные данные. Пользователь нажмет кнопку отправки, но подождите, кнопка не работает, потому что некоторые поля не проверены.
Пользователь может этого не понять, потому что в этот момент эти поля не видны на экране. Это может вызвать некоторые неудовлетворительные переживания.
Но не беспокойтесь, предотвратить это довольно просто! Тогда посмотрим как!

4. Сосредоточьтесь на следующем виджете при вводе или отправке.
Это довольно просто. Вы ввели свое имя и хотите перейти ко второму текстовому полю при вводе. Это ожидается от всех, и они тоже должны это получить!

Еще я заметил кое-что: многие используют для этого FocusNode. В FocusNode нет ничего плохого, но он нам и не нужен. Мы можем просто установить textInputAction, и поехали! Использование FocusNode — это дополнительный шаг, который нам не нужен.
5. Запомните положение прокрутки.
Предположим, что вы прокручивали страницу и щелкнули карточку, чтобы просмотреть подробности, или переключились на другую вкладку. Потом снова возвращаетесь к списку, но видите, что позиция обнулилась, и вам пришлось начинать заново! Какая катастрофа!

6. Нажмите еще раз, чтобы выйти.
Пользователи Android могут случайно нажать кнопку «Назад», находясь на главной странице, и приложение сразу перейдет в фоновый режим.
Будет ли это хорошим опытом для них?
Я оставлю вас с этим вопросом в покое и покажу вам, как вы можете легко предотвратить это!
(Извините за плохой пример, мне было лень переключаться на эмулятор Android, чтобы продемонстрировать случай с физической кнопкой «Назад».)

7. Не фокусируйтесь на прокрутке.
Мы набрали, мы ввели, и мы хотим, чтобы клавиатура оставила нас наедине с содержимым. Это все, что мы хотим! Пожалуйста, не жалейте его от нас!

8. Не фокусируйтесь на записи снаружи.
Если мы не хотим сводить пользователей с ума, мы также должны позволить им закрывать клавиатуру, когда они нажимают за пределами текстового поля.

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