Мобильное приложение для заказа цветов и подарков. Полный UX/UI-цикл: от анализа рынка до готового к разработке интерфейса.
Задача — сделать выбор и покупку букета простыми и приятными, включая сценарий, который не учитывают конкуренты: подбор букетов, безопасных для животных.
Анализ рынка
Изучила 2 компании-конкурента — Flowwow и 101-ROSE по UX-паттернам каталога, карточек товара и оформления заказа. Зафиксировала сильные и слабые стороны каждого: где навигация запутывает пользователя, где корзина неочевидна, где мелкие элементы мешают взаимодействию.
Главный вывод конкурентного анализа стал техническим заданием для собственного проекта: продумать навигацию так, чтобы пользователь не путался, дать возможность добавлять товар в избранное и корзину без лишних переходов, сделать интерфейс комфортным для пользователя.
Отправная точка проекта — конкретное наблюдение: ни один сервис доставки цветов не даёт возможность выбрать букет, безопасный для животных. Для владельцев кошек и собак это реальная проблема — многие популярные цветы токсичны для питомцев, а стандартный каталог об этом не предупреждает.
Целевая аудитория
На основе анализа целевой аудитории выделила три сегмента: мужчины-романтики, которые хотят выразить чувства через букет, эмпатичные девушки, подбирающие подарок под настроение и повод, и семейные люди, отмечающие праздники вместе. Это определило структуру каталога — навигация строится не только по типу цветов, но и по поводу и получателю.
Архитектура и User Flow
Спроектировала полную структуру приложения — 39 экранов, покрывающих вход и регистрацию, каталог с фильтрами, карточку товара, избранное, корзину, оформление заказа и профиль. Построила user flow с учётом обязательных и опциональных шагов (например, промокод или комментарий курьеру можно пропустить, не прерывая основной сценарий).
Особое внимание уделила пути от каталога до оформления заказа — минимизировала число обязательных действий, чтобы не потерять пользователя на середине пути.
User Flow имеет пять сценариев поведения пользователя
Вайрфреймы и итоговый результат
UI Design и дизайн-система
Собрала UI-Kit с нуля: цветовая палитра, типографика, переиспользуемые компоненты на автолэйауте и вариантах — карточки товара, кнопки, поля ввода, табы. Это позволило собирать новые экраны из готовых блоков и держать интерфейс визуально консистентным
Финальные экраны
Собрала интерфейс на основе дизайн-системы: от главного экрана до карточки товара. В каталоге навигация построена по поводу и категории одновременно, а не только по типу цветов — это решение выросло из анализа персон на втором этапе.
В фильтрах реализовала ключевую деталь, отвечающую исходной проблеме проекта: отдельный переключатель «безопасно для животных», который сразу отсекает букеты, небезопасные для питомца, не заставляя пользователя читать состав каждого товара. Эта же логика продолжается в карточке товара — там на фото букета стоит иконка-лапка, чтобы пользователь считывал безопасность визуально, не открывая описание. Сама карточка собрана так, чтобы решение о покупке принималось без лишних переходов: фото, цена, состав и отзывы — на одном экране.
Основные экраны подборок, которые позволяют облегчить пользователю выбор
Профиль пользователя
Карточка конкретного товара, фильтры и экран с примененными фильтрами
Хендофф и передача в разработку
Собрала полный путь пользователя от выбора букета до оформления заказа и профиля с историей покупок — 39 экранов сведены в единый прототип без разрывов в логике переходов. Компоненты организованы на автолэйауте и переменных, поэтому разработчик сможет менять контент и данные, не перестраивая макет вручную — это было заложено еще на этапе сборки дизайн-системы, а не добавлено в конце
Что бы сделала иначе: финальный экран я довела до продакшн-качества, но не подготовила отдельную спецификацию для разработчика — аннотации отступов, состояний компонентов, поведения при разных объёмах контента. В реальном проекте я бы закладывала документацию сразу после сборки UI-Kit, а не в конце: тогда хендофф — это выгрузка готового пакета, а не отдельная работа постфактум.