​#UI #UX

10 Android UI/UX Tips & Tricks от Gaurav

Советы по UI/UX для вашего приложения:
1️⃣ Не забывайте о эффект при нажатии на элементы UI Используйте ?android:attr:selectableItemBackground для получения Drawable из темы для фона кнопки, которая корректно показывает нажатие.

2️⃣ Используйте стандартные компоненты View и стилизацию их из темы
Этот позволяет всем вашим виджетам выглядеть консистентно платформе. Для кастомизации цветов используйте tint.

3️⃣ Тень под компонентами

4️⃣ Используйте tools:parentTag в <merge>
Это позволяет LayoutEditor понимать как отображать ваш UI в предпросмотре.

5️⃣ Отложенные парсинг layout XML с помощью ViewStub
Если часть вашего UI показывается опционально, то не стоит ее парсить сразу и делать, visibility="gone". Используйте ViewStub. Подробнее модно почитать здесь.

6️⃣ Старайтесь не использовать фиксированные разрешения
Фиксированные разрешения должны использоваться только в редких случаях когда вы знаете что размер должен быть строго такой и не может быть гибким. Например, ImageView с аватаром пользователя имеет размер 48x48dp. Просите дизайнера делать дизайн под большие и маленькие устройства, либо комментировать как должны адаптироваться элементы.

7️⃣ Размер текста: dp или sp?
Извечная дилемма. Я выбираю sp так как это делает приложение более удобным, потому что позволяет менять размер текста пользователем и приятно работать.

8️⃣ Используйте анимации при переходах
Наличие анимации позволяет пользователю понимать какой происходит переход и упрощает понимание работы приложения. Современный Android имеет множество средств и упрощений для работы с анимацией. Ждем Navigation и CoordinatorLayout, чтобы упростить это еще больше!

Также рекомендую освежать в памяти и почитывать гайды по Material Design. В них можно найти много полезного и вдохновится идеями для вашего приложения.

#UX

UX для недизайнеров, или что должен учитывать разработчик мобильных приложений

UX - это забота не только дизайнеров, менеджера продукта и UX-эксперта, а также задача разработчика знать базовые вещи, которые он не должен допустить, а именно:
⚠️ Маленькая область нажатия - должна быть не меньше 48 dp по ширине и высоте для кликабильного элемента
⚠️ Отсутствие реакции на нажатие - view должен меняться при нажатии: смена фона, ripple эффект и другие
⚠️ Реакция когда не надо - например на элементах, клики на которых не приводят к каким либо действия
⚠️ Не учитывается что экраны могут быть маленькими
⚠️ Клавиатура не появляется/скрывается автоматически
⚠️ Отсутствие информация о выполнении операции (напр, показ прогресса)

В статье разбирается множество других проблем, которое разработчик должен не допускать при реализации дизайна

Нашли кейсы которых нет в статье или страдаете от них как пользователь - пишите в @android_broadcast_talks

#UI #UX #Дизайн

Сага о мобильном дизайне, часть 2

В статье разбираются, хоть и известные для любого, кто близок к UI/UX, вещи, но все равно полезные, чтобы напомнить еще раз:
👉 UI – это про внешний вид (цвета, шрифты, тени и т.д.). UX – это про опыт пользователя (как пользователь взаимодействует с приложением, насколько успешно и удобно выполняет целевой сценарий)
👉 Тап-зона должна быть достаточной для любых пальцев
👉 Важные кнопки, элементы управления нужно располагать в области досягаемости большого пальца. Много людей управляют смартфоном большим пальцем и держат смартфон одной рукой
👉 Внимание пользователей очень ограничено. Нужно фокусировать пользователя на главном, убирать информационный шум.
👉 У пользователей разных платформ есть разные привычки. Важно соблюдать гайдлайны плаформ.
Непривычный паттерн вызывает растерянность.
👉 Выработанные UI/UX практики чаще надежнее новых инновационных подходов