Шаблон Coinpath: бюджет-приложение и как его переделать

Coinpath это один из 25 готовых шаблонов Zugo: приложение личного бюджета, где видно доходы, расходы по категориям и остаток на месяц. Внутри три связанные страницы: публичная промо-страница, экран входа и сам кабинет с транзакциями. Клон шаблона в ваш проект бесплатный, кредиты не списываются, дальше вы правите его фразами в чате.

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

Что внутри шаблона Coinpath?

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

В кабинете работает фильтр транзакций на три состояния: все, поступления, списания. Категории в демо-данных бытовые: жильё, продукты, кафе. Есть пустое состояние на случай, когда за месяц ничего не записано, и это важнее, чем кажется: пустой экран это первое, что видит новый пользователь.

Промо-страница построена вокруг одного обещания, а не списка функций. Такой каркас удобно переносить на соседние задачи, потому что менять придётся смысл блоков, а не их количество.

Кому подходит Coinpath?

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

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

Третий сценарий менее очевиден: Coinpath удобен как каркас для любого приложения, где есть числовой итог и лента событий. Учёт калорий, километраж, часы по проектам. Механика одинаковая, отличается единица измерения. Если задача ближе к отметкам «сделал или нет», а не к суммам, смотрите на шаблон Continuum: он про привычки и серии.

Не подходит Coinpath там, где нужна бухгалтерия с проводками, налоговой отчётностью и многопользовательскими правами. Это другой класс продукта, и шаблон в него не растягивается без глубокой переработки.

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

Чем шаблон отличается от сборки с нуля?

Разница не в качестве результата, а в том, откуда вы стартуете. Промпт с чистого листа даёт проект, придуманный под ваше описание. Шаблон даёт проект, придуманный заранее, зато вы видите его целиком до первой траты кредитов.

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

Вторая: экономятся кредиты на первый подход. Сборка с нуля стоит 600 кредитов, и если первая версия не попала в замысел, вторая попытка стоит ещё 6. Клон стоит 0, поэтому цена ошибки на старте нулевая: не подошло, взяли другой шаблон.

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

Как переделать Coinpath под свою задачу?

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

1. Смените предметную область целиком: «переименуй в Kilometr, вместо денег считай пробег в километрах, категории замени на бег, велосипед, ходьба». Одна правка меняет и промо, и кабинет.
2. Переберите категории и валюту: «оставь четыре категории: аренда, еда, транспорт, прочее, валюта доллар». Категории это то, что расходится с реальностью пользователя быстрее всего.
3. Уберите лишнее: «удали блок сравнения месяцев, вместо него покажи топ-5 самых крупных трат». Шаблон не запрещает выбрасывать секции.
4. Доработайте пустые состояния: «когда транзакций нет, показывай подсказку с примером первой записи». Это дешёвая правка с заметным эффектом на первое впечатление.
5. Опубликуйте на своём адресе вида имя-проекта.zugo.run и посмотрите на телефоне. Финансовые экраны почти всегда открывают с телефона, и колонки, которые красиво лежали на ноутбуке, там ведут себя иначе.

Проверять результат лучше сразу после каждой правки, а не пачкой в конце.

Сколько кредитов уходит на переделку?

Клонирование шаблона ничего не стоит: страница копируется в ваш проект без обращения к модели. Платить начинаете с первой правки.

Бесплатный тариф даёт 2 400 кредитов: этого хватает на клон и одну правку. Pro стоит $25 в месяц за 20 000 кредитов, Business стоит $50 в месяц. Считать удобно так: типичная доводка шаблона до своего вида это от пяти до пятнадцати правок, то есть от 15 до 4 500 кредитов.

Что подключить, чтобы бюджет стал настоящим?

Шаблон это интерфейс с демонстрационными данными. Чтобы записи жили между устройствами и принадлежали конкретному пользователю, нужна база и вход.

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

Дальше по ситуации: Stripe, если приложение платное и нужна подписка; Resend, если раз в месяц уходит письмо с отчётом; Google Analytics, если считаете, до какого экрана доходят новые пользователи. GitHub нужен, когда код хочется забрать себе: экспорт отдаёт настоящий репозиторий, проект принадлежит вам.

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

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

Чего Coinpath не делает?

Три честные границы, о которых лучше знать до старта.

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

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

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

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

С чего начать?

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

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

Если хочется сначала увидеть весь набор и понять, какая категория ближе, есть обзор всех 38 шаблонов Zugo. А если задача шире учёта трат и ближе к полноценному приложению расходов с отчётами, посмотрите разбор про приложение учёта расходов.

Взять шаблон и переделать под себя можно на zugo.dev: стартовых кредитов хватит, чтобы дойти до первой своей версии и решить, стоит ли двигаться дальше. Карта для этого не нужна, а опубликованный проект сразу получает адрес, который можно кому-то показать.