The Change

Я присоединился к проекту в качестве продуктового дизайнера, когда у него уже была аудитория в 2-3 тысячи пользователей и оборот около $1М в месяц

За год работы я выстроил дизайн-систему с нуля, переработал ключевые пользовательские сценарии, собрал брендбук и создавал визуалы для соцсетей с аудиторией 10 тысяч подписчиков.

Контекст

Когда я посмотрел фигму, которую мне дали, я увидел, что там не было ни одного компонента, а на экранах цветовая схема могла отличаться между собой. Одних только стилей текста я насчитал 465 шт

Это всё заметно тормозило процесс создания новых макетов и разработку, а каждый новый макет создавал еще больше хаоса. Продукт невозможно было масштабировать.

Ключевые сценарии, например, форма обмена, были неудобны для пользователей и негативно влияли на конверсию. Моей задачей было не просто обновить макеты, а решить эти проблемы системно. Создать дизайн-систему с нуля и переработать пользовательские пути, чтобы улучшить ключевые метрики продукта.

Как я работал

Чтобы найти точки роста, я начал с исследования:

• Проанализировал конкурентов (Binance P2P, Changelly, Garantex), чтобы понять лучшие практики рынка.

• Составил CJM (Customer Journey Map) для основных сценариев, что помогло выявить главные проблемы текущего интерфейса и найти идеи для новых фич.

Далее я приступил к созданию дизайн-системы. Разобрал существующие экраны на атомы (кнопки, поля ввода, карточки), настроил токены для темной темы и пересобрал ключевые макеты полностью на автолейаутах, чтобы добиться гибкости и адаптивности на разных экранах.

Результат

В результате получился не только более свежий визуал, но и более удобный для пользователей продукт.

В форме обмена теперь отображается актуальный курс и комиссии

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

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

Личный кабинет

Личный кабинет разбил его на несколько разных страниц (дашборд, история, партнерская программа), что упростило навигацию и добавление новых функций в будущем. Появились система лояльности, возможность сохранять кошельки, чтобы не вводить адрес каждый раз

Пустые состояния теперь сделаны с понятной инструкцией, что мотивирует пользователей к действию

Система сохраненных кошельков помогает пользователю не вводить каждый раз свой адрес.

Сделал Advanced Filters для более детального поиска в таблицах.

Для кабинета было создано более 60 макетов с темной темой, которая переключается в один клик. Это значительно ускорило работу.

Медиа

На основе существующей стилистики, я собрал брендбук. В нем были правила использования логотипа, шрифт, цветовая палитра, гайды по использованию иллюстраций и все материалы для партнеров.

Для соцсетей делал посты с кастомными 3D-иллюстрациями, которые делал в Blender - это дало узнаваемость и отстроило нас от конкурентов.

Мой опыт

Дизайн-система это не про красоту, а про скорость и деньги. Чем быстрее команда собирает интерфейсы, тем быстрее продукт растет.

Еще я освоил 3D (Blender), разобрался в механиках крипто-обменников и P2P-сделок.

Этот проект дал мне понимание, что значит отвечать за дизайн продукта целиком - от UI до постов в медиа.