Сначала сценарии, потом красота
Выпишите три-пять главных действий пользователя. Для магазина это найти товар, положить в корзину и оплатить через Click или Payme. Для записи в салон — выбрать услугу, время и подтвердить. Каждое такое действие должно достигаться с главного экрана за минимум касаний, а всё, что им не помогает, уходит на второй план.
Типичная ошибка — перенести структуру сайта в приложение один в один. На сайте человек читает и листает, в приложении он решает конкретную задачу и закрывает экран. Интерфейс должен вести к цели, а не показывать всё, что есть в компании.
Навигация и зона большого пальца
Если разделов от трёх до пяти и пользователь часто переключается между ними, хорошо работает нижняя панель вкладок. Боковое меню прячет разделы, поэтому оставьте его для второстепенного. Многие держат телефон одной рукой: низ и центр экрана достаются легко, верхние углы — с трудом.
- Главная кнопка действия стоит внизу, там, где достаёт большой палец.
- Редкие функции вроде настроек можно поднять в верхний угол.
- До важной функции не больше трёх уровней вложенности.
- Кнопка «назад» и системный жест Android ведут туда, куда ожидает человек.
- Кнопки достаточно крупные и не прижаты друг к другу: иначе пользователь будет промахиваться. Точные минимальные размеры касаемых областей смотрите в рекомендациях Apple и Google.
Формы: здесь теряется больше всего клиентов
Каждое поле в форме — повод закрыть приложение. Спрашивайте только то, без чего нельзя оформить заказ или запись. Остальное можно уточнить позже, когда человек уже получил результат.
- Подставляйте подходящую клавиатуру: цифровую для телефона, с символом @ для почты.
- Показывайте формат прямо в поле, например номер в виде +998.
- Подтягивайте код из SMS автоматически, где это возможно.
- Показывайте ошибку рядом с полем и сразу, а не после отправки всей формы.
- Сохраняйте введённое, если человек случайно вышел с экрана.
Состояния экрана, которые забывают нарисовать
Красивый макет обычно показывает экран с идеальными данными. В жизни у экрана есть и другие состояния, и именно их забытые версии всплывают после запуска.
Пустое состояние особенно важно для новых клиентов: если у человека ещё нет заказов, скажите об этом простыми словами и дайте кнопку, которая ведёт в каталог.
- Загрузка: скелетон или индикатор вместо белого экрана.
- Пусто: что сказать и куда направить.
- Ошибка: понятный текст без технических кодов и кнопка «Повторить».
- Нет сети: что доступно офлайн и как обновить данные.
- Частичные данные: очень длинные названия, товары без фото.
Тексты, два языка и доступность
Кнопки называйте действием: «Оформить заказ», а не «Далее». Узбекский текст нередко длиннее русского, поэтому проверяйте макеты на обоих языках, чтобы подписи не обрезались и не ломали сетку.
Заложите достаточный контраст текста и фона, поддержку увеличенного системного шрифта и не передавайте смысл одним цветом: статус «отклонено» — это и цвет, и слово. Если значение иконки неочевидно, добавьте подпись. Это особенно полезно на ярком солнце и на недорогих экранах.
Проверка на людях и интерфейс Telegram-бота
Дайте интерактивный прототип пяти людям из вашей аудитории и попросите выполнить главные задачи без подсказок. Смотрите, где они останавливаются и куда нажимают. Переделать прототип несравнимо дешевле, чем готовый код.
Те же принципы работают там, где полноценное приложение пока не нужно. Telegram-бот — это тоже интерфейс: кнопки, меню, сообщения об ошибках и пустые состояния. Для многих бизнесов в Узбекистане бот с каталогом, заявкой и оплатой через Click или Payme закрывает задачу быстрее и дешевле приложения, ведь клиенту не нужно ничего скачивать. Именно такие боты мы в markdev проектируем от сценария, а не от списка функций.
Перед передачей в разработку проверьте: нарисованы все состояния экранов, макеты проверены на двух языках, есть дизайн-система с цветами, шрифтами и компонентами, описаны переходы, учтены маленькие и большие экраны. Если у вас уже есть приложение или бот и вы подозреваете, что пользователи где-то спотыкаются, markdev может разобрать сценарии и предложить, что исправить в первую очередь.
Частые вопросы
С чего начать разработку интерфейса приложения?
С трёх-пяти главных сценариев пользователя и пути к ним от главного экрана. Только после этого рисуют стиль, иконки и анимации.
Нужно ли следовать гайдлайнам Apple и Google?
Это не догма, но они описывают ожидания людей: где искать кнопку назад, как выглядят переключатели и системные окна. Отступать от них стоит осознанно.
Сколько людей нужно для проверки прототипа?
Даже пять человек из целевой аудитории обычно показывают главные проблемы. Важно не подсказывать им и наблюдать, где они останавливаются.
Что выбрать: приложение или Telegram-бот?
Если клиентам достаточно каталога, заявки и оплаты, бот часто проще и быстрее, потому что не требует установки. Приложение оправдано, когда нужны сложные экраны, офлайн-режим или постоянное использование.
Разберём вашу задачу бесплатно
Оставьте контакт — за 15 минут созвона покажем, где теряются заявки и что сделать в первую очередь.