One window for the whole revenue motion.

Product Design / 0→1 B2B SaaS / 2025

Kris@Work is an AI-native go-to-market engine that collapses 15+ disconnected sales tools into a single, context-aware workspace — so SDRs, AEs, and CSMs stop administrating and start selling. This is the story of designing it from a blank canvas.

Capture · SDR

Find and engage the right prospects, at the right time. Kris surfaces the accounts most likely to convert and equips the rep to reach them, so the morning stops being a guessing game.

Close · AE

Win more deals, faster, smarter, more predictably. Kris keeps every deal moving with proactive signals and prep handled at each step, so a 40-deal pipeline stops hiding the eight that are actually alive.

Expand · CSM

Retain customers and grow accounts before signals go cold. Kris keeps every account visible, flags churn risk early, and surfaces upsell the moment conditions are right.

Timeline

9 months · discovery → v1 launch

Role

Lead Product Designer — research, IA, interaction & visual design, design system

Focus

Research · IA · Design system · Data-viz

Every lost dollar traced back to the same three gaps.

How might we give every rep one shared context, live guidance on what matters now, and an assistant that executes — so attention goes to buyers, not tools?

"I'm the only place the story lives"

Tool fragmentation: 15+ disjointed tools, each holding one fragment of the account. The rep is the only place the full story exists, and it lives in memory, not the system.

"I never know which 8 matter today"

No real-time guidance: an AE carries 40+ open deals with no live signal on which 8 need action today. Prioritisation is a gut feel, repeated every morning, at scale, and often wrong.

"Every tool tells me what to look at"

Productivity loss: none of them do the work. Research, drafting, CRM hygiene, and call prep are all still manual, all still stealing selling time.

Transparency

Every suggestion shows its why. Scores and flags expand into the plain-language signals and sources behind them — no black boxes, a rep can always audit the reasoning before acting.

Human-in-the-loop

Kris drafts, the rep sends. The assistant does the work — research, messages, CRM updates, prep — and hands it over. Nothing irreversible happens without a person in the last seat.

Graceful states

Empty means "here's what to do." No account yet, no signal yet, no draft yet — every empty and error state is written as a next action, never a dead end.

Who actually opens this every morning

The Prospector — "Priya"

• Books meetings first, admin second
• Opens 6 tabs to research one account, copy-pastes between them
• Needs a ranked list of who to work today, not a gut call

The Closer — "Marcus"

• Updates the CRM Friday from memory, preps calls in the last 10 minutes
• "By the time a deal looks dead, it's been dead two weeks"
• Needs live deal health and a clear "act on these 8"

The Keeper — "Elena"

  • • Rebuilds account context from scratch after every AE handoff

  • • "I get the logo and a Slack thread — the 'why' just evaporates"

  • • Needs everything the AE knew, plus early warning before churn

Key insights

Context is the product

Reps don't want more data; they want the assembled story. The unit of design is the account, not the tool.

Prioritisation is the daily job

The single most repeated pain was "who do I work today?" A ranked, reasoned action list earns trust faster than any feature.

The handoff is sacred

If nothing resets between SDR, AE, and CSM, three of the five revenue leaks close at once. This became the architectural constraint.

AI has to show its work

Reps will ignore a black box. Every AI suggestion needed a visible "why" or it wouldn't get acted on.

Speed beats completeness

Up and running in 15 minutes, not a six-week implementation — the hard constraint that shaped every default.

The token layer

Why only two accents? Colour is semantic before it's aesthetic — emerald always means recovered revenue and healthy state, vermilion always means leak, risk, and urgency. A rep learns the language once and reads any screen at a glance.

Unified account context

Account timeline + signal panel. The canonical Kris view: unified account history on the left, live signals and next actions on the right.

Breadcrumb depth as context. "Capture › Close › Expand › Today" — the trail doubles as a stage indicator, critical when the same account moves from SDR to AE to CSM without losing its history.

Vermilion glow = pre-attentive risk detection. At-risk accounts get a soft red halo scaled to churn signal strength — visible from across the room before reading a single word.

History and signals stay side by side. The same account visible spatially and textually at once; selecting either highlights the other — no tab-switch to catch up.

Priority and reason, together. Every card shows the score and the plain-language why behind it — no drill-down needed to trust it.

Counts as reassurance. The "8 of 42 need action" badge answers "am I seeing everything?" — a trust device, not decoration.

The Today view

Today — Marcus (AE), with the account brief slide-over open on the left.

The priority badge answers first. "P1" in red — one glance, one letter. Everything else is elaboration.

Dollar figures wear their weight. $120k rendered larger than $31k — deal size is legible before a label is read.

Stages split roles, not features. Capture / Close / Expand mirror the three roles who touch this account.

"Why now" answers the second question. Champion quiet, renewal in 21 days — the reasoning sits right under the priority, not behind a click.

Account brief

Account brief. Score card → key contacts → plain-language reasoning → engagement timeline.

Plain-language first, CRM fields second. The reasoning reads like a colleague explaining it; the raw activity log is one click deeper for the analyst. Progressive disclosure keyed to persona.

The DRAFT chip is a soft outline, not a fill. Status must be visible but can't read as "already sent" — outline chips sit one visual level below filled semantic color.

Tabs carry counts. "Contacts (4) · Signals (7)" — the tab bar is itself a summary of account activity.

Segmented insights. Timeline / Engagement / Buying Group — three analytical lenses without leaving the account.

The recovered bar

Recovered revenue. 58% captured, funnel-stage leak list, leak-distribution donut, deal-size scatter.

One number for the boardroom. The 58% in display-size emerald is the whole executive summary — honest, not triumphant; the color scale maps to gain vs. leak.

Leak categories = the rep's mental model. Prospecting, Pipeline, Handoff, Expansion — named exactly as reps already talk about them, so the design doesn't rename the problem.

Bar + stat tiles answer different questions. "How much revenue is recovered?" vs. "what changed for the rep, today?" — impact made visual at two altitudes.

Stat tiles stay neutral. Time-saved and cost metrics use ink and paper tones, never emerald or vermilion — palette discipline holding under pressure.

Today workspace. Ranked, reasoned action list — priority and reason on the card, no drill-down to know why it's here.

Account brief workspace. Assembled brief + editable draft on one surface — the tab-switch, gone.

Design System

Design

Information Architecture

User Flow & wireframe

Evaluative research

Phase 1

Phase 2

Map: Before implementation, officers relied on pdf maps or had to visit specific car parks to determine where CCTVs and gantries were located

Lots allocation

There are many types of parking lots, and officers reported that there was no overview of what kinds of lots specific car parks have

Data visualization

To improve consistency and efficiency of the design system,
I was responsible for creating new components that were used by other designers and engineers

Retrospective

What I'd revisit: I'd test AI-trust patterns earlier — reasoning chips and the DRAFT-vs-sent distinction only landed in week six, and reps' skepticism about the priority ranking would have surfaced sooner with a rougher prototype in week two. I'd also invest in mobile sooner instead of treating it as a later pass, since reps update deals between meetings, not just at their desks.

What worked: Designing around the account, not the tool, was the decision that made everything else easier — once Capture, Close, and Expand shared one context, features stopped competing for space and started completing each other. Leading with a decision, the Today view, instead of a dashboard also proved out: reps opened Kris@Work because it told them what to do next, not because it had more data to browse. And treating trust as a UI, not a promise, turned out to be the quiet backbone of the whole design.

Tradeoff: One of the calculated risks I helped the team take was letting Kris draft outreach and next steps without a person approving every underlying data pull. We partnered with engineering to keep a human in the last seat for anything that left the building — sends, logs, edits — while letting the assistant work freely everywhere else. Looking back, we'd have shipped a measurement layer for the assistant itself sooner; without it, we spent longer than I'd have liked reading qualitative signal instead of usage data.

One window for the whole revenue motion.

Product Design / 0→1 B2B SaaS / 2025

Kris@Work is an AI-native go-to-market engine that collapses 15+ disconnected sales tools into a single, context-aware workspace — so SDRs, AEs, and CSMs stop administrating and start selling. This is the story of designing it from a blank canvas.

Capture · SDR

Find and engage the right prospects, at the right time. Kris surfaces the accounts most likely to convert and equips the rep to reach them, so the morning stops being a guessing game.

Close · AE

Win more deals, faster, smarter, more predictably. Kris keeps every deal moving with proactive signals and prep handled at each step, so a 40-deal pipeline stops hiding the eight that are actually alive.

Expand · CSM

Retain customers and grow accounts before signals go cold. Kris keeps every account visible, flags churn risk early, and surfaces upsell the moment conditions are right.

Timeline

9 months · discovery → v1 launch

Role

Lead Product Designer — research, IA, interaction & visual design, design system

Focus

Research · IA · Design system · Data-viz

Every lost dollar traced back to the same three gaps.

How might we give every rep one shared context, live guidance on what matters now, and an assistant that executes — so attention goes to buyers, not tools?

"I'm the only place the story lives"

Tool fragmentation: 15+ disjointed tools, each holding one fragment of the account. The rep is the only place the full story exists, and it lives in memory, not the system.

"I never know which 8 matter today"

No real-time guidance: an AE carries 40+ open deals with no live signal on which 8 need action today. Prioritisation is a gut feel, repeated every morning, at scale, and often wrong.

"Every tool tells me what to look at"

Productivity loss: none of them do the work. Research, drafting, CRM hygiene, and call prep are all still manual, all still stealing selling time.

Transparency

Every suggestion shows its why. Scores and flags expand into the plain-language signals and sources behind them — no black boxes, a rep can always audit the reasoning before acting.

Human-in-the-loop

Kris drafts, the rep sends. The assistant does the work — research, messages, CRM updates, prep — and hands it over. Nothing irreversible happens without a person in the last seat.

Graceful states

Empty means "here's what to do." No account yet, no signal yet, no draft yet — every empty and error state is written as a next action, never a dead end.

Who actually opens this every morning

The Prospector — "Priya"

• Books meetings first, admin second
• Opens 6 tabs to research one account, copy-pastes between them
• Needs a ranked list of who to work today, not a gut call

The Closer — "Marcus"

• Updates the CRM Friday from memory, preps calls in the last 10 minutes
• "By the time a deal looks dead, it's been dead two weeks"
• Needs live deal health and a clear "act on these 8"

The Keeper — "Elena"

  • • Rebuilds account context from scratch after every AE handoff

  • • "I get the logo and a Slack thread — the 'why' just evaporates"

  • • Needs everything the AE knew, plus early warning before churn

Key insights

Context is the product

Reps don't want more data; they want the assembled story. The unit of design is the account, not the tool.

Prioritisation is the daily job

The single most repeated pain was "who do I work today?" A ranked, reasoned action list earns trust faster than any feature.

The handoff is sacred

If nothing resets between SDR, AE, and CSM, three of the five revenue leaks close at once. This became the architectural constraint.

AI has to show its work

Reps will ignore a black box. Every AI suggestion needed a visible "why" or it wouldn't get acted on.

Speed beats completeness

Up and running in 15 minutes, not a six-week implementation — the hard constraint that shaped every default.

The token layer

Why only two accents? Colour is semantic before it's aesthetic — emerald always means recovered revenue and healthy state, vermilion always means leak, risk, and urgency. A rep learns the language once and reads any screen at a glance.

Unified account context

Account timeline + signal panel. The canonical Kris view: unified account history on the left, live signals and next actions on the right.

Breadcrumb depth as context. "Capture › Close › Expand › Today" — the trail doubles as a stage indicator, critical when the same account moves from SDR to AE to CSM without losing its history.

Vermilion glow = pre-attentive risk detection. At-risk accounts get a soft red halo scaled to churn signal strength — visible from across the room before reading a single word.

History and signals stay side by side. The same account visible spatially and textually at once; selecting either highlights the other — no tab-switch to catch up.

Priority and reason, together. Every card shows the score and the plain-language why behind it — no drill-down needed to trust it.

Counts as reassurance. The "8 of 42 need action" badge answers "am I seeing everything?" — a trust device, not decoration.

The Today view

Today — Marcus (AE), with the account brief slide-over open on the left.

The priority badge answers first. "P1" in red — one glance, one letter. Everything else is elaboration.

Dollar figures wear their weight. $120k rendered larger than $31k — deal size is legible before a label is read.

Stages split roles, not features. Capture / Close / Expand mirror the three roles who touch this account.

"Why now" answers the second question. Champion quiet, renewal in 21 days — the reasoning sits right under the priority, not behind a click.

Account brief

Account brief. Score card → key contacts → plain-language reasoning → engagement timeline.

Plain-language first, CRM fields second. The reasoning reads like a colleague explaining it; the raw activity log is one click deeper for the analyst. Progressive disclosure keyed to persona.

The DRAFT chip is a soft outline, not a fill. Status must be visible but can't read as "already sent" — outline chips sit one visual level below filled semantic color.

Tabs carry counts. "Contacts (4) · Signals (7)" — the tab bar is itself a summary of account activity.

Segmented insights. Timeline / Engagement / Buying Group — three analytical lenses without leaving the account.

The recovered bar

Recovered revenue. 58% captured, funnel-stage leak list, leak-distribution donut, deal-size scatter.

One number for the boardroom. The 58% in display-size emerald is the whole executive summary — honest, not triumphant; the color scale maps to gain vs. leak.

Leak categories = the rep's mental model. Prospecting, Pipeline, Handoff, Expansion — named exactly as reps already talk about them, so the design doesn't rename the problem.

Bar + stat tiles answer different questions. "How much revenue is recovered?" vs. "what changed for the rep, today?" — impact made visual at two altitudes.

Stat tiles stay neutral. Time-saved and cost metrics use ink and paper tones, never emerald or vermilion — palette discipline holding under pressure.

Today workspace. Ranked, reasoned action list — priority and reason on the card, no drill-down to know why it's here.

Account brief workspace. Assembled brief + editable draft on one surface — the tab-switch, gone.

Design System

Design

Information Architecture

User Flow & wireframe

Evaluative research

Phase 1

Phase 2

Map: Before implementation, officers relied on pdf maps or had to visit specific car parks to determine where CCTVs and gantries were located

Lots allocation

There are many types of parking lots, and officers reported that there was no overview of what kinds of lots specific car parks have

Data visualization

To improve consistency and efficiency of the design system,
I was responsible for creating new components that were used by other designers and engineers

Retrospective

What I'd revisit: I'd test AI-trust patterns earlier — reasoning chips and the DRAFT-vs-sent distinction only landed in week six, and reps' skepticism about the priority ranking would have surfaced sooner with a rougher prototype in week two. I'd also invest in mobile sooner instead of treating it as a later pass, since reps update deals between meetings, not just at their desks.

What worked: Designing around the account, not the tool, was the decision that made everything else easier — once Capture, Close, and Expand shared one context, features stopped competing for space and started completing each other. Leading with a decision, the Today view, instead of a dashboard also proved out: reps opened Kris@Work because it told them what to do next, not because it had more data to browse. And treating trust as a UI, not a promise, turned out to be the quiet backbone of the whole design.

Tradeoff: One of the calculated risks I helped the team take was letting Kris draft outreach and next steps without a person approving every underlying data pull. We partnered with engineering to keep a human in the last seat for anything that left the building — sends, logs, edits — while letting the assistant work freely everywhere else. Looking back, we'd have shipped a measurement layer for the assistant itself sooner; without it, we spent longer than I'd have liked reading qualitative signal instead of usage data.

One window for the whole revenue motion.

Product Design / 0→1 B2B SaaS / 2025

Kris@Work is an AI-native go-to-market engine that collapses 15+ disconnected sales tools into a single, context-aware workspace — so SDRs, AEs, and CSMs stop administrating and start selling. This is the story of designing it from a blank canvas.

Capture · SDR

Find and engage the right prospects, at the right time. Kris surfaces the accounts most likely to convert and equips the rep to reach them, so the morning stops being a guessing game.

Close · AE

Win more deals, faster, smarter, more predictably. Kris keeps every deal moving with proactive signals and prep handled at each step, so a 40-deal pipeline stops hiding the eight that are actually alive.

Expand · CSM

Retain customers and grow accounts before signals go cold. Kris keeps every account visible, flags churn risk early, and surfaces upsell the moment conditions are right.

Timeline

9 months · discovery → v1 launch

Role

Lead Product Designer — research, IA, interaction & visual design, design system

Focus

Research · IA · Design system · Data-viz

Every lost dollar traced back to the same three gaps.

How might we give every rep one shared context, live guidance on what matters now, and an assistant that executes — so attention goes to buyers, not tools?

"I'm the only place the story lives"

Tool fragmentation: 15+ disjointed tools, each holding one fragment of the account. The rep is the only place the full story exists, and it lives in memory, not the system.

"I never know which 8 matter today"

No real-time guidance: an AE carries 40+ open deals with no live signal on which 8 need action today. Prioritisation is a gut feel, repeated every morning, at scale, and often wrong.

"Every tool tells me what to look at"

Productivity loss: none of them do the work. Research, drafting, CRM hygiene, and call prep are all still manual, all still stealing selling time.

Transparency

Every suggestion shows its why. Scores and flags expand into the plain-language signals and sources behind them — no black boxes, a rep can always audit the reasoning before acting.

Human-in-the-loop

Kris drafts, the rep sends. The assistant does the work — research, messages, CRM updates, prep — and hands it over. Nothing irreversible happens without a person in the last seat.

Graceful states

Empty means "here's what to do." No account yet, no signal yet, no draft yet — every empty and error state is written as a next action, never a dead end.

Who actually opens this every morning

The Prospector — "Priya"

• Books meetings first, admin second
• Opens 6 tabs to research one account, copy-pastes between them
• Needs a ranked list of who to work today, not a gut call

The Closer — "Marcus"

• Updates the CRM Friday from memory, preps calls in the last 10 minutes
• "By the time a deal looks dead, it's been dead two weeks"
• Needs live deal health and a clear "act on these 8"

The Keeper — "Elena"

  • • Rebuilds account context from scratch after every AE handoff

  • • "I get the logo and a Slack thread — the 'why' just evaporates"

  • • Needs everything the AE knew, plus early warning before churn

Key insights

Context is the product

Reps don't want more data; they want the assembled story. The unit of design is the account, not the tool.

Prioritisation is the daily job

The single most repeated pain was "who do I work today?" A ranked, reasoned action list earns trust faster than any feature.

The handoff is sacred

If nothing resets between SDR, AE, and CSM, three of the five revenue leaks close at once. This became the architectural constraint.

AI has to show its work

Reps will ignore a black box. Every AI suggestion needed a visible "why" or it wouldn't get acted on.

Speed beats completeness

Up and running in 15 minutes, not a six-week implementation — the hard constraint that shaped every default.

The token layer

Why only two accents? Colour is semantic before it's aesthetic — emerald always means recovered revenue and healthy state, vermilion always means leak, risk, and urgency. A rep learns the language once and reads any screen at a glance.

Unified account context

Account timeline + signal panel. The canonical Kris view: unified account history on the left, live signals and next actions on the right.

Breadcrumb depth as context. "Capture › Close › Expand › Today" — the trail doubles as a stage indicator, critical when the same account moves from SDR to AE to CSM without losing its history.

Vermilion glow = pre-attentive risk detection. At-risk accounts get a soft red halo scaled to churn signal strength — visible from across the room before reading a single word.

History and signals stay side by side. The same account visible spatially and textually at once; selecting either highlights the other — no tab-switch to catch up.

Priority and reason, together. Every card shows the score and the plain-language why behind it — no drill-down needed to trust it.

Counts as reassurance. The "8 of 42 need action" badge answers "am I seeing everything?" — a trust device, not decoration.

The Today view

Today — Marcus (AE), with the account brief slide-over open on the left.

The priority badge answers first. "P1" in red — one glance, one letter. Everything else is elaboration.

Dollar figures wear their weight. $120k rendered larger than $31k — deal size is legible before a label is read.

Stages split roles, not features. Capture / Close / Expand mirror the three roles who touch this account.

"Why now" answers the second question. Champion quiet, renewal in 21 days — the reasoning sits right under the priority, not behind a click.

Account brief

Account brief. Score card → key contacts → plain-language reasoning → engagement timeline.

Plain-language first, CRM fields second. The reasoning reads like a colleague explaining it; the raw activity log is one click deeper for the analyst. Progressive disclosure keyed to persona.

The DRAFT chip is a soft outline, not a fill. Status must be visible but can't read as "already sent" — outline chips sit one visual level below filled semantic color.

Tabs carry counts. "Contacts (4) · Signals (7)" — the tab bar is itself a summary of account activity.

Segmented insights. Timeline / Engagement / Buying Group — three analytical lenses without leaving the account.

The recovered bar

Recovered revenue. 58% captured, funnel-stage leak list, leak-distribution donut, deal-size scatter.

One number for the boardroom. The 58% in display-size emerald is the whole executive summary — honest, not triumphant; the color scale maps to gain vs. leak.

Leak categories = the rep's mental model. Prospecting, Pipeline, Handoff, Expansion — named exactly as reps already talk about them, so the design doesn't rename the problem.

Bar + stat tiles answer different questions. "How much revenue is recovered?" vs. "what changed for the rep, today?" — impact made visual at two altitudes.

Stat tiles stay neutral. Time-saved and cost metrics use ink and paper tones, never emerald or vermilion — palette discipline holding under pressure.

Today workspace. Ranked, reasoned action list — priority and reason on the card, no drill-down to know why it's here.

Account brief workspace. Assembled brief + editable draft on one surface — the tab-switch, gone.

Design System

Design

Information Architecture

User Flow & wireframe

Evaluative research

Phase 1

Phase 2

Map: Before implementation, officers relied on pdf maps or had to visit specific car parks to determine where CCTVs and gantries were located

Lots allocation

There are many types of parking lots, and officers reported that there was no overview of what kinds of lots specific car parks have

Data visualization

To improve consistency and efficiency of the design system,
I was responsible for creating new components that were used by other designers and engineers

Retrospective

What I'd revisit: I'd test AI-trust patterns earlier — reasoning chips and the DRAFT-vs-sent distinction only landed in week six, and reps' skepticism about the priority ranking would have surfaced sooner with a rougher prototype in week two. I'd also invest in mobile sooner instead of treating it as a later pass, since reps update deals between meetings, not just at their desks.

What worked: Designing around the account, not the tool, was the decision that made everything else easier — once Capture, Close, and Expand shared one context, features stopped competing for space and started completing each other. Leading with a decision, the Today view, instead of a dashboard also proved out: reps opened Kris@Work because it told them what to do next, not because it had more data to browse. And treating trust as a UI, not a promise, turned out to be the quiet backbone of the whole design.

Tradeoff: One of the calculated risks I helped the team take was letting Kris draft outreach and next steps without a person approving every underlying data pull. We partnered with engineering to keep a human in the last seat for anything that left the building — sends, logs, edits — while letting the assistant work freely everywhere else. Looking back, we'd have shipped a measurement layer for the assistant itself sooner; without it, we spent longer than I'd have liked reading qualitative signal instead of usage data.

Create a free website with Framer, the website builder loved by startups, designers and agencies.