Healthcare Design System
One shared system of tokens and components behind Acacium Group's app for finding shifts, setting availability and tracking timesheets.
View case study
NG · 0001Hi, I'm Isaac.
I design products, systems and experiences for ambitious teams and growing businesses — from the first messy whiteboard to the shipped release.
Good products are built together. I believe in open collaboration and sharing what I learn.
A selection of product, UX and interface work across real estate, fintech, healthcare and education.
One shared system of tokens and components behind Acacium Group's app for finding shifts, setting availability and tracking timesheets.
View case studyDesigning a mobile banking app that makes balances, cards and transfers feel simple.
View case studyA landing page that explains a multi-chain crypto tracker in seconds and turns visitors into sign-ups.
View case studyDesigning a clearer way for people to discover, compare and manage property opportunities.
View case studyI'm interested in the space between business, technology and people — and in making complex things feel simple.
I enjoy taking complex ideas and turning them into clear, useful experiences: from early product thinking and UX flows to polished interfaces and design systems that engineers like using. I work closely with founders, PMs and developers, and I care as much about why something exists as how it looks.
Most of my good ideas show up away from the screen. These are the usual suspects.
Have an idea, product or problem you'd like to explore? I'd love to hear about it. I usually reply within two working days.
Let's talkakeisaac18@gmail.com
A deep-dive into the visual language, colour architecture and component system powering a workforce management platform built for healthcare professionals across Australia and New Zealand.
Built highest-use first, fully tokenised, with every interactive state.
Primitive and semantic tokens, live in Figma and mirrored in code.
Colour pairings that fail never reach the semantic layer.
A Figma-to-code pipeline documented in Storybook for the team.
Pulse is the mobile workforce platform built by Acacium Group, one of the largest healthcare staffing agencies in the UK and ANZ. The app serves agency workers: nurses, educators, carers and allied health professionals who need to manage variable shifts, availability windows, compliance paperwork and timesheets, all from a single interface.
The platform needed to feel trustworthy and efficient without feeling clinical or bureaucratic.
I began by hosting a kickoff session to understand the background behind the service. The session brought together UX, PMs, marketing and delivery to make sure everyone was on the same page. The key questions I wanted answered were:

Two things had to be true for this system to succeed:
Foundations that make a decision once, so every screen inherits it instead of re-solving it.
A system that exists in code as well as in Figma, so design and build never drift apart.
Colour carried the most weight. Deep navy and teal give the app a calm, trustworthy base, the sky blue keeps it warm and approachable, and a small set of status colours tells a worker at a glance where every shift and timesheet stands.
#0B4864Headers, primary text#326C82Header gradients#138496Primary actions#A8DEF8Brand surfaceValues sampled from the shipped Pulse screens.
An 8px scale with 4px micro-adjustments applied to padding, gaps and margins. Corner radius follows the same logic. Spacing stopped being a per-component guess.
40+ components, built highest-use first: navigation, dropdowns, cards. Every one is on auto-layout, fully tokenised, and covers its interactive states, including hover.

The home screen greets the worker by name, counts down to the next shift, and puts the shift details and a one-tap Clock in right at the top, with shortcuts to find shifts and timesheets.

A monthly calendar with a clear Available, Booked and Unavailable legend. Workers add time windows, edit or remove them, and select several days at once so they get matched to shifts that suit them.

Upcoming, Completed and Applied tabs, filters and sorting, and shift cards that show role, date, centre, distance and hours at a glance, so workers can pick the shifts they want.

A schedule grouped by day, with status tags for each shift and clock-in and clock-out with a click, followed straight away by completing the timesheet.

Search by location, filter by status and period, and see every timesheet's date, location, total hours and status, from Outstanding to Submitted to Approved.
Once the visual foundations were set, the system had to become deployable code. Before this, updating a token meant copying values from Figma into code by hand, with no way to know if a file had drifted until something looked wrong.
Claude is only as useful as the context you give it. Before asking for anything, I fed it six files, covering:
With the Figma MCP connected, I built the foundations in order: colour, typography, spacing, radius, elevation, layout. Every semantic token got a written description covering when to use it and why.
Claude Code ran in parallel on the repo, reading across the codebase, editing files, and keeping Figma and code aligned as the system grew.
I kept three systems open through the entire build:
Healthcare-specific reasoning
Scale and token architecture
Its staged component model
That running comparison is what told me when to push back on Claude's output instead of taking it as given.
Primitive and semantic tokens are live in Figma and mirrored in code. The foundation the product needed from the start now exists, and every new screen starts from a decision instead of a guess.
Accessibility used to be a checklist at the end. Now it's built into the token layer itself. If a colour pairing fails WCAG 2.2 AA, it isn't in the semantic layer to begin with, so there's nothing failing to catch later.
The documentation is built in Storybook and explains what each token is for and when not to use it, so extending the system doesn't mean re-arguing decisions that are already made.
The next test is putting it in front of someone else: a designer extending the system or a developer implementing it.
Claude built the structure fast. Whether it was any good took checking it against systems that already worked.
I learned design systems by working through naming conventions and token structure, asking Claude when I was unsure.
A tour of the clickable prototype built for investors and first users: onboarding, the home dashboard, virtual cards, transfers and analytics.
Designed to simplify everyday banking by bringing payments, transfers, card management and financial insights into one seamless digital experience.
Check a balance, send money and understand spending within a minute of opening the app.
From splash and onboarding to transfers, deposits, withdrawals and analytics.
From a loose idea to investor-ready designs and a working prototype.
A new product with no existing design to lean on.

Most mobile banking apps were designed by committees who optimised for feature parity rather than user clarity. The result is interfaces that leave users anxious instead of informed.
A person should be able to check their balance, send money to a contact and understand their spending, all within 60 seconds of opening the app.
With two months and an idea that wasn't solidified yet, research had to be quick and focused. I started from the founders' vision and the 60-second brief, looked closely at how everyday banking apps handle the same jobs, and turned what we learned into a clear picture of who TegaPay was for.
A busy professional who banks on their phone, several times a day
Feature parity wins over clarity, so the balance and the next action compete with everything else on screen.
Everyday tasks like sending money or finding a card sit several taps deep, behind menus that change from screen to screen.
Without hierarchy or clear confirmations, people aren't sure what they're paying, what it costs, or where their money went.
I mapped the end-to-end journey of a new TegaPay user to find where friction builds up, and where the app could stand out.
Scroll sideways to see the full map →
| Stages | Onboarding | Checking balance | Sending money | Managing cards | Tracking spending |
|---|---|---|---|---|---|
| Actions | Download, read the intro, create an account or log in | Open the app, find the balance and recent changes | Pick a recipient, enter an amount, review and confirm | View virtual cards, check card balance, add money | Review analytics, search and filter transactions |
| Goals | Get set up quickly and feel safe | Know exactly where they stand | Pay the right person without mistakes | See every card in one place | Understand their spending pattern |
| Touchpoints | Splash, onboarding, create account, log in | Home dashboard, balance card | Transfer: select recipient, amount, review | Virtual card, cards tab | Analytics, transactions, transaction details |
| Emotions | 🙂Curious | 😐Unsure | 😣Anxious | 🤨Confused | 😞Overwhelmed |
| Pain points | Long sign-ups ask for too much, too soon | The balance competes with promotions and widgets | Fees and totals only appear at the very end | Cards are split across different screens | Raw lists with no summary of where money went |
| Opportunities | Three calm intro screens, with Get Started and Log in always visible | Lead the home screen with the balance and four quick actions | A review step that shows the fee and the total before sending | Stack every card in one view with a single total balance | Weekly, monthly and yearly charts with income, expenses and net saved |
With a clear picture of the friction, I turned each opportunity into a question the design had to answer, then mapped how people would move through the app before designing a single screen.
…make a balance readable in a single glance?
…let someone send money to a contact in under 60 seconds?
…show every fee before a person commits to a transfer?
…turn a list of transactions into an understanding of spending?
I mapped the core flows end to end to define the MVP's scope and make sure each job could be finished in as few steps as possible.
Five tabs, each owning one job, so nothing important is ever more than a tap away.
Every screen was judged against the brief. If it didn't help someone check, send or understand their money faster, it didn't make the MVP.
The balance leads the home screen, with change over the last 24 hours right underneath.
Transfer, Deposit, Withdraw and More sit one tap away, and every transfer ends on a clear review.
Income, expenses and a weekly spending chart turn transactions into something readable.
I worked closely with the two co-founders, a PM and an engineer. With two months on the clock, the process was built for fast decisions.

Three calm screens introduce the promise: take control of every dollar, your money smarter every day, and banking that moves with you. Get Started and Log in are always within reach.
The home screen leads with the available balance and four quick actions. A transfer moves from choosing a recipient, with recent contacts and search, to an amount and a review that spells out the fee and the total before anything is sent.
Weekly, monthly, quarterly and yearly views show spending against last week, income, expenses and net saved. Transactions are searchable by merchant, amount or date and filterable by card, transfers or income.
A near-black ink and a soft off-white canvas keep the interface quiet, so the TegaPay teal can mark the actions that matter. A deep green gradient gives the balance card weight, and small tinted pills signal income and expenses at a glance.
#11201EBalance card#075D52Card gradient#0FAF9APrimary actions#FAFAF9App backgroundColours and components taken from the TegaPay screens.
Within the two-month deadline, TegaPay went from an idea with nothing solidified to a complete set of high-fidelity iOS screens and a clickable prototype, ready to show investors and to test with initial users.
Onboarding, account creation and log in, the home dashboard, cards, transfers, deposits, withdrawals, analytics and transaction history.
A clickable build that lets investors and first users experience the product, not just look at it.
Measuring every idea against the three core jobs made it easy to say no to features that didn't belong in an MVP.
Designing alongside the co-founders, PM and engineer kept decisions fast and turned an unformed idea into a product the team could stand behind.
Thanks for reading!
As product designer on Vestra, I redesigned a crypto trading and wallet platform so investors could see every coin, across every chain, in one clear picture.
The page is ordered by what a careful investor asks before connecting a wallet.
Two calls to action, three trust signals and one real product shot.
Connected with read-only access and priced in real time.
The marketing site designed in both dark and light.
The first wireframe followed a generic fintech template, with a virtual card and a recurring-spend tracker borrowed from another kind of product. It looked like a landing page, but it didn't tell people what Vestra actually does.
The hero paired a broad promise, "A smarter way to buy, track and grow crypto", with a placeholder for lifestyle photography. It could have belonged to any crypto app.
Convince a careful crypto holder to connect their first wallet.
The landing page had one job: convince a careful crypto holder to connect their first wallet. To do that, I needed to understand what makes this person hesitate, and what they need to see before they trust a product with read access to their money.
Holds assets across several exchanges and wallets, and is wary of anything that touches them
The first wireframe borrowed a virtual card and a spend tracker from another kind of product, and never said what Vestra actually does.
A broad headline and a lifestyle photo gave a careful visitor nothing to check, so there was no reason to believe the claims.
In crypto, the biggest objection is access. A page that doesn't answer it directly loses the visitor at the moment of connecting.
I mapped the journey from first landing on the page to connecting a first wallet, to see where doubt creeps in and what each section needed to resolve.
Scroll sideways to see the full map →
| Stages | Land | Understand | Verify | Trust | Connect |
|---|---|---|---|---|---|
| Question | What does it track? | What do I get? | Are the numbers right? | Can it touch my money? | How does it work? |
| Actions | Read the headline, scan the product shot | Explore features and the mobile app | Check live prices and the stats strip | Read the security section and the FAQ | Follow the three steps, start for free |
| Touchpoints | Hero, trust signals | Feature cards, app section | Live markets, stats strip | Security, FAQ | How it works, pricing, call to action |
| Emotions | 🤨Sceptical | 🙂Interested | 😐Checking | 😣Cautious | 😊Reassured |
| Pain points | Generic promises look like every other crypto app | Feature lists without showing the product | Prices and totals that don't match elsewhere | No clear answer on access to funds | Unclear what happens after signing up |
| Opportunities | Name the job in one line and show a real dashboard | Put a real screen beside the copy | Live prices and proof of scale, in numbers that agree | "We can read. We can never move." with read-only keys | Three simple steps and plain pricing |
With the visitor's questions mapped, I turned each one into a design problem and then ordered the page so every section answers one of them.
…explain what Vestra does in a single line?
…prove the numbers are right instead of just saying so?
…answer the fear of losing funds before it stops someone?
…make connecting a first wallet feel like a small, safe step?
I mapped the path a visitor takes down the page, with a clear way to act at every point where they might be ready.
Each question became a section, in the order a careful investor asks them.
I rebuilt the structure around the questions someone asks before connecting a wallet. Each section now answers one of them, in this order:

The final page has 10 sections, and each one answers a single question.
Here are a few key parts of the page I designed, and the thinking behind each one.
"A smarter way to buy, track and grow crypto"
Broad promise and a lifestyle photo placeholder"Every coin. Every chain. One clear picture."
The job in one line, with a real product shotThe final hero names the job in one line. Under it sit a free call to action, a "See how it works" option for people still deciding, and three trust signals. Below that, a full portfolio dashboard shows realistic balances, holdings and activity instead of a stock photo.
Above the fold: 2 calls to action, 3 trust signals and 1 product shot.

I turned live prices into their own section, built around what a holder checks first when they open the app: where the market is right now. Five cards, one per major asset, each show the current price, the 24-hour change and a small sparkline for the day's movement.
The headline promises prices that keep up with you, and the subline explains how: quotes streamed from every major venue and normalised into one book, so the number on the card matches the number in your portfolio and at checkout.
Below the cards, a stats strip backs up the scale behind it: $4.2B+ in assets tracked, 3M+ investors, 500+ connected exchanges and wallets, and 99.98% sync uptime. If the copy said the data was reliable, the section had to show the proof.
Every claim had to be backed by something visible. If the copy said the numbers agree, the interface next to it had to show those numbers.

In crypto, the biggest objection is the fear of losing funds. I gave security its own section with a direct headline, "We can read. We can never move.", backed by read-only keys, AES-256 encryption at rest, SOC 2 Type II controls and 24/7 monitoring.
Just above it, three simple steps set expectations:

This section is rebuilt around a real screen. On the left, the pitch: everything you need to run a crypto platform in one app, supported by four short cards covering trading flows, launch speed, multi-chain wallets and security. On the right, the wallet view as a user would see it on their phone.
The screen was chosen to prove the copy, not decorate it. It shows a total portfolio value with the 24-hour change, a chart with time ranges from one day to all time, an allocation breakdown by asset, and an insight that flags BTC as the largest holding at 54.98% before it crosses a concentration limit.
The cards say what the product does; the phone shows it already doing it. Two clear actions close the section: get started, or explore every feature in depth.
Throughout the page, I kept coming back to one principle from the design system:
The number is the interface.
If people can see it, they're more likely to believe it. Here's how that showed up across the page:

Deep green-black surfaces keep a busy market feeling calm, a single Vestra green carries every action, and gains and losses are always paired with a sign and a caret so colour is never the only signal.
#0A1614Dark theme surface#0E2B2EHero gradient#0B8058Primary actions#10B981Logo and highlightsColours and components taken from the Vestra designs.
The generic fintech structure looked finished but said nothing. Ordering the page by the questions a careful investor asks gave every section a reason to exist.
In a category built on trust, every claim needed something visible beside it: real numbers, a real screen and a security section that answers the hardest question directly.
Thanks for reading!
A mobile website for a Lagos brokerage built around neighbourhood specialists, so people can discover, compare and view homes with someone who knows the street.
From onboarding to booking a viewing and talking to a specialist.
Ikoyi, VI, Lekki, Oniru, Ikate, Chevron, Osapa and Ajah, each with its own guide.
Every listing leads back to a person who knows the street.
Chat, audio call and video call for virtual viewings.
Buyers and renters piece together listings from scattered sources, can't easily tell which homes are genuine or fairly priced, and rarely know who to trust once they find one they like. Agents cover the whole city, so local knowledge gets lost.
Most Lagos agents sell everywhere and know nowhere. We built the opposite.
CW's whole model rests on local knowledge, so I started with the people it serves: what makes house-hunting in Lagos stressful, where trust breaks down, and what someone needs to feel confident enough to book a viewing.
Buying or renting on the island, browsing on their phone between meetings
Most agents cover the whole city, so buyers rarely get honest, street-level advice on whether a property is worth it.
Listings show the house but not the area: security, lifestyle, commute and how prices compare.
Going from liking a listing to standing inside it means calls, messages and waiting, so good homes get missed.
I mapped the journey from first opening the site to booking a viewing, to see where doubt and effort pile up, and where CW's specialists could make the difference.
Scroll sideways to see the full map →
| Stages | Discover | Search | Evaluate | Connect | View |
|---|---|---|---|---|---|
| Actions | Open the site, read the intro, browse featured homes | Pick a neighbourhood, set type, budget and filters | Compare listings, read details and the area guide | Message, call or video-call the specialist | Choose a day and time, confirm the viewing |
| Goals | Get a feel for what's available | Narrow down to homes that fit | Decide if a home is worth seeing | Get honest answers fast | See the home with as little hassle as possible |
| Touchpoints | Onboarding, homepage | Property search, filters, results | Property details, neighbourhood guide | Agent profile, chat, audio and video call | Schedule a viewing, saved properties |
| Emotions | 🙂Hopeful | 😐Overloaded | 🤨Doubtful | 😣Impatient | 😊Relieved |
| Pain points | Generic portals that feel cold and crowded | Too many results that don't match | No way to judge the area or the price | Slow replies from agents who don't know the street | Arranging a visit takes days of calls |
| Opportunities | A warm, editorial welcome and featured homes | Search by neighbourhood, popular searches and a live result count | Neighbourhood guides with average prices and why people live there | One named specialist per area, with chat and calls built in | Book a viewing in one screen |
With the journey mapped, I turned each opportunity into a question for the design, then mapped the flows and structure before designing the screens.
…let people search the way Lagosians think, by neighbourhood?
…help someone judge an area before they ever visit?
…put a real local expert one tap away from every listing?
…turn "I like this home" into a booked viewing in minutes?
I mapped the core flows end to end to define the scope and keep every path to a viewing as short as possible.
The menu mirrors how CW works: homes, the neighbourhoods they sit in, and the people who know them.
Instead of a generic listings site, every part of the experience points back to a neighbourhood and the person who knows it best.
Start from where you want to live, with popular searches and every area one tap away.
Clear prices, key facts and neighbourhood guides help people judge a home before they visit.
Message, call or video-call the local expert, then book a viewing in a few taps.
Onboarding opens on a real home and a simple promise: "A place to call home." The homepage gets straight to work with "Find a place worth coming home to.", a neighbourhood search and featured listings.


People search by area, property type or budget, switch between sale and rent, and pick from popular searches like "3 bed in Lekki". Filters live in a bottom sheet with location, type, bedrooms, a price range and amenities, and the button tells you exactly how many properties match.



Each property leads with large photos, the price in naira, its location and key facts at a glance, with "Contact agent" and "Schedule a viewing" always at the bottom of the screen. Booking takes one screen: pick a day, a time and add your details.


Every area has its own guide, like Ikoyi's "Quiet luxury in the heart of Lagos.", with properties, average price, specialists and why people live there. Specialist profiles show live listings, deals closed and years with CW, so you know who you're dealing with.


Messaging feels familiar, with shared listings and voice notes inside the chat. Audio and video calls make virtual viewings possible, so a buyer can walk through a home without crossing the city.


A serif display face gives CW the feel of a considered brand rather than a listings portal, paired with a clean sans for everything practical. Warm off-white surfaces, near-black actions and generous photography let the homes do the talking.
#171717Text and primary actions#F6F4EFPage background#EDEBE5Cards and toggles#9A9791Muted labelsTypography and colours taken from the CW Real Estate designs.
Sign-in explains why it's worth it: save properties, track viewings and message your specialist. Even an empty saved list points somewhere useful, with a single "Start exploring" button.



CW's difference is its specialists, so they show up everywhere: on neighbourhood guides, profiles, chats and calls. Trust comes from knowing who you're talking to.
From an empty saved list to a property page, each screen ends in a clear action, which keeps people moving from browsing to booking a viewing.
Thanks for reading!