01
Technource ERP
Enterprise Product / UX / Frontend
Web app · two modulesEight modules, one component library
Asset slot
1440 × 900
1440 × 900
Asset slot
1440 × 900
1440 × 900
- Category
- Year
- Role
- Built with
First frametoLast commit.
I design interfaces and then build them. The handoff happens in my head.
Design is a decision. Code is the proof.
Design is
a decision.
Code is
the proof.
Nearly four years across interface design and frontend engineering — most of it on products where the design had to survive contact with real data, real roles and real deadlines.
I work in Figma and in the repository, usually on the same afternoon. Systems first, then the components that implement them. The part most people call handoff is where I do my best work — because there isn’t one.
Selected work
02
CrushWithMe
Social / Dating / Creative DevelopmentMotion as the first impression.
A marketing site for a social product, where the interface had to do the persuading. Scroll-linked reveals, pinned sections and timeline transitions carry the narrative — and an interactive Three.js scene in the hero responds to both scroll and pointer.
Scene · live WebGL
Marketing site · two moments
Asset slot
1440 × 900
1440 × 900
Asset slot
1440 × 900
1440 × 900
Scroll-linked reveals, pinned sections
RendererScrollInputFallback
- Category
- Year
- Role
- Built with
03
WeAll
Product Design / Social Networking / UXA social product, designed end to end.
App screens · designed end to end
Asset slot
393 × 852 pt
393 × 852 pt
Asset slot
393 × 852 pt
393 × 852 pt
- Category
- Year
- Role
- Built with
04
MyVitalView
Healthcare / Product / Frontend
Clinical data, made legible.
A healthcare platform with four portals behind it — Care Provider, Staff, Client and Admin — plus a multilingual, server-rendered marketing site. The whole brief was legibility: vitals, care plans and alerts read correctly at a glance, by people who are busy.
Four portals · two of them
Asset slot
1440 × 900
1440 × 900
Asset slot
1440 × 900
1440 × 900
- Category
- Year
- Role
- Built with
No
handoff.
Design and engineering are one pipeline, not two teams passing files. Six stages — and I work in all of them.
Decisions get made here, cheaply.
Layout, hierarchy and states, resolved while they still cost nothing to change. Most of the thinking is done before a component exists.
Type, space, colour, states.
Choices become rules: a type scale, a spacing rhythm, a colour set, the states every component owes. This is the part that makes the next hundred screens fast.
One thing, every state it can be in.
Default, hover, focus, active, loading, empty, error, disabled. A component is not finished when it looks right — it is finished when it cannot look wrong.
React, TypeScript, real data.
The implementation is where design assumptions get tested. Real content is longer than the mock, the API is slower, and the edge case shows up on day one.
Timing, easing, feedback.
Motion is the last 5% that decides whether the thing feels considered. Durations, easings, and knowing which elements should not move at all.
Performance, access, then live.
Budgets, keyboard paths, contrast, reduced motion. Shipping is a design stage, not an afterthought — it is where the work either holds up or does not.
StageDraw
Taste is a
technical skill.
Experience
Now
Based
Works in
The interesting decisions in interface work are not visual ones. They are decisions about what a component owes, which states are real, and what happens when the data is longer than the mock.
I have spent nearly four years moving between those two positions. Enterprise products where a permission model has to be legible to eight different roles. A healthcare platform where a threshold matters more than a chart. A social product designed end to end, then a marketing site hand-built to match it.
Now I lead that work: design direction and frontend architecture, design systems that hold up past their first screen, and the client conversations where scope and reality get reconciled. I care about performance and accessibility for an unglamorous reason — they are the parts of a design that are easiest to claim and hardest to fake.
I would rather ship one interface that holds together than ten that photograph well.
Experience
- Leadership
UI/UX & Frontend Lead
Leading interface design and frontend delivery: design direction, architecture decisions, code review, and the client conversations that shape both.
Design directionFrontend architectureDesign systemsClient communication - Product
Web & UI/UX Designer
Designed and built product interfaces across enterprise and consumer work — moving from Figma into React in the same week, on the same problem.
Product UI/UXReactNext.jsComponent libraries - Craft
Web Designer
Where the fundamentals were set: layout, type, and the habit of building what I drew rather than handing it over.
LayoutTypographyHTML / CSSWordPress
Toolkit
Engineering
What I build in.- React.js
- Next.js
- TypeScript
- JavaScript
- HTML
- CSS
- SASS
- REST APIs
Interface
How it gets drawn.- Figma
- Design systems
- UX design
- Product design
- Prototyping
Motion & 3D
Where it comes alive.- GSAP
- ScrollTrigger
- Three.js
- Creative development
Systems & tooling
What holds it together.- Tailwind CSS
- Shadcn UI
- Bootstrap
- WordPress
AI-assisted workflow
Part of the toolchain now.- Cursor
- Claude
- ChatGPT
- Antigravity
AI-assisted tooling sits in the workflow the same way a linter does — useful, supervised, and not a substitute for knowing what the interface should do.
Send me
the hard
one.
Email
Product work, design systems, and interfaces that have to survive real use. If the problem is genuinely difficult, lead with that.
ElsewhereLinkedIn ↗
Based23.02°N / 72.57°E