История клиента · John Pavulon

«То, на что раньше уходила неделя, теперь занимает пару вечеров.»

John точно знал, каким должен ощущаться BarthMoney. OpenDesign за секунды выдавал визуальные решения продакшн-уровня — и отшлифованный, рабочий интерфейс, который можно было забрать в код.

За минуты
цельное визуальное направление, от которого можно оттолкнуться
60–70%
меньше времени на прототипирование UI
За считаные дни
перенести основное UI-направление во Flutter
После работы

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

John занимается креативным направлением и визуальными системами, а не разработкой на полную ставку. После основной работы он направляет это визуальное чутьё на собственные практичные приложения. Поэтому каждый час на счету.

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

John знал: интерфейсу нужно то, что он называет «душой». Стеной оказалось превращение этого направления в цельный и собираемый мобильный UI. Чистый холст в Figma или UI, написанный прямо в коде, способны съесть целые вечера на цвета, отступы и выравнивание — а сам продукт при этом не сдвинется.

Смотреть на чистый холст в Figma или писать UI-разметку с нуля в коде — это бесконечно долго, когда работаешь один после основной работы.
John Pavulon · соло-разработчик
Первый прорыв

Один промпт стал визуальным языком, на котором можно было строить.

John начал с ощущения и назначения экрана: «современная тёмная панель расходов с разбивкой по категориям». Получилась не просто красивая панель. Здесь определились тёмные поверхности, золотые акценты, иерархия сумм и два разных пути ввода — с помощью ИИ и напрямую.

Три готовых состояния интерактивного прототипа BarthMoney: панель, подтверждение расхода с помощью ИИ и офлайн-добавление
Из публичного интерактивного прототипа John: панель, подтверждение с помощью ИИ, офлайн-добавление.
Метод работы

Макет стал спецификацией, по которой можно собирать.

John не просит одного агента изобрести продукт целиком. Он даёт каждому инструменту чёткую задачу, а продуктовые решения оставляет себе.

01 · ЗамыселОписать ощущение.

Назначение экрана, иерархия, настроение и ограничения сначала формулируются обычными словами.

02 · OpenDesignСделать видимым.

John доводит сгенерированные HTML и CSS до тех пор, пока у интерфейса не появится цельное направление.

03 · СистемаЗафиксировать эталон.

Компоненты, отступы, цвета и иерархия становятся общей визуальной спецификацией.

04 · Cursor + FlutterСобрать продукт.

Эта структура превращается в модульные виджеты и логику приложения в кодовой базе John.

OpenDesign ведёт интерфейсJohn ведёт продукт
Процесс восстановлен по собственному письменному рассказу John.
За пределами отполированного экрана

ИИ — опция. Подтверждение — нет.

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

С помощью ИИ

Сначала предложить, потом спросить.

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

Офлайн в первую очередь

Прямой путь всегда открыт.

Quick Add работает без ИИ и без облачного аккаунта, потому что скорость и приватность важнее театра автоматизации.

Первый запуск

Пустое состояние даёт обещание.

Ещё до появления данных BarthMoney объясняет, что остаётся на устройстве, и предлагает одно недвусмысленное первое действие.

Многоэкранные сценарии и общее состояние по-прежнему требуют больше работы — именно эту часть John хочет, чтобы OpenDesign упростил следующей.

Что изменилось

Дефицитом никогда не были идеи. Дефицитом было непрерывное время.

По оценке John, OpenDesign сократил его время на прототипирование UI на 60–70 %. Неделя визуальной возни превратилась в пару вечеров, а основное UI-направление было готово к переносу во Flutter через считаные дни после первой идеи.

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

BarthMoney не остался единичным случаем. John сделал в OpenDesign и портфолио, где эта работа теперь живёт — ещё один способ превратить визуальное направление во что-то осязаемое.

Вывод
«Если вы соло-разработчик или инди-хакер без штатного дизайнера, OpenDesign — ваше нечестное преимущество.»
— John Pavulon, соло-разработчик · «Чтобы вы могли сосредоточиться на том, чтобы строить и выпускать.»
P.S. · Всё ещё строит после работы
Локальный сборщик BartX у John с экспериментом киберпанк-лендинга
Подпись John была простой: «мой сайд-проект, лол». BartX, запущенный локально, — ещё один взгляд на странные и очень конкретные интерфейсы, которые он продолжает делать после работы.
Следующий шаг

Достаньте интерфейс из головы — и перенесите его в сборку.

OpenDesign бесплатен, с открытым кодом и работает на вашей машине и на ваших ключах.

OpenDesign для компьютера

Одна дизайн-система. Единый образ бренда во всех материалах

В полном Vibe Design Workspace одни и те же правила бренда работают для сайтов, слайдов, интерактивных прототипов, дашбордов, изображений и HTML-видео. Подключите локальные Codex, Claude Code, Cursor и другие кодинг-агенты и создавайте бесплатно.

  • Сайты, слайды, прототипы, дашборды, изображения и видео
  • Более 140 дизайн-систем и полная библиотека шаблонов и навыков
  • Локальный Codex и более 21 кодинг-агента · Бесплатно
Скачать бесплатно

Для macOS и Windows