HQ Smart Wellness / HANQING Mini Program

Orientation

What you are looking at

Five applications sit on one backend and one customer record. The three rules below shape almost every screen in this prototype.

One customer, one record

The person who buys lunch at the counter, books a session, holds the membership and completes a recovery profile is one record with one identifier. Every screen here reads from that one record.

Money and recovery never mix

Wallet, points and coupons are three separate balances and are shown separately everywhere — never added together. Nothing a customer buys, refers or redeems can change a recovery assessment.

A safety check comes first, and a coach reviews everything

Recovery services and plans are only offered after a safety check passes. A recovery coach reviews every plan before the customer can see it — no automated process can publish to a customer.

How to review: for each mock, ask whether the most important thing on the screen is the most prominent thing on the screen, and whether a person in that role could do their actual job from it.

Surfaces in this prototype

Mock layouts included
#	Surface	Who uses it	Designed for
1	Public landing	Prospective customers	Mobile and desktop
2	Customer dashboard	Customers	Mobile first (375 px)
3	Booking journey	Customers	Mobile first (375 px)
4	Coach client review & Safety Gate	Recovery coaches	Laptop (1280 px)
5	POS checkout	Cashiers, store managers	Counter tablet (1024 px)
6	HQ customer management	HQ administrators	Desktop (1440 px)

Surface 1 · Public website

Public landing page

Objective: explain what the business does, make clear this is wellness recovery management rather than medical care, and route the visitor to the Mini Program or a branch. Holds no customer data.

HQ Smart Wellness EN | 中文

Hero

Recovery, managed.

One membership. One record. One plan — reviewed by a recovery coach before you ever see it.

Open the Mini Program Find a branch

What you get

Membership & orderingWallet, points and coupons, kept separate

BookingSessions, rooms and equipment, checked before you arrive

Recovery reviewA structured profile and assessment sequence

Coach supportA person reviews and explains everything

How it works

1 · Profile 2 · Safety check 3 · Assessments 4 · Coach review 5 · Your plan

Some people will be advised to speak to a healthcare professional instead of starting a recovery plan. That is a normal outcome of the safety check.

Wellness recovery management. This service does not diagnose or treat any medical condition and does not guarantee outcomes. If you have a health concern, speak to a qualified healthcare professional.

Review points. The wellness boundary statement is a permanent structural element, not a footnote. The "how it works" strip sets the expectation that a human reviews the plan — which is what makes the recovery offer credible.

Surface 2 · Customer Mini Program · mobile-first

Customer dashboard

Objective: answer four questions in one screen — what is my membership, what is happening next, what should I do today, and where is my recovery journey. Drawn at the 375 px design baseline; touch targets are at least 44 px.

A · Standard view — plan active

HQ Smart WellnessEN | 中文

Gold member Member no. •••• 4821 Valid to 2027-03-31

Next visit

Recovery Session Confirmed

Tue 5 Aug · 14:30 · Central Branch

Your recovery

Plan active Ready to view

Review due 2026-09-14

View my plan

Today

Hydration check-inEngagement

Evening wind-downEngagement

Try a new menu itemCommercial

Balances — kept separate

¥240Wallet

1,180Points

3Coupons

HomeBookOrderRecoveryMe

B · Recovery services on hold (Safety Gate)

HQ Smart WellnessEN | 中文

⏸ Recovery services are on hold

Your recovery coach will contact you about the next step. You can still order, use your wallet and keep your membership.

Silver member Member no. •••• 1183 Valid to 2027-01-31

Your recovery

Paused On hold

A coach will be in touch. Plan actions are hidden until then.

What this means

Still available to you

Order food & drinksOpen

Top up walletOpen

Book a therapy sessionPaused

No reason, category or medical term is shown to the customer here. The message states what is paused, who will make contact, and what remains available.

HomeBookOrderRecoveryMe

Review points. The three balances are three tiles and are never summed. Engagement and commercial tasks carry different badges. A safety hold is calm and specific: it says what is paused, who is coming, and what still works — it never implies illness.

Surface 3 · Customer Mini Program · mobile-first

Booking journey

Four steps: choose a service, choose a time, confirm, done. Every booking is validated on the server against staff, room, equipment, duration, opening hours, package balance and safety restrictions — an invalid booking is refused, never accepted and corrected later.

Step 1 · Choose a service

← Book a sessionClose

Service Time Confirm Done

Central Branch ▾

Recovery SessionAvailable

60 min · uses 1 of 4 remaining sessions

Select

Thermal TherapyPaused

45 min · ¥320

Paused — please speak to your recovery coach.

Select Why is this paused?

Guided BreathingAvailable

30 min · ¥120

Select

HomeBookOrderRecoveryMe

Step 2 · Choose a time

← Choose a timeClose

Service Time Confirm Done

August 2026

Mon 4 Tue 5 Wed 6 Thu 7

Available times · Tue 5 Aug

10:00 11:30 13:00 14:30 16:00 17:30

Unavailable times stay visible and disabled, with a reason on focus — they are not removed from the list.

HomeBookOrderRecoveryMe

Step 3 · Confirm

← Confirm bookingClose

Service Time Confirm Done

ServiceRecovery Session

WhenTue 5 Aug · 14:30

WhereCentral Branch

Duration60 minutes

Payment1 session from your package

✓ Safety check passed

Checked 2026-08-01. Re-checked automatically when you arrive.

Note for your coach (optional, 500 characters) Sample note field

Cancellation within 4 hours of the start time uses one session from your package.

Confirm booking

HomeBookOrderRecoveryMe

Step 4 · Done

Booking confirmedClose

Service Time Confirm Done

✓ You're booked

Reference APT-2026-08-0413

Recovery Session

Tue 5 Aug · 14:30 · Central Branch
Arrive 10 minutes early for check-in.

Add to calendar View my bookings Book another session

HomeBookOrderRecoveryMe

Review points. A restricted service is shown, disabled and explained rather than hidden — a missing service looks like a fault. The safety check is re-run at check-in, so a status that changes after booking still stops the session starting.

Surface 4 · Recovery Coach Portal · laptop 1280 px

Coach client review & Safety Gate

Objective: move one client from raw data to a recorded decision, safely and traceably. Seven tabs in working order. The client context header — identity, safety status and consent — is never out of sight.

Recovery Coach Portal Coach Lin · Central Branch

Clients

Search clients

Sample Client A Conditions
Sample Client B Clear
Sample Client C On hold
Sample Client D In review

Waiting on me

Reviews due 3
Referrals open 1
Reports to review 2

Sample Client A · CUS-••••-7420 · Central Branch

Safety: conditions apply Consent: granted v3 Record v2

Commercial history, spend and tier are deliberately not shown in this workspace.

1 · CRP 2 · Safety 3 · Assessments 4 · HIVA 5 · Blueprint 6 · Publish 7 · Decision

⚠ Safety status — proceed with conditions

Two service restrictions are active. Each must be cleared individually with a recorded clarification. Evaluated 2026-08-01 against safety rule set 2026.3.

Record clarification View safety detail

Priority 1 — Sleep regulation

Data confidence: Medium

Why this priority

Input sources

Lifestyle · reported sleep under 5 hours · self-reported · record v2
HVI · high daytime fatigue · self-reported · record v1
ESVA · high stress load · self-reported · record v1
Client goal · improve concentration at work · stated in profile

Rules triggered

SLEEP_DEBT_PRIMARY — rule set 2026.3
STRESS_COMPOUNDING — rule set 2026.3

Restrictions

Thermal therapy paused — safety flag SF-12
High-intensity sessions paused — safety flag SF-07

Confidence note

Objective measurements are not available for this client. Adding them would raise confidence from medium to high.

Approve priority Amend — reason required Regenerate after new data

Publication gate — all four must pass

Sample gate state for this client
Condition	State	What is missing
Required assessments completed	Pass	—
Safety gate passed	Conditions	2 restrictions to clear or carry forward
Consent granted	Pass	—
Coach reviewed	In progress	Priority 1 not yet approved

Publish to customer Disabled until all four conditions pass. The server re-checks all four at the moment of publication.

Assessment status

Assessment completion
CRP	Done
RAA	Done
Lifestyle	Done
RBA	Done
ESVA	Done
HVI	Done
HPIS	Phase 2

Record trail

Rule set 2026.3
Report version draft v3
Supersedes v2 (published 2026-06-02)

Recent activity

2026-08-01 · Coach Lin · amended Priority 2 · reason recorded
2026-08-01 · System · safety re-evaluated after profile update
2026-07-28 · Coach Lin · opened client record

Every entry above is permanent and cannot be edited or deleted by any role.

Review points. The coach can disagree — "Amend" is as prominent as "Approve", and an amendment keeps the engine's original output beside it with the reason. There is no control anywhere on this screen that lifts a hold; only a new profile evaluation or a recorded referral outcome can change it.

Surface 5 · POS / Store Portal · counter tablet 1024 px

POS checkout

Objective: complete a correct sale quickly, without ever exposing health information on a screen the public can see, and without any way to bypass a safety restriction.

Store Portal · Central Branch Cashier · Terminal 2

Sample Customer · •••• 4821 Gold

Wallet ¥240 Points 1,180 Coupons 3 Service eligibility: some services paused

The counter sees a neutral eligibility indicator only — never a reason, a flag or any health term. Wallet, points and coupons are three separate figures and are never combined.

Services Food Drinks Packages Top-up

Recovery Session 60 min ¥280Add

Thermal Therapy Not available for this customer Please refer to their recovery coach.

High-Intensity Session Not available for this customer Please refer to their recovery coach.

Guided Breathing 30 min ¥120Add

Herbal Soup Kitchen item ¥38Add

Ginger Tea Counter item ¥22Add

There is no override control on this screen. If the interface were bypassed, the server would still refuse the sale.

Cart

Order A-2291

Recovery SessionPackage

1 × uses 1 of 4 remaining sessions

Herbal Soup¥76

2 × ¥38

Member discount−¥8

Reason: configured Gold tier discount

Subtotal¥68

Tax¥4

Total¥72

Tender — split payment supported

Wallet Cash Card QR Split

Tender ¥72

Points are redeemed as a separate, explicit step — they are never treated as money and never mixed into the wallet balance.

Review points. A blocked service is shown as a dashed, muted tile with a neutral instruction. Nothing on this screen tells a cashier — or a customer standing behind the person being served — anything about health.

Surface 6 · HQ Admin Portal · desktop 1440 px

HQ customer management

Objective: keep one correct customer record across the whole business. This screen can merge duplicates — and it has no route to anyone's health information at all.

HQ Admin Branch context: All branches ▾

Operations

Branches
Staff & permissions
Customers

Catalogue

Products
Menu
Pricing

Rules

Membership rules
Assessment & scoring
Report templates
Tasks

Oversight

Audit trail
Exceptions
Analytics

Customers

New customer Export (audited)

Search name, member number or phone Filters

Sample customer list — identifiers are masked in list views
Customer ID	Name	Contact	Tier	Record state	Coach
`CUS-••••-7420`	Sample Client A	139••••5678	Gold	Verified	Coach Lin
`CUS-••••-1183`	Sample Client B	138••••2094	Silver	Verified	Coach Ng
`CUS-••••-9902`	Sample Client B	138••••2094	—	Provisional	—
⚠ Possible duplicate — `CUS-••••-9902` shares a contact number with `CUS-••••-1183`. Created at the counter on 2026-07-30.
`CUS-••••-4417`	Sample Client D	136••••3320	Gold	Verified	Coach Lin

Merge review

Merge comparison
	Keep	Merge in
Customer ID	`CUS-••••-1183`	`CUS-••••-9902`
Record state	Verified	Provisional
Orders	14	2
Bookings	6	1
Wallet	¥120	¥60
Recovery profile	1 version	none

Before you merge

History is preserved, not rewritten: the merged identifier becomes a permanent alias. Recovery profile versions are kept separately and a coach must confirm which profile version is current, because the safety check depends on it. This cannot be undone.

Reason required Duplicate created at counter — same contact number

Type the surviving ID to confirm CUS-••••-1183

Cancel Merge records

This action will be recorded permanently against your name, with the reason, and will be visible on both records and in the audit trail.

Review points. There is no health column and no health tab on this screen — the capability does not exist for this role rather than being hidden. The merge dialog states exactly what moves, what is preserved, and that it cannot be reversed.

Foundations

Design tokens

Placeholder values pending brand direction. Every value is a CSS custom property, so a brand change is a token swap rather than a redesign. All pairs below meet WCAG 2.2 AA contrast for their intended use.

Colour

Primary--c-primary

Accent--c-accent

OK / proceed--c-ok

Caution / conditions--c-caution

Halt / on hold--c-halt

Info / in review--c-info

Text--c-text

Muted text--c-text-muted

Border strong--c-border-strong

Surface alt--c-surface-alt

Colour never carries meaning alone. Every status in this prototype pairs a colour with a glyph and a text label, so it survives colour-blindness, greyscale printing and low-quality counter displays.

Status vocabulary

✓ Clear / proceed ⚠ Conditions apply ⏸ On hold ◷ In review / draft — Not applicable

Type scale

Type tokens
Token	Size	Used for
`--fs-4xl`	36 px	Public hero, desktop only
`--fs-3xl`	30 px	Page title
`--fs-2xl`	24 px	Section heading
`--fs-xl`	20 px	Card heading, cart total
`--fs-lg`	18 px	Lede, emphasised value
`--fs-md`	16 px	Body — mobile minimum
`--fs-sm`	14 px	Secondary text, table cells
`--fs-xs`	12 px	Labels and metadata — never for customer-facing body copy

Spacing, radius and targets

Layout tokens
Token	Value	Note
`--sp-1 … --sp-8`	4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 px	4 px grid
`--r-sm / md / lg / pill`	6 · 10 · 16 · 999 px	Radius
`--target-min`	44 px	Minimum interactive target, with 8 px separation
`--w-content-max`	1280 px	Desktop content cap
`--dur-fast / base`	120 · 200 ms	Suppressed under reduced-motion

Breakpoints

Responsive baselines
Name	Range	Primary surface
sm	375–429 px	Customer Mini Program design baseline
md	430–767 px	Large phones
lg	768–1023 px	Counter tablet
xl	1024–1439 px	Coach portal
2xl	≥ 1440 px	HQ admin

Foundations

These are acceptance criteria for the build, not aspirations. This prototype demonstrates them where a static page can.

Accessibility commitments (WCAG 2.2 AA)

Every interactive element reachable and operable by keyboard, in a logical order, with a visible focus ring that is never removed. Try tabbing through this page.
A skip-to-content link as the first focusable element.
Semantic landmarks and a single h1 per screen; heading levels never skip.
Touch targets at least 44 × 44 px with at least 8 px separation.
Body text at least 16 px on customer surfaces; usable at 200% zoom and 320 px width with no horizontal scrolling.
Colour never the only signal — every status has a glyph and a text label.
Motion suppressed under prefers-reduced-motion.
Safety banners and validation errors announced assertively; saves, filters and step changes announced politely.
The explanation panel is a proper list structure, so an explanation is available to a screen-reader user, not only a sighted one.

Localization

Chinese and English at parity on every surface from day one — neither is an afterthought.
Layouts verified against the longer of the two strings; English is typically 30–60% wider.
Dates, numbers, currency and name order are locale-driven; sentences are never built by concatenation.
Reports are rendered and stored per language at publication, so switching language later still shows approved wording.

Rules visible in these mock-ups

Where each constraint shows up
Constraint	Seen in
One customer, one universal identifier	Customer dashboard, POS customer strip, HQ list and merge
Wallet, points and coupons independent; purchases never affect recovery	Customer balance tiles, POS tender row
Safety check before therapy or recommendations	Booking step 1 and 3, coach Safety tab, POS product grid
A hold blocks services and plans, and no role can override it	Customer hold view, POS blocked tiles, coach safety banner
No automated publication; coach review required	Coach publication gate table
Records are versioned, not overwritten; overrides need a reason and are permanent	Coach record trail, HQ merge reason field
Customers never see staff records or internal scoring logic	Customer screens carry no scores, rules or notes
Recommendations show sources, rules and restrictions	Coach explanation panel
Rules are backend-configurable; bilingual from day one	Rule set version references, language switch on every surface
Wellness platform, not diagnosis or treatment	Page banner, public disclaimer, customer safety notice

Reminder. This is a planning prototype for stakeholder review. It is not a live service, contains no real or personal data, performs no processing, and makes no medical claim. Wellness recovery management only — not diagnosis, treatment or an outcome guarantee.