Задача
Кожна книжка в цьому стартапі унікальна: ілюстрації генерує ШІ, друк замовляють поштучно або невеликим тиражем, потім книжку везуть клієнту. Гроші за одну книжку йдуть у три різні місця і в різний час, тому справжню собівартість доводилося складати вручну після кожного замовлення друку.
Команді потрібне було одне місце, де видно, скільки коштує кожна книжка, скільки пішло за місяць і на що саме. Вносити дані має бути швидко навіть для тиражу з десятка однакових книжок.
- Клієнт: стартап персоналізованих дитячих книжок із друком на замовлення. Назву не розкриваю, скріни зроблено на знеособлених даних
- Формат: закритий вебзастосунок для команди, вхід за паролем
- Строк: перша робоча версія в продакшні в день постановки задачі, далі доопрацювання за відгуками
- Роль: усе сама – модель даних, дизайн, фронтенд і API, зберігання, вхід, графіки, мобільна версія, розгортання
Усі витрати на одному екрані
Нагорі – підсумки, нижче – графік і структура витрат. Усе перераховується одразу після збереження рядка.
Цілий тираж однією формою
Один рядок – одна надрукована книжка: дата і номер замовлення друку, назва, позначка «зразок», генерація, друк і доставка в доларах, формат, розмір і папір. Сума за книжку рахується ще до збереження.
Для тиражу є поле «кількість»: вказуєте, скільки однакових книжок, і форма додає стільки окремих рядків, кожен можна потім виправити. Дата, номер, ціни й параметри підставляються з попереднього запису, тож між книжками зазвичай змінюється тільки назва.
Будь-яке замовлення за секунди
Таблиця замовлень має пошук за назвою або номером, фільтри за місяцем і точною датою та перемикач «усі / зразки / клієнтські». Над таблицею видно, скільки рядків знайдено і на яку суму. Усе вивантажується в CSV.
Кнопки видалення в рядках нема, щоб ніхто не стер запис випадково. Видалити можна тільки з режиму редагування і після підтвердження, а кожне збереження робить знімок даних, з якого можна відкотитися.
Зручно і з телефона
Замовлення друку часто вносять не за комп'ютером. На телефоні плитки стають у дві колонки, форма – в одну, а рядки таблиці перетворюються на картки, де кожна витрата підписана.
Цифри і стек
| Метрика | Значення | Що це означає |
|---|---|---|
| Від задачі до запуску | 1 день | Дашборд запрацював у продакшні в день постановки задачі |
| Статей витрат | 3 | Генерація ШІ, друк і доставка, кожна з часткою від загальної суми |
| Книжок за одне збереження | до 50 | Тираж додається одразу, кожна книжка окремим рядком |
| Фільтри таблиці | 4 | Пошук, місяць, точна дата і «усі / зразки / клієнтські» |
| Знімок даних | на кожне збереження | Будь-яку зміну можна відкотити вручну |
| Бібліотек для графіків | 0 | Стовпчики й смуги зроблено на чистому CSS, сторінка легка |
Джерела: код дашборда, історія розробки
Стек: Next.js 16 (App Router), React, TypeScript, Vercel Blob для даних, вхід за паролем із сесією в cookie з HMAC-підписом, експорт CSV через API-маршрут, графіки на CSS, розгортання на Vercel.
Що отримав клієнт
- Собівартість кожної книжки без ручних підрахунків. Генерація, друк і доставка зведені в один рядок і одну суму
- Видно, куди йдуть гроші. Підсумки за весь час, графік за місяцями чи днями і частка кожної статті витрат
- Тираж вноситься одним збереженням. Кількість у формі і підстановка з попереднього запису
- Зразки окремо від клієнтських книжок. Один перемикач у таблиці і позначка в кожному рядку
- Дані не загубляться. Видалення тільки з підтвердженням, знімок на кожне збереження, експорт у CSV
- Доопрацювання після запуску. Фільтри, поле кількості, графік за днями й мобільні картки додано за відгуками команди
Що з цього взяти собі
- Один рядок – одна фізична одиниця. Тоді будь-який підсумок, фільтр і середня вартість рахуються без хитрих формул
- Вносити дані має бути найпростішою частиною. Якщо вносити довго, таблицю перестають заповнювати, і жоден графік уже не допоможе
- Видалення ховається глибше. У внутрішньому інструменті випадково стертий рядок коштує дорожче за зайвий клік
- Перша версія в той самий день. Справжні відгуки команди з'являються тільки тоді, коли вона почала вносити свої замовлення
Схожий дашборд під ваші витрати оцінюю після брифа: строк і ціну називаю в той самий день.
Часті питання
Чи підійде це не для книжок?
Так. Модель тут проста: одна одиниця товару – один рядок із кількома статтями витрат. Так само можна рахувати мерч, друк поліграфії чи будь-яке виробництво малими партіями.
Чому не гугл таблиця?
Таблиця теж рахує, але кожен тираж там – ручне копіювання рядків і формул, а графіки й фільтри треба налаштовувати окремо. Тут форма сама додає партію, підсумки й графіки оновлюються після збереження, а випадково стерти чи зламати формулу не вийде.
Хто має доступ до даних?
Тільки ті, кому дали пароль. Дані лежать у приватному сховищі на Vercel, а кожне збереження робить знімок, тож будь-яку зміну можна відкотити.
Потрібен внутрішній дашборд – напишіть три речення
Що рахуєте, де зараз лежать цифри і хто ними користуватиметься. Цього досить, щоб я сказала, як це зібрати і скільки коштуватиме. Відповідаю в той самий день.