Back to portfolio

Client portalLive

Case study 02

Clairen Haus Client PortalOne private place for website clients to follow their build, from deposit to launch

Client
Clairen Haus (in-house)
Role
Product design, build and launch
Period
October 2026

01

The problem

Clairen Haus website clients sign an agreement and pay a deposit, then the build begins. Without a portal, the rest ran through email: sending firm details and photos, finding the signed agreement, and checking where things stood.

Clients needed one place to check, and the business needed a way to move each client forward without writing every update by hand.

02

What was built

A private portal with its own sign-in, a client view and an admin view. It is built so a client who pays their deposit through Stripe checkout lands straight in their portal, signed in.

  • Passwordless sign-in by email link, only for the email addresses on the client’s file
  • A six-step build tracker: Signed, Deposit paid, Content received, Building, Review, Live
  • A firm details form and photo uploads, so content arrives in one place
  • The signed agreement and a Payments tab with paid, due and upcoming invoices
  • An admin view to move each client through the build, with an automatic update email at every step
  • Admin tools to add a client by hand, resend a sign-in link and download a client’s photos

03

Evidence you can check

What you can check for yourself, plus how it was tested.

  • The portal runs at portal.clairenhaus.com. The sign-in page is public; client pages are private.
  • 65 automated tests cover sign-in, the client dashboard, the admin view, payments and the checkout hand-off. All 65 pass.
  • Screenshots of the client view use sample data from the test setup, never a real client.
Client portal dashboard with a six-step progress tracker and a list of what the client needs to send, shown with sample data
The client view, shown with sample data.
Clairen Haus portal sign-in page on a phone, asking for the client’s email address
The live sign-in page on a phone, captured from portal.clairenhaus.com.

04

Scope

The size of the build, counted from the portal’s own code and test suite.

6build steps every client can see
65automated tests, all passing
11fields in one firm details form
2views: one for the client, one for the admin

05

Build timeline

Planned, built and put on its own address over two days.

  1. 01

    Plan

    October 14, 2026

    • Mapped the client journey from signed agreement to live site
    • Decided on sign-in by email link, with no passwords to forget
    • Defined what clients see and what only the admin sees
  2. 02

    Build

    October 14, 2026

    • Client dashboard: build tracker, firm details, photos, agreement
    • Admin view: move a client’s step, see their edits, download photos
    • Checkout hand-off, so a paid deposit can open the client’s portal
  3. 03

    Testing

    October 14 to 15, 2026

    • Automated tests for sign-in, dashboard, admin and checkout
    • Phone and desktop screenshots checked for layout
    • Payments tab added and tested against a stand-in for Stripe
  4. 04

    Launch

    October 15, 2026

    • Deployed with its own database and photo storage
    • Moved to portal.clairenhaus.com with a valid security certificate
    • Sign-in emails set up to come from the clairenhaus.com domain

06

Tools and topics

  • Client portal
  • Node.js
  • PostgreSQL
  • Stripe Checkout
  • Stripe invoices
  • Postmark email
  • Railway
  • Automated testing

View the portal (opens in a new tab)

Have a similar project?

Clients asking “where are we?”

A portal gives them the answer before they ask. Michelle maps how your clients move from yes to done, then builds the place where they can see it.

Let’s Talk Through It hello@clairenhaus.com