Beefy.finance↗

Контекст

Больше тысячи волтов, более двух десятков сетей, 12 000 активных пользователей в месяц.

Весь продукт живёт на одном экране. Главная — это список волтов, и почти вся работа пользователя происходит здесь: он ищет, куда положить деньги, и решает, оправдывает ли доходность риск. По внутренней продуктовой оценке на поиск и анализ волтов уходит около двух третей пользовательского времени.

Это и определило приоритеты на полтора года: работа шла там, где пользователь проводит время, — в списке, фильтрах, поиске и карточке волта.

End-to-end дизайн продукта

Я был единственным дизайнером продукта и вёл дизайн end-to-end — от discovery и постановки задачи до ревью вёрстки. Работал напрямую с продакт-менеджером и двумя разработчиками, без дизайн-лида над собой. За полтора года через меня прошло около двадцати задач.

• Основные экраны продукта — список волтов, фильтры и поиск, карточка волта, дашборд, Treasury, навигация, меню сетей и активов;
• Новые функции — кросс-чейн ZAP и перенос депозита между волтами, beGEMS, Featured vaults, объединение CLM — пулов с концентрированной ликвидностью, карточка Safety Score, коннектор кошелька, страница подписи сообщения;
• Исследования — юзабилити-тестирование, интервью, конкурентный анализ; прототипы на переменных и условиях, тестирование в Maze;
• Дизайн-система — собрал с нуля: 202 семейства компонентов в 26 разделах. До этого её в продукте не было;
• Адаптивность и UI-полировка — до меня продукт жил на трёх брейкпоинтах; привёл интерфейс к тому, чтобы он занимал всё доступное пространство на любой диагонали, и стандартизировал отступы;
• Интерфейсная и промо-анимация в Rive — состояния кнопок во время долгих блокчейн-транзакций, микровзаимодействия, элементы промо-страниц;
• AI в рабочем процессе — с апреля 2026, на Claude Code: агенты для сбора данных и deep research по незнакомым областям продукта; доски в Notion, на которых устройство фичи собирается в разы быстрее; генерация ряда вариантов компонента по готовому наброску или вводным, чтобы нащупать дельное направление и довести до идеала;
• Дизайн-хендофф — онбординг разработчика в задачу, передача макета, dev. ревью после вёрстки; тикеты и решения в базе в Notion как общее состояние для меня, продакт-менеджера и разработчиков.

Типичный ход выполнения задачи:

• Исследование лейаута, требований, критериев успеха;
• Сбор референсов;
• Отрисовка сценариев использования;
• Согласование с продакт-менеджером;
• Dev. ревью.

Что об этом сказал разработчик.

Я спросил Eren, с которым мы прошли большинство задач: на чём, по его ощущению, держится дизайн-система и стало ли работать по макетам предсказуемее, чем с дизайнерами до меня.

“The design system was good, very organized and instructions were clear. Designs were clear, but sometimes you didn’t clarify all the changes, so some details get missed in the first interaction. But you always was open to talk and very active to solve any kind of questions I had. Compared to other designers I have worked with, it was better since we had a clear system.”

Eren

Разработчик Beefy

Фильтры, сортировка и поиск

Эти фичи разбираю подробно: по ним есть исследование с двумя волнами тестов, замеры и прямая речь пользователей. Остальные задачи шли тем же циклом, но без такого объёма данных и исследований.

Точка отсчёта

Ревью всего продукта было одной из первых задач: я собрал экраны всех флоу в Figma и расставил комментарии к каждой проблеме. Так я и погрузился в продукт — разобрался, как устроена экосистема: сети, платформы, типы волтов.

Фильтры, сортировка и поиск пришли позже. За самую нагруженную часть продукта я взялся уже с пониманием некоторых проблем — они лежали на доске, которую я завёл на ревью и пополнял всё время работы.

Сортировка и фильтры стоят над списком — и на десктопе, и на мобильном. При скролле они пропадают из вида первыми, и чтобы настроить выдачу, приходится возвращаться далеко наверх.

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

Буст, платформы и порог TVL — на втором уровне вложенности. Волты с бустом лежат внутри фильтров, список платформ — в самом низу той же панели. «Минимальный TVL» — порог по объёму средств в волте — сделан чекбоксом: сам порог лежит на следующем уровне и появляется только после включения, до этого не видно ни значения, ни того, что его можно задать.

Фича бустов на тот момент только появилась, и её оранжевый акцент не совпадал с палитрой продукта. Но дело было не только в бусте: цвет по всему продукту не был сведён в систему — я параллельно приводил его к единой логике и закреплял токенами дизайн-системы.

Юзабилити-исследования

За набор участников отвечал продакт-менеджер — связь с сообществом была на его стороне. Сообщество у продукта было своё: Discord-сервер примерно на десять тысяч участников. Под исследование он завёл канал #app-testing и роль Field Tester — вместо разового набора появился постоянный пул, людей можно было звать снова, не собирая заново. Тесты готовил и разбирал я.

Unmoderated usability testing. Участник проходил задания сам, когда ему удобно, без наблюдателя и без интервьюера рядом. Инструмент — Maze: он записывает каждый клик и мисклик, считает время на задание, строит хитмапы и собирает ответы на открытые вопросы. Это дало масштаб, недостижимый для модерируемых сессий: 52 и 46 участников вместо привычных пяти-восьми. Ценой стало то, что уточняющий вопрос по ходу задать некому — поэтому формулировки заданий и открытые вопросы после них пришлось продумывать особенно тщательно.

Дальше — две волны. В марте 2025 тестировали бусты, в апреле — фильтры и поиск, уже как проверку того, стал ли переработанный интерфейс понятнее.

Прототип был измерительным инструментом. Я собрал его на переменных и условиях: 88 переходов между экранами, поиск, работающий с настоящим списком из 27 токенов, и — главное — числовые счётчики. Прототип сам считал клики, повторы и фиксировал выполнение задания. Тестировался опыт, максимально близкий к живому продукту, а не последовательность картинок.

Результаты

Фильтры, 52 участника.

Задание	Успех	Отвал	Время	Мисклики*
Показать только стейблкоин-волты	23 из 35	12	43,5 с	74%
Показать CLM-пулы с бустом	19 из 29	10	26,2 с	60%
Показать BTC-correlated	20 из 27	7	27,2 с	73%
Вернуться к виду по умолчанию	25 из 26	1	6,4 с	46%

* Доля мисскликов завышена средой тестирования: часть участников открывала мобильный прототип на десктопе, где фрейм требует прокрутки, и это давало лишние клики. Соотношение между заданиями достоверно, абсолютные проценты — нет.

Удовлетворённость фильтрами — 4,1 из 5 (по 23 ответам из 52: шкалу показывали в конце, до неё дошли не все).

Бусты, 46 участников. Задача возникла из роста: раньше волтов с бустом было один-три, и их просто прикрепляли наверх списка. Потом стало пять-десять, а после запуска Profit Distribution — двадцать-тридцать одновременно. Приём, на котором держалась вся видимость бустов, перестал работать: прикрепить наверх тридцать позиций нельзя.

Задание	Успех	Отвал	Время	Мисклики*
Открыть волт с доступным бустом	46 из 46	0	12,1 с	42%
Открыть страницу со всеми бустами	39 из 43	4	12,1 с	63%
Забустить волт на выбор	39 из 41	2	38,4 с	40%

* Доля мисскликов завышена средой тестирования: часть участников открывала мобильный прототип на десктопе, где фрейм требует прокрутки, и это давало лишние клики.

Задания люди выполняли почти всегда, но удовлетворённость — 3,6 из 5, ниже, чем у фильтров. Люди находили нужное и всё равно оставались недовольны — значит проблема была не в навигации, а в самом устройстве действия.

Главное наблюдение — в разнице между двумя строками. Собрать фильтр стоило 43 секунды и трёх четвертей промахов. Отменить фильтр — шесть секунд и почти без ошибок. Цена сидела не в исправлении ошибки, а в самом составлении запроса. Значит работать надо было с порядком и доступностью контролов, а не с восстановлением после сбоя.

Анализ первых кликов показал, с чего люди реально начинают. Первым делом выбирают сеть и категорию актива — стейблкоины, blue chip, коррелированные. Вторым кликом — тип волта. И только потом доходят до доходности и платформы.

Интерфейс был устроен иначе. Первым в ряду стоял переключатель «Все / Сохранённые / Мои позиции» — то, чем пользуются реже всего. Выбор сети жил отдельным рядом иконок над фильтрами. А платформа и минимальный TVL были спрятаны внутрь дополнительного меню. Получалось, что частые действия требовали больше движений, чем редкие.

Что говорили сами пользователи:

• «Фильтр буста лежит не там, где остальные фильтры»
• «Меню и фильтры перегружают»
• «Слишком много разных кнопок и меню, чтобы добиться цели»
• «Хотелось бы сохранять наборы фильтров как пресеты»
• «Волты с очень низким TVL стоит прятать — списки слишком длинные»

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

Дизайн-решения и информационная архитектура

Каждое решение отвечает на конкретную находку.

Бусты вернулись в фильтр. Жалоба «буст лежит не там, где остальные фильтры» была самой повторяемой — контрол закрепили в видимой области фильтра.

Секцию фильтров закрепили. Она больше не уходит из зоны видимости при скролле — это была общая проблема десктопа и мобильного.

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

Фильтры раскрываются на текущей странице, а не в области со скроллом, положение которой пользователь не может предсказать.

На мобильном убрали аббревиатуры — в тесте их читали неправильно.

Добавили селектор Memes — отдельная категория, которую спрашивали пользователи.

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

Кросс-чейн ZAP и продуктовая модель

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

До этой функции пользователь, у которого актив лежит в одной сети, а нужный волт живёт в другой, должен был проделать пять шагов: понять, в какой сети волт, понять, где его собственный актив, перевести активы через бридж — мост между сетями, — заплатить газ, вернуться и внести депозит. Каждый шаг — точка отвала. При этом люди вкладывают то, что у них уже есть, а не то, что удобнее протоколу: если волт в Arbitrum, а деньги в Ethereum, никто не будет бриджить ради пробного депозита.

Решение здесь — порядок мышления. Интерфейс задавал его как «сеть волта → какие токены допустимы». Я развернул: сначала токен, который у пользователя есть, потом сеть, потом волт. Это не косметика — так интерфейс подтверждает, что подстроился под пользователя, а не наоборот.

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

Эта задача — показательный пример цикла целиком. Исследование существующего лейаута и сравнение с конкурентами, отдельная страница референсов, затем сценарии использования, разложенные по состояниям: уведомления, анимация ожидания и предельный вариант, когда нужно показать всё сразу. И dev. ревью в конце. Отдельная страница на каждое состояние — не бюрократия: именно на этом этапе выясняется, что фича должна уметь.

Продукт под давлением рынка

Этот раздел — моя реконструкция того, что происходило с продуктом и как команда на это отвечала.

В апреле 2026 Binance объявила делистинг BIFI — токена проекта. Формальная причина биржи: низкий объём торгов. За сутки после анонса токен потерял треть стоимости, к моменту остановки торгов 23 апреля — около двух третей от значения начала месяца.

Для продукта это означало не только падение цены. Уходила ликвидность, а вместе с ней и доверие: пользователю становится дороже входить, выходить и перекладываться между стратегиями.

Ответ команды был продуктовым, а не маркетинговым — снизить трение там, где пользователь платит за каждое движение. Появились новые типы волтов и перенос позиции: депозит переезжает из одного волта в другой одним действием, без конвертации всей суммы в промежуточный актив. Меньше шагов, меньше комиссии, короче путь до нужной стратегии.

Хронология работ это подтверждает: Vault to Vault ZAP пошёл в работу через четыре дня после анонса делистинга, следом — кампания Free ZAP и объединение CLM.

Границы этой работы

Оба исследования проводились на мобильном прототипе. Десктоп вышел на тех же дизайн-решениях, но отдельного раунда проверки с пользователями не проходил.

Что дальше

Самый сильный невзятый инсайт — просьба объединить депозит и буст в одно действие. Восемь независимых упоминаний в одном исследовании — это не пожелание, а дефект продуктовой модели: пользователь платит двумя транзакциями за то, что воспринимает как одно намерение.

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

И третье — измерение. Критерии успеха были сформулированы до редизайна: значимый рост депозитов в волты с бустом и рост click-rate контрола. Данных после релиза у меня нет, но база для их снятия готова — критерии заданы заранее, а не подобраны задним числом.