Declario
Proposal software that shows what happens after you press send.
- Type
- B2B SaaS
- Role
- Product design, design system, full-stack development
- Year
- 2026
- For
- Binary Brain Technologies product
- Stack
- Next.js 16 · React 19 · TypeScript · Supabase · Postgres · Paddle · Resend · Claude API · Vercel
02
Context
Most proposals leave as a PDF attachment and then nothing happens - at least nothing the sender can see. The next step is usually a guess: follow up too early, or too late.
Declario replaces the attachment with a link. It is a Binary Brain Technologies product, live since July 2026, in English and Polish.
03
Role
I designed and built it end to end: product scope, interface, design system, database, integrations and deployment. The repository has a single author.
04
Idea
From send to signal.
The product is designed around one moment - the silence after sending. Everything the client does with the proposal is recorded as a signal on a time axis, the way a strip-chart recorder draws a line.
The design system follows that metaphor literally: hairline rules, a time gutter, tabular figures, and one rule for colour - green means a client did something.
05
Experience
- A proposal is assembled from sixteen block types - pricing tables, timelines, case studies, terms, a countdown - and sent as a share link.
- The client reads it in the browser, comments, accepts or declines, and signs with a typed name. The sender sees opens, sections viewed, time on pricing, scroll depth and return visits.
- An engagement score from 0 to 100 sorts proposals by what clients actually did, and always shows the reasons behind the number.
- Around that core: approval workflows, versions with a diff and restore, automated follow-up sequences, AI drafting for text blocks with an explicit accept / edit / retry step, and Slack, webhook and HubSpot integrations.
06
System
- InterfaceNext.js 16 App RouterReact 19TipTap editorTailwind 4next-intl (EN/PL)
- StateZustand storesServer-rendered marketing pages
- DomainServer actions per areaA single registry for plans, blocks, integrations and statuses
- APIEvent tracking via sendBeaconAI generation routePDF renderingPaddle and HubSpot callbacksHourly follow-up cron
- DataSupabase Postgres with row-level securityScoring and signature locks as database triggersSupabase Auth and Storage
- InfrastructureVercel (Cron, Domains API for custom domains)Paddle as merchant of recordResend
07
Details
The registry is the only place a fact may live
Plans, block types, integration status and labels are defined once, in a typed registry. Marketing pages, docs and the app all read from it, so the site cannot promise something the product does not do. Block definitions are checked by the compiler, so a missing block type fails the build.
A modest score, on purpose
The score is computed in one place - a Postgres trigger - and mirrored in TypeScript only to explain it. The code is explicit that it is prioritisation support, not a prediction of purchase intent, and the interface never presents it as one.
Signed means immutable
Once a proposal is signed, a database trigger locks it. The guarantee does not depend on the interface remembering to hide an edit button.
Privacy in the tracking itself
Viewer events are batched with sendBeacon; IP addresses are stored only as hashes. Credentials for third-party integrations are encrypted with AES-256-GCM using a key that lives outside the database.
08
Output
A live product at declario.app, in English and Polish, with a public marketing site, documentation and changelog.
09
Reflection
The strongest decisions were about keeping claims true: one source of truth for every fact, a score that explains itself, and a marketing site that shows real per-section attention where a decorative heatmap used to be.
Giving the design system its own metaphor - a recorder drawing a line - gave every screen the same vocabulary.