Код-ревью Middle Мобильные паттерны обновлено
Ревью мобильного экрана
Вопрос
Описан экран корзины в мобильном приложении. Найдите проблемы.
1. Шапка: слева логотип, справа иконка «назад» 20 × 20 pt
2. Список товаров: удаление только свайпом влево, кнопки удаления нет
3. Кнопки «−» и «+» количества 28 × 28 pt, вплотную друг к другу
4. Поле промокода: при фокусе клавиатура закрывает поле и кнопку «Применить»
5. Итог и кнопка «Оформить» в самом верху экрана над списком
6. Кнопка «Оформить» прижата к нижнему краю под индикатор «домой»
Коротко
Мобильный экран проверяют по чек-листу платформы: размеры целей, системные жесты и safe area, видимые альтернативы скрытым жестам, поведение клавиатуры и зона большого пальца для главных действий.
Что должен найти ревьюер
- Ошибкастрока 1Кнопка «назад» справа и 20 pt: на iOS назад ожидается слева, а размер меньше 44 × 44 pt.
- Ошибкастрока 2Удаление только скрытым жестом: многие его не найдут. Нужна видимая альтернатива (кнопка, удаление через «−» до нуля).
- Ошибкастрока 3Цели 28 pt вплотную: частые промахи. Минимум 44 pt или отступы между целями.
- Ошибкастрока 4Клавиатура перекрывает поле ввода: контент должен прокручиваться, чтобы поле и кнопка оставались видимыми.
- Стильстрока 5Главное действие наверху вне зоны большого пальца, а после длинного списка человек внизу. Итог и кнопку закрепляют внизу.
- Ошибкастрока 6Кнопка в зоне системного жеста: нужно учитывать safe area.
Разбор
Мобильный экран проверяют по чек-листу платформы: размеры целей, системные жесты и safe area, видимые альтернативы скрытым жестам, поведение клавиатуры и зона большого пальца для главных действий.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.