A client portal and the system behind the studio

The challenge

Small service businesses tend to run on email threads. The proposal is an attachment, the agreement is another attachment, the invoice is a third, and the latest version of anything is whichever one somebody found most recently. Clients cannot see where their project stands without asking, and the business cannot see where its pipeline stands without a spreadsheet.

The studio needed the opposite: one place where an enquiry becomes a proposal, a proposal becomes a signed agreement, and the agreement becomes a project the client can follow. And because that place holds other people's information, the rules about who can see what had to be strict and checked on the server every time, not just hidden in the interface.

What was built

An invitation-only client portal. There is no public sign-up: the studio creates each client account. Once signed in, a client sees what is happening on their project, the next step, milestones, messages, change requests, released files and invoices, in plain language rather than developer terms.

Every request for a client's information works out which client is asking from their signed-in session, never from anything the browser sends, and checks membership before returning a single row. Automated tests cover the four ways this could go wrong: a signed-out visitor reaching admin, a signed-out visitor reaching the portal, a client reaching admin, and one client reaching another client's data.

Behind it, an admin system: enquiries with a transparent score and notes, quotes with server-calculated totals that lock once sent, proposals shared by private link and accepted by typed name, and agreements that are versioned and fingerprinted so any later change to a signed document is detectable.

Privileged actions are written to an audit log. AI assistance exists only as drafts the owner reads and edits; nothing the AI writes is sent or applied automatically.

Result

The portal and admin system are built and tested, and they are the same foundations a client portal for your business would start from.

There are no client metrics to report here because this was built for the studio itself. What can be checked is the behaviour: the access rules above are enforced by automated tests that run on every change.

Online card payments, file uploads and live calendar booking are being added as separate pieces of work and will be described here once they are running.

Stack

• Next.js
• React
• TypeScript
• PostgreSQL
• Drizzle ORM
• Clerk