E-commerce

Social network

Fashion

iOS

Mobile App

Сервис для поиска и покупки одежды

Mina — нативное iOS-приложение на стыке e-commerce и социальной сети для любителей моды. Я присоединилась к команде в качестве UI/UX дизайнера, когда у проекта уже были готовы базовая дизайн-система, исследования и ключевые разделы

Моей задачей стала детальная проработка 3х флоу чата со стилистом

Портфолио

Mina

Задачи проекта

Скрестить E-commerce и Соцсеть: создать гибридный интерфейс, где покупка вещей является естественным продолжением просмотра контента
Сократить путь до покупки: разработать бесшовный переход от понравившегося на фотографии образа к оформлению заказа конкретных вещей
Повысить средний чек: стимулировать покупку не отдельных вещей, а готовых капсул и стилистических образов

Скрестить E-commerce и Соцсеть: создать гибридный интерфейс, где покупка вещей является естественным продолжением просмотра контента
Сократить путь до покупки: разработать бесшовный переход от понравившегося на фотографии образа к оформлению заказа конкретных вещей
Повысить средний чек: стимулировать покупку не отдельных вещей, а готовых капсул и стилистических образов

Скрестить E-commerce и Соцсеть: создать гибридный интерфейс, где покупка вещей является естественным продолжением просмотра контента
Сократить путь до покупки: разработать бесшовный переход от понравившегося на фотографии образа к оформлению заказа конкретных вещей
Повысить средний чек: стимулировать покупку не отдельных вещей, а готовых капсул и стилистических образов

Мои задачи

Интеграция в готовую экосистему: проектирование новых фич строго в рамках существующего UI-кита без нарушения общей дизайн-системы приложения

Автоматизация стилистических советов: разработка интерфейса чата со стилистом и его визуал

Интеграция в готовую экосистему: проектирование новых фич строго в рамках существующего UI-кита без нарушения общей дизайн-системы приложения

Автоматизация стилистических советов: разработка интерфейса чата со стилистом и его визуал

Интеграция в готовую экосистему: проектирование новых фич строго в рамках существующего UI-кита без нарушения общей дизайн-системы приложения

Автоматизация стилистических советов: разработка интерфейса чата со стилистом и его визуал

Проблемы с которыми столкнулась

Первый опыт в проектировании чат-бота: не было до конца понимания как можно отображать элементы в диалоге

Англоязычный интерфейс: продукт разрабатывался полностью на английском языке. На старте требовалось дополнительное время на перевод терминологии и соблюдение Tone of Voice

Первый опыт в проектировании чат-бота: не было до конца понимания как можно отображать элементы в диалоге

Англоязычный интерфейс: продукт разрабатывался полностью на английском языке. На старте требовалось дополнительное время на перевод терминологии и соблюдение Tone of Voice

Первый опыт в проектировании чат-бота: не было до конца понимания как можно отображать элементы в диалоге

Англоязычный интерфейс: продукт разрабатывался полностью на английском языке. На старте требовалось дополнительное время на перевод терминологии и соблюдение Tone of Voice

Как решала проблемы

Анализ паттернов: изучила лучшие практики реализации чат-ботов у крупных компаний. Переняла опыт и логику отображения элементов в чате у них

Адаптация к языку: выучила ключевые термины на английском и со временем темп работы увеличился

Анализ паттернов: изучила лучшие практики реализации чат-ботов у крупных компаний. Переняла опыт и логику отображения элементов в чате у них

Адаптация к языку: выучила ключевые термины на английском и со временем темп работы увеличился

Анализ паттернов: изучила лучшие практики реализации чат-ботов у крупных компаний. Переняла опыт и логику отображения элементов в чате у них

Адаптация к языку: выучила ключевые термины на английском и со временем темп работы увеличился

Реализация проекта и UX/UI решения

Я спроектировала информационную архитектуру и детально проработала 3 ключевых пользовательских флоу. Для каждого сценария был создан интерактивный прототип

1. Флоу «Управление гардеробом»

На стартовом экране чата со стилистом, пользователь выбрает раздел, который ему нужен. От того, что выбрал пользователь и будет развиваться дальнейший сценарий диалога. Также можно и просто написать сообщением стилисту

Посмотреть прототип

2. Флоу «Советы по стилю»

Стилист предлагает выбрать необходимые элементы (верх, низ, аксессуары и т.д.) и доп.параметры. Если предложенный образ не подошел, пользователь может точечно заменять элементы (верх/низ), не выходя из контекста переписки

Посмотреть прототип

3. Флоу «Подобрать вещь»

Стилист запрашивает параметры и выдает персонализированную подборку товаров. Пользователь может в один тап добавить вещи из чата в общую корзину или мгновенно заменить не понравившуюся вещь на альтернативную

Посмотреть прототип

Результат

Бесшовно интегрировала новые модули в существующее приложение, сохранив целостность дизайн-системы

Спроектировано 4 комплексных флоу: от сценариев чат-бота до игровых механик голосования в конкурсах
Созданы кликабельные прототипы: что позволило команде продемонстрировать и протестировать сценарии

Бесшовно интегрировала новые модули в существующее приложение, сохранив целостность дизайн-системы

Спроектировано 4 комплексных флоу: от сценариев чат-бота до игровых механик голосования в конкурсах
Созданы кликабельные прототипы: что позволило команде продемонстрировать и протестировать сценарии