The Blueprint
for Better.
One canonical home for the UX & Research practice — the standards we hold, the rituals we run, the decisions we ship, and the craft we put behind every customer moment.
To set the standard for digital healthcare and insurance in Saudi Arabia — creating experiences that are secure, seamless, and genuinely caring.— The Bupa UX & Research Practice
The wiki, in one glance.
A living index of every standard, ritual, and asset the UX & Research practice runs on — organised so the team can move faster.
Organised into 10 zones — from onboarding to strategy — designed for every audience working with Bupa Design.
From insight to impact — a clear path forward.
Five phases. Clear exit criteria. Phase gates with the Design Lead before advancing. Every project follows the same rigorous process.
Components, tokens, and foundations.
A single source of truth for UI components. Stable, beta, and in-review — with clear status for every element in the BupaHive library.
We're one request away.
Quick consults, small tasks, projects, or strategic initiatives — triage within 2 working days.
Start with the why.
A field guide to BupaHive — what's inside, who it's for, and how to find your bearings on day one.
Purpose
Orient first-time visitors to the Bupa Design Ops & Wiki and explain how it's organised.
When to Use
- It's your first day on the UX team
- You're a partner (PM, Engineer, BU) starting to work with us
- You want to understand where to find something
- You're sharing this wiki with someone new
How This Wiki is Organised
Our wiki has 10 zones, designed for different audiences and needs.
| Zone | What's there |
|---|---|
| Start Here | Onboarding, FAQs, how to request support |
| Team & Culture | Vision, principles, team directory |
| Design System | Components, tokens, accessibility |
| Brand | Visual identity, voice & tone |
| Research Ops | Methods, repository, templates |
| Process | How we design, governance, reviews |
| Operations | Intake, projects, timesheets |
| Strategy | OKRs, KPIs, roadmap |
| Knowledge | Case studies, lessons, inspiration |
| Tools | Software, templates, files |
How to Find Things
- Search: Press
⌘Kor tap the search icon in the nav - Browse: Use the nav bar or home page sections
- Ask: Post in
#ux-helpon Slack or contact the wiki owner
Who Maintains This
The UX & Research team owns this wiki. Each zone has a designated owner. Suggest changes by leaving a comment on any page.
Your first 90 days, mapped.
A structured ramp-up for new UX hires — from accounts and rituals to your first shipped contribution.
Day 1 — Get Set Up
- Receive laptop, access cards, ID badge
- Set up Bupa email and Slack
- Get added to UX team Slack channels
- Get Figma, Jira, Drive access
- Meet your manager and onboarding buddy
- Read the Bupa Design Culture page
Week 1 — Orient
- Read Vision & Principles
- Review the Design System
- Shadow team rituals (standup, design review)
- 1:1s with team members
- Review current sprint and projects
Month 1 — Contribute
- Take ownership of a small project
- Run your first design review
- Complete brand and accessibility training
- Submit timesheet weekly
Month 3 — Operate
- Lead a research session
- Contribute to the Design System
- Set Q1 personal goals with manager
- 90-day check-in
Working with us, made simple.
Orientation for Product, Engineering, and Business partners — how we engage, what to expect, and where to plug in.
How We Partner
We embed with Product and Engineering throughout the lifecycle: discovery, definition, design, delivery, and learning. Earlier involvement leads to better outcomes.
What We Deliver
- User research and insights
- Service and journey design
- Interaction and visual design
- Design system contributions
- Accessibility audits and guidance
How to Engage Us
Quick question or 30-min input
Post in #ux-help on Slack
Need design support on a project
Submit a request via the Intake Flow
Strategic initiative
Email the Head of UX to scope together
What to Expect
- Triage within 2 working days
- Project kickoff scoping within 1 week
- Regular sync points throughout delivery
- Design review checkpoints at key milestones
Bring us a problem, not a solution.
The front door for design support — what to share, how we triage, and what comes back to your team.
What to Include
- Title: Short, clear name for the work
- Background: What problem are we solving? Who for?
- Goal: What does success look like?
- Audience: Who are the end users?
- Timeline: Key dates and deadlines
- Stakeholders: Who's involved?
- Reference materials: Existing research, designs, or docs
Request Types & Sizing
| Type | Size | Timeline |
|---|---|---|
| Quick consult | < 2 hours | Same week |
| Small task | 1–3 days | Within 2 weeks |
| Project | 1–4 weeks | Scope and schedule |
| Strategic initiative | 1+ month | Quarterly planning |
How to Submit
Open the Jira intake board
Create a ticket using the Design Request template
Fill in all required fields
Tag the relevant Lead
What Happens Next
- Triage within 2 working days
- Scoping conversation if needed
- Assignment to a designer
- Kickoff meeting
Quick answers, no scavenger hunt.
The questions we hear most about the UX practice, our process, and our tools — written down once and kept current.
Process & Requests
Team & Culture
Design System & Brand
Tools & Access
#ux-help on Slack — we'll add it here.
The shared vocabulary of Bupa UI.
Every component the practice ships — what it does, how to use it well, and where it stands in its lifecycle today.
Component Index
| Component | Status | Figma Link | Owner |
|---|---|---|---|
| Button | Stable | (link) | TBD |
| Input | Stable | (link) | TBD |
| Card | Stable | (link) | TBD |
| Modal | In Review | (link) | TBD |
| Tabs | Beta | (link) | TBD |
Status Legend
| Status | Meaning |
|---|---|
| Stable | Production-ready, fully documented, tested |
| Beta | Functional but may evolve — use with caution |
| In Review | Under design review, not ready for production |
| Deprecated | Do not use — see migration guide |
How to Use a Component
Find the component in Figma
Use the component library panel to locate it.
Use the variant that matches your need
Check all available variants before customising.
Don't override styles
Request a new variant from the Design System team if needed.
Add accessibility annotations
Document ARIA labels, focus order, and roles.
Contributing a New Component
See Contribution Guidelines in the Design System Hub. All new components go through a review process before being added to the library.
The atoms behind every screen.
BupaHive v1.0 foundations — colour, typography, spacing, radius, elevation, and motion. The primitives every Bupa Arabia product is built on.
Brand Colour — Bupa Blue
The single primary brand accent. One brand accent per surface; don't mix Blue with Fuchsia, Teal or Purple on the same screen.
Bupa Navy — text & dark surfaces
Editorial Accents
Use sparingly — one accent per surface. Pair with text labels and never rely on colour alone for meaning.
Status Colours
Always pair colour with an icon and a text label. Healthcare context: red carries urgency; green reads as success.
Typography
House font: Montserrat. No serifs. No italics. Use weight or colour for emphasis, not slant.
Spacing
11 steps. Used as bupa-* prefixed tokens — px-bupa-3xl, gap-bupa-md.
Radius
Capped at 10px max for general UI. Anything larger is a deliberate choice — pill chips, avatars, modal previews.
Shadow / Elevation
Prefer tinted backgrounds (bg-secondary) for layered surfaces over drop shadows. Reserve shadows for cards that genuinely lift off — modals, popovers, toasts.
Motion
Default for UI state transitions: duration-base ease-out (200ms).
| Token | Value | Use |
|---|---|---|
duration-instant | 50ms | Hover acknowledgment |
duration-fast | 150ms | Tooltip / popover fade |
duration-base | 200ms | Default — colour, opacity |
duration-slow | 300ms | Drawer slide, layout shifts |
Iconography
BupaHive uses Iconsax as the single icon system — Linear variant, 16px default, in 2px increments (12, 14, 16, 18, 20, 24).
Match the method to the question.
A working catalogue of research methods — when each one fits, how to run it well, and what good looks like in practice.
Discover — Generative
Used early in the process to build understanding. Outputs are insights, themes, and opportunities.
Define — Synthesize
Turn raw research into structured insights, frameworks, and shared understanding.
Validate — Evaluative
Test assumptions and designs against real users to learn what works.
Method Selection Guide
| You need to understand… | Best method |
|---|---|
| WHY users behave a certain way | Interviews, Diary Studies |
| HOW MANY are affected | Surveys, Analytics |
| Whether a design works | Usability Testing, A/B Testing |
| The full journey | Journey Mapping |
| User archetypes | Personas, Segmentation |
| Real-world context | Field Research, Diary Studies |
From signal to ship.
The canonical Bupa design process — intake, discovery, design, delivery, and learning — connected as one continuous flow.
Nine stages, one continuous loop.
Our design process moves linearly through the first three stages, then becomes a continuous cycle. The dashed lines show how reality often loops us back when prototypes spark new ideas, tests reveal new IA, or insights redefine the problem entirely.
Research
DiscoverGet close to the problem, the people, and the context. Listen first, judge later.
Define Problem & Goals
DiscoverDistill what you learned into a sharp problem statement and the success metrics that will prove it's solved.
Ideation & Concept Development
DefineGenerate many directions, then converge on the one or two worth prototyping.
Wireframing & Information Architecture
DesignDecide structure before pixels — the skeleton, the navigation, the content order.
Prototyping
DesignMake it real enough to test. Speed beats fidelity here.
User Testing & Validation
DesignPut the prototype in front of real users. Watch, listen, take notes — don't defend.
Design Refinement & Handoff
DeliverPolish the final design and package it so engineering can build without guessing.
Implementation & Quality Assurance
DeliverBuild it, then make sure what shipped matches what was designed.
Post-launch Evaluation & Iteration
LearnMeasure what shipped against what you expected. Document. Repeat.
Phase Gates
Each phase has a checkpoint with the Design Lead before moving to the next. Phase gates are not optional — they ensure quality and alignment at every stage.
Designed to build.
What engineering needs from us — specs, states, edge cases, and the structure that turns a Figma file into shippable code.
Handoff Package
A complete handoff includes all of the following:
1. Final Designs
- Locked, named, organised Figma file
- All states: default, hover, active, disabled, error, loading, empty
- All breakpoints: mobile, tablet, desktop
2. Specs
- Spacing, sizes, alignment using BupaHive design tokens
- Color references — token names, never raw hex
- Typography — token names (
text-md,font-semibold)
3. Behavior
- Interactions, transitions, animations
- Loading and empty states
- Error handling
- Edge cases
4. Accessibility
- Heading hierarchy
- Focus order and tab stops
- ARIA labels and roles
- Color contrast notes (WCAG 2.1 AA — 4.5:1 body, 3:1 large)
- Screen reader behavior
5. Content
- Final copy (UX writing reviewed)
- Localization considerations (English LTR + Arabic RTL)
Pre-Handoff Checklist
- Design Review complete
- Design Checklist signed off
- Accessibility annotations added
- Specs generated
- Engineering walkthrough scheduled
- Tokens (not raw values) used throughout
Design QA During Build
- Sync with Engineering at component level
- Review staging environment
- File QA tickets early
- Sign-off before launch
text-primary, bg-primary, border-primary — don't hardcode bupa-navy-900 directly in components.
From request to roadmap.
The operational backbone of design intake — how every incoming ask moves from submission to assignment to ship.
The Flow
Request
Partner submits via Jira intake board. See How to Request Design Support.
Triage (within 2 working days)
- Lead reviews the ticket
- Confirms it has enough detail
- Tags request type and size
Scope (if needed)
- 30-min scoping call with requester
- Defines deliverables, timeline, dependencies
- Captures constraints
Prioritize
- Reviewed in weekly intake meeting
- Plotted on capacity board
- Sequenced against existing work
Assign
- Match to designer based on skills, capacity, growth
- Add to designer's queue in Jira
Kickoff
- 60-min meeting with requester, designer, key stakeholders
- Aligns on goals, success metrics, timeline
- Designer takes ownership
Prioritization Criteria
| # | Criterion |
|---|---|
| 1 | Strategic alignment (OKRs) |
| 2 | User impact (volume, severity) |
| 3 | Business impact (revenue, risk) |
| 4 | Effort vs value |
| 5 | Dependencies and blockers |
The kit we work with.
A master reference for the tools the UX practice runs on — what each one is for, who has access, and how to get yourself set up.
Design
Research
Collaboration
Getting Access
Submit access request via internal form
Approval from your manager
Account provisioning (1–2 days)
Decisions, recorded.
A living log of meaningful UX choices — what we chose, the reasoning behind it, who weighed in, and what comes next.
Document key design decisions clearly and consistently. Use it during any design phase — whether it's a small UI change or a major feature update.
Nothing slips. Nothing skipped.
A project-level checklist that follows every UX engagement from kickoff through post-launch — research, design, validation, handoff, and learning.
Tick items as the project progresses. Add a date on each task to track when it was completed.
A protocol that protects the work.
The UX Protocol Framework — a shared contract for setting pace, scope, standards, and handoffs, so design ships with accountability and cross-functional trust.
Design without a protocol drifts. With one, it ships.
When the rules of engagement aren't shared, scope creeps, decisions get re-litigated, and quality erodes under deadline. The Protocol gives every project the same backbone — strategic alignment up front, predictable cadence in the middle, accountable handoff at the end.
Strategic alignment
Every brief begins anchored to a KPI or OKR — design serves the business, not the loudest stakeholder.
Predictable pace
Standing rituals replace chaotic check-ins. Teams know when decisions land, not just hope they will.
Scope discipline
Changes follow a written policy — not vibes. Add, extend, or defer with a clear sign-off authority.
Cross-functional trust
Engineering, product and business get the same view. Less "what's the design status?" — more "we're on track."
A five-part contract for how design happens.
The Protocol isn't a methodology — it's the operating contract that wraps around our existing process. Five disciplined practices that align outcomes to strategy, give teams a rhythm, and make the work durable.
How we move from idea to evidence.
The cadence that keeps everyone in sync.
A predictable rhythm of touchpoints across the project lifecycle — short, scoped, and outcome-driven. Skip a beat and the team feels it.
Kickoff Workshop
90 min. Problem framing, KPIs, scope, success criteria, risk surface. Required attendees signed off in writing.
UX Standup
Async-first. Yesterday, today, blockers. PM and lead engineer welcome. No status theatre.
Cross-functional Sync
Walk the work, surface decisions needed, log scope changes. Time-boxed agenda, written notes shared same day.
UX Review & Roundtable
Peer critique with the design team. Bring a clear question, leave with a clear action.
If it isn't written down and signed, it isn't a change.
Every scope change has a tier, a tactic, and a sign-off authority. The same rule applies whether the request comes from a PM, a stakeholder, or the design team itself.
| Change | Tier | Tactic | Sign-off |
|---|---|---|---|
| Minor visual change Copy edits, spacing, color swap. |
S | Reuse existing pattern. | UX Lead within 2 days |
| New screen or flow extension Adds to the agreed scope without changing intent. |
M | Reuse or extend, no new patterns. | UX Lead + Design Manager (2–5 days) |
| Material scope change New deliverable, changed intent, or new audience. |
L | Re-plan or push to next sprint. | UX Manager + PM (5–10 days) |
| Direction change Strategy or KPI shift mid-project. |
XL | Pause, re-brief, restart from kickoff. | Design Director + Product Lead |
Stuck? There's a path.
Escalate when you've named the blocker, tried two options, and can't move within 24 hours. The ladder protects momentum without bypassing accountability.
Designer to UX Lead
Within 24 hours of identifying the blocker. Bring the question, the options, and the recommendation.
UX Lead to Design Manager
If the blocker is cross-team, or affects the agreed scope. Manager involves PM if needed.
Design Manager to UX Manager + PM
Strategy, resourcing, or timeline at risk. Joint decision, joint accountability, written record.
UX Manager to Director
Last resort. Reserved for direction changes or organisational blockers — not stuck design choices.
The two practices that keep us honest.
UX Design Diary
A running, written log per project — decisions taken, alternatives considered, and the reasoning behind each. Living memory for the team.
- One entry per material decision
- Linked from the project page in Notion
- Reviewed at every cross-functional sync
- Source of truth in disputes
Pre-Mortem
Before kickoff signs off, the team imagines the project has failed and writes the autopsy. Surfaces risks while there's still time to remove them.
- 30-min timed exercise at kickoff
- Top three risks logged in the project plan
- Owners and mitigations assigned
- Revisited at mid-project review
Four signatures before it ships.
A bounded chain of approvals — fast when the work is clean, deliberate when it isn't. No ship without all four.
Stakeholder
Confirms the work meets the agreed brief and KPI.
UX Team Peer
Confirms craft quality, accessibility, and pattern reuse.
Design Manager
Reviews handoff completeness and process adherence.
Director
Approves to launch. Final accountability rests here.
Reach for these — don't reinvent them.
What we gain when we follow the protocol.
Less drag, more impact. The same team, with the same deadlines, ships better outcomes when the contract is shared.
The protocol is a tool, not a tax. Use it to protect deep work, not to perform process. If a step doesn't add value to a specific project, raise it at the next UX Roundtable — the playbook is meant to evolve.
Designed by designers, for designers. Owned by the UX team. Reviewed quarterly. Open to contribution from any practitioner who's used it on a real project.
What's new in Bupa Design.
Releases, rituals, tools, and decisions from the UX & Research practice. Filter by category to find what you need.
17-news.md.