UI + Product Designer specialising in scalable design systems, component libraries, and user-centred interfaces. Currently dipping my toes into vibe coding.
Design & Systems > Figma|Token Studio|Github Actions| > Photoshop|Illustrator|Confluence|
Development > HTML5|CSS3|Sass|JavaScript|Git|Claude Code|
Marketing Management-NEW — Solo Product Designer → Product Lead
Senapt LTD
From Mid UI to Product Design Lead: Building Enterprise Software in a Startup
Overview: Built from scratch to unify fragmented marketing operations across 4 departments, replacing manual Excel workflows with real-time data visibility. Grew from Mid UI Designer to co-owning product strategy
Seven months in, I found myself presenting, not just a complex UI dashboard app, but a design system to a room full of engineers. This wasn't in the job description for Mid UI Designer.
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Frontend onboarded when I had one approved screen and no component library. The pressure to deliver while building infrastructure forced systematic thinking from day one—I couldn't design every screen individually and maintain velocity
Reusable components became necessity, not aspiration. That foundation became a company-wide design system by month 15
Building component library from scratch in parallel
Creating user flows with incomplete requirements
Invented async collaboration system (+8 hour timezone gap)
Outcome: This was sink or swim. Partnered deeply with Backend, validated with Marketing Lead continuously
Strategic Influence
Facebook API approval first try (design met their requirements from the start)
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."
Building design infrastructure in an engineer-first startup with zero precedent
Overview: Built a production-ready design system from scratch as a solo mid-level designer in an engineer-first startup. Solved JavaFX (zero references), 8-hour timezone gaps, and CEO resistance. Result: 90% QA reduction, company-wide adoption, and 1,920 hours saved through systematic reuse.
CEO rejected my design system pitch. So I built it anyway, proved it worked, and got him to mandate it company-wide 15 months later.
Skills & Technologies:
Design Systems
Token Architecture
JavaFX
GitHub Actions
Async Collaboration
JavaFX (main product)
React, Flutter, Vue, Nuxt
Token Studio
Figma Dev Mode
DTCG specification compliant
Multi-platform support
Automated transformation
Proper token referencing
Non-destructive testing
Deprecation management
Impact & Results:
90% — QA reduction
864 — Production tokens
40+ — Components
7 — Projects adopted
Key Contributions:
Phase 1: Foundation
Basic 2-layer token system (Core → Semantic)
~150 tokens, initial component library
CSS variables as output
Naming conventions still messy
Outcome: Established blue primary palette and neutral scale (950→0) that stuck throughout
Overview: After hunting down backend engineers to map a process no one fully understood, I built a customer-facing tracker that replaced reactive 'we'll email you' communication with proactive self-service, saving CS from a lot of anxious phone calls.
No one—not customer service, not backend devs—could explain how the UK energy switching process worked. So I became an amateur backend archaeologist.
Skills & Technologies:
Product Design
UI/UX
B2C
Mobile-First
Data Visualization
Mobile-first design
Figma prototyping
Standard web tech
Backend API integration
Tomato brand system
Impact & Results:
Real time — Transparent journey
1 — Magic link
Customer — Self-diagnosis tool
1 — Source of truth
+15 System States — Translated backend states like into human language
Self-error diagnosis — Customer has autonomy to understand their journey
1 Magic Link — From unreliable email system to just one click
Key Contributions:
Understanding the Market
Researched UK energy market as non-UK resident
Customer service couldn't help—directed me to backend team
Got technical flow diagram that meant nothing to customers (nor me)
Verdict: ''No one knows the full picture''
Outcome: Built foundational understanding from scratch
Translation & Mapping
Translated backend states into human language
Noted two distinct customer paths: smart vs traditional meters
Simplified and categorised errors into 3 large groups: application, switching, technical
Got re-familiarised with Tomato's playful brand assets and tone
Outcome: Created comprehensive error taxonomy and journey maps
Design & Prototype
Designed mobile-first tracking interface
Built interactive prototypes for both journey types
Created loading animations with bouncing tomatoes
Documented micro-interactions for brand personality
Outcome: Complete journey prototypes covering all error scenarios
Handoff & Launch
Got stakeholder approval
Prepared comprehensive documentation
Handed off to future frontend team
Returned to main project
Outcome: Clean handoff with animation specs and edge case documentation
Solutions Delivered
Application — "We've received your switch request"
Switch Initiation — "Your current supplier has been notified"
Approval — "Good news! Your switch is approved for [date]"
Meter reading — "Collecting data! Your first bill will be issued by [date]."