Based in London, United Kingdom
Hello, I'm Vivien, a Senior Product Designer in London.
I design trust and safety in payments at JP Morgan & Chase — and I build what I design. This desktop is hand-written, and so is everything behind The Lab.
- Persuasive Emotional Design
- Design Tradeoffs & UX Decision-Making
- Facilitating UX Workshops
- Complex Apps for Specialized Domains
Worked with
For fun
Selected work
Complex systems, made to feel simple.
Three case studies across automotive payments, retail livestreaming and enterprise merchant onboarding, plus a 48-hour AI hackathon.
Currently building
Side projects I design and build myself.
A new one lands every few weeks. Leave an email and I will tell you when the next one ships — that is all it is used for, and one line back to me takes you off it.
Eleven of them. Five carry the story; the rest keep their write-ups behind a line.
Also built
About
Design that empowers, not just impresses.
I design trust and safety in payments at JP Morgan & Chase, and I build what I design. My work spans fintech, enterprise and AI — and, before design, five years in digital advertising, which is where the client-facing half of the job was learned. Accessibility and inclusive design are the parts I will argue about.
“Design experiences that are not only impactful but also practical — delivering solutions that genuinely empower users.”
Product design clients
- JP Morgan & Chase (Payments)
- QVC
- BT Group
- Upgrade Pack
- Ordre
- Sun Life Financial Insurance
- Attitude is Everything
Digital marketing clients
- Jack Wills
- Links of London
- Bare Minerals
- Dixons
- Currys PC World
- Ralph Lauren
- Hilton Worldwide
- and other luxury & retail brands
Trained by Nielsen Norman Group
- Persuasive Emotional Design
- Design Tradeoffs & UX Decision-Making
- Facilitating UX Workshops
- Complex Apps for Specialized Domains
Pastime
What I do with the rest of the week.
-
Travel
Thirty-one places so far, pinned on a map of the whole world.
-
Photography
Nature, architecture, dramatic skies.
-
Sound healing
Trained in Nepal in late 2024; hosts events in London.
-
Aerial arts
Hoops, silks and trapeze since summer 2024.
-
Volunteer design
Design guidelines for @buddhist.connected.hk, ongoing since March 2024.
Empty, apart from .DS_Store. It is always .DS_Store.
Everything comes back in 5:00.
Thirteen things that did not make it. Click one to see what it was. Emptying works, and it does not last.
About
One file, no build step.
This desk is a single HTML document: hand-written CSS, vanilla JavaScript, no framework, no bundler, no npm dependency, nothing loaded from a CDN. Every icon is an SVG drawn by hand in a 32×32 grid, and every game in here was written from scratch against the same window system as the case studies, so opening, dragging, closing and the phone layout come for free.
The windows are the pages: #work/apex-ai is served at /work/apex-ai/ with its own title and preview card, generated from this file so the two cannot drift apart. The few windows that are running programs rather than documents — this Trash, Paint, the games — keep an address but send you back to the desk, since they only work where they run. The singing bowls are synthesised in the browser rather than streamed — there is no audio file anywhere in this site.
Designed and built by Vivien Chin, London.
Seven bowlsResting
Strike a bowl
Synthesised here, in your browser — no recording, no audio file anywhere in this site. Notes follow the mapping sound practitioners use, root to crown, C through B; a Himalayan bowl beaten by hand is never exactly in tune, which is the point of the wobble. Strike all seven with the keys 1–7. Closing this window damps everything.
00:00:00
No alarm set. It rings only while this page is open, with the chime, and says so.
Keys work too, while this window is on top.
Slide the tiles back into a portrait. Click a tile beside the gap, or use the arrow keys.
Control Panels
Eight by eight, the way they came. The desk remembers which one you picked.
Drive A: — 3.5″ floppy
No disk in the drive. Pick a volume below and insert it.
Pastime
Photography & travel
Pastime
Everywhere so far
The world total is the 193 UN member states plus the 2 observer states. Hong Kong is a territory rather than a member state; it is pinned and counted here as a place. Land view shades the whole of every country visited, so the share is of the world's land area — Antarctica falls outside the map — and not of ground actually walked.
Preview
Screen saver
The desk sleeps after that long with no pointer, key or touch. Anything at all wakes it.
Contact
Let's build something thoughtful.
Based in London, United Kingdom. Open to conversations about product design in fintech, enterprise systems and AI-driven work.
Email is the surest way to reach me.
Currently exploring
© 2026 Vivien Chin · London
Résumé
Vivien Chin
Senior Product Designer · London, United Kingdom
Summary
I design trust and safety in payments at JP Morgan & Chase, and I build what I design. My work spans fintech, enterprise and AI — and, before design, five years in digital advertising, which is where the client-facing half of the job was learned. Accessibility and inclusive design are the parts I will argue about.
Experience
JP Morgan & Chase — Payments
London, UK · August 2022 – Present
- Manages initiatives across the payments portfolio, including KYB onboarding, Ring Project, SEPA checkout, SmartPay and Pay by Bank enhancements
Senior Product Designer — Fraud, Trust and Safety
2026 – Present
- Contributed to the development and implementation of Fraud Intelligence and Shield Experience, an advanced AI-driven fraud detection system that achieved a 40% reduction in fraudulent transactions during pilot testing.
Senior Product Designer — Mobility Payments Solution
2022 – 2025
- Worked on in-car payments across mobile, tablet and infotainment systems
- Conducted workshops and user research
- Built design systems using Google Automotive OS components
QVC — Product Designer
London, UK · April 2021 – July 2022
- Focused on video streaming products: live streaming, forums, onboarding
- Collaborated closely with researchers, developers and product managers
BT Group — Customer Experience Designer
London, UK · January 2020 – April 2021
- Designed end-to-end customer journeys for small business
- Facilitated workshops and defined KPIs
Ordre — Product Designer
London, UK · May – November 2019
- Fashion-tech company; created service blueprints, user journeys, wireframes, prototypes and style guides
Upgrade Pack — Junior UX Designer
London, UK · March – May 2019
- Fintech startup; conducted user research and usability testing
Threepipe — Account Manager
London, UK · April – September 2018
- Managed online media planning campaigns across SEO, Display, Social and PPC channels
Education
- Nielsen Norman Group — UX certificates, remote · 2023 – 2025
- General Assembly — User Experience Immersive, London · September – December 2018
- University of Western Ontario — Double Major, Criminology & Sociology · September 2009 – June 2013
Volunteer
- ADP List — Mentor · June 2023 – Present
- Design Club — Mentor · December 2019 – Present
- Tech Circus UX Crunch — November 2018 – 2020
JP Morgan & Chase UK
In-Car Payments
(Mobility Payments Solutions)
Background
Create a white label wallet for users to experience seamless In-Car Payments
A white label wallet on wheels, enabling users to make seamless and secure payments from their automotive operating system. Create wireframes, mock-ups, and prototypes that will serve as the foundation for a coded product and for pitching purposes utilising the Google Automotive OS.
Scenarios including:
- Device binding
- Wallet management flow
- Function on Demand (FOD)
- Quick service restaurant (QSR)
- EV Charging
- Parking
Key users
We are designing for drivers and passengers. That said, the demo app is for OEM brand partners who will own the customer journey.
Driving habits
- Daily commute (city & highway)
- Frequent quick errands and weekend trips.
- Heavy use of navigation, music, and hands-free calls.
Needs & Goals
- Seamless payments
- Efficiency
- Convenience
- Integration
- Security
“My car is basically my mobile office and entertainment hub. If I can pay for my coffee, charge up, and even unlock a new feature, all from the touchscreen, that's a game-changer for my busy life.”
Design challenges
With limited front-end developer assistance and restrictions imposed by the Automotive OS design system, we made necessary adjustments to ensure the experience is as realistic as possible, despite the limited content that can be integrated.
Pre-design research and workshops
Desk research / design
- Understand competitor landscape and In-Car Payment patterns
- Agree fidelity of designs / prototype — decide if the prototypes should be designed in certain brands / styles or white-labelled
Workshop preparation
- Agenda finalised with timings
- Dummy run of prototype & workshop
- Design updates as required for prototype
- Set up FigJam for the workshop with timings and agenda
Ideas
- Prioritising payment use cases (based on how long the journeys are from different scenarios)
- Prioritise exercise based on all the features brainstormed
- Create user flows and lo-fi screens
Mobility scenario workshops
- Short trips e.g. local errand (high frequency)
- Commuting e.g. going to work (higher frequency)
- Road trip e.g. going on a long journey / a road trip (low frequency)
Example: Scenario 2 — Sara, commuting to work
- Sara commutes for 1–2 hours per day and parks her car in the same car park every day.
- At the end of the working day, she reverses her drive and travels home and starts to plan her evening
Use case prioritisation & technical inputs
- DVF & strategic alignment (roadmap to ecosystem)
- Capture design considerations of prioritised use cases
Timeline
Various scenarios have been developed. For the infotainment system, we have been using the Google Automotive OS to develop the screens which works really well on the Samsung S9 tablet for demo.
Results
The wallet went from a blank page to a demo an OEM partner could sit in front of: six payment scenarios designed white-label on Google Automotive OS, shown on the stand at CES in 2024 and again in 2025. It secured the technical partnerships the programme was set up to win in 2023, and became the artefact the pitch for a first pilot client was built on.
6
payment scenarios designed
3
journey types prioritised
2×
shown at CES, 2024 & 2025
1
white-label spec, every OEM
Retrospective
🪚 Trade-off
The Automotive OS design system decides most of what a screen can look like, and we had limited front-end help. So the question stopped being "what is the best interface" and became "what is the most realistic thing we can put in a car and defend to an OEM". I designed to the constraint rather than around it — a demo a partner half-believes is worth less than a plainer one they can ship.
♟️ Prioritisation
Six use cases, one demo. We ranked them by journey length and frequency rather than by how interesting they were to design: a local errand, a daily commute and a road trip carry different payment moments, and the short, frequent ones earn their screen space. Parking and EV charging survived that cut; the more novel ideas did not.
🚦 Who it is really for
The user in the car is a driver, but the buyer is an OEM brand partner who will own the whole customer journey. Designing white-label was the decision that let one spec serve both — every brand can put its own skin on it without the payment logic changing underneath.
QVC Group
Livestreaming via Qurio App
(Presenter, Viewer and Moderator Flow)
Background
Create a livestreaming feature on the Qurio App
I designed a live shopping experience for QVC's social media app, Qurio, enabling creators to livestream product reviews, interact with viewers in real time, and answer questions directly. This feature supports presenter, viewer, and moderator roles, aligning with QVC's objectives to increase engagement, dwell time, and drive traffic back to the main site.
- Upcoming Live-stream widget — Upcoming live-streams are prioritised on the home screen so users know when they are happening
- Live-stream — Users can set up notifications for when live-streams start, so they can participate and ask questions
- Chats in Live-Streams — Users can give reactions or comments during the live-stream
Visual hierarchy tradeoffs (Problem)
The majority of our mature users have smaller screen-size phones
The average age of our users is 40–60; for their age group we increased the font size for better accessibility. To reduce cognitive load, we need to carefully consider button sizes and prioritise key features on the interface, making it easier for users to watch, ask questions, and interact with the host seamlessly.
Insights from user research (Host)
Hosts understood the logic of the live-streaming instantly
User interview with the host, from a host perspective, mainly testing:
- Could she understand the sequence for starting a livestream, and creating a thumbnail when the livestream has ended?
- Could she navigate across the features seamlessly during the live-streaming?
- Could she read all the comments that come through during the live-streaming? (Accessibility issue)
Insights from user research (with potential viewers)
Received positive / neutral comments on QVC presenters / guest involvement
Tested with 5 potential viewers. Mainly tested on:
- Could viewers understand the different types of badges, such as 'Ad', 'Live now', 'Qurio', 'live event recording', 'live now' and 'blue tick'?
- Could users understand if the cards are interactive? How useful are the 'reminder bells' 🔔 to them?
- What are viewers' interactions when they see the 'live now' banner, and what will their next steps be?
What user testing surfaced
- For upcoming live streams consider adding native functionality to add the reminder directly to users' device calendars
- For upcoming events, some participants missed more information on Special Value (TSV) items that will be featured in these live events
- 85% of the badges were understood by viewers
Timeline
Eight sprints across two months, in a team of five, with research running alongside design rather than ahead of it — the badge and reminder findings landed early enough to change what shipped.
Results
First livestreaming was a success
We emailed users and sent notifications ahead of the livestream, resulting in 32% of our user base joining the event. 13% of viewers submitted questions during the stream, while 74% engaged by using the 'hearts' feature to show support for the host.
32%
of the user base joined
13%
submitted questions
74%
used hearts
85%
badge comprehension
Retrospective
🪚 Trade-off
Letting go of a validated solution is never easy for a designer—especially when it feels like the best approach. However, smaller screen sizes significantly impact how users interact with content, which meant we had to carefully prioritise the most valuable features for both users and the business. This, combined with technical constraints, sparked a heated discussion around trade-offs.
♟️ Consider for scalability
While organising features by priority, I was concerned that the livestream interface might not support all desired functionality and could limit future scalability. To address this, I worked closely with the PM to explore potential capacity for future features and ensured the design remained flexible and adaptable for future iterations.
🚦 Alignment
With many stakeholders involved and substantial technical debt, I approached the project systematically—breaking down the logic step by step, validating feasibility with developers, and keeping all teams aligned through thorough documentation and clear communication.
JP Morgan & Chase UK
Merchant Onboarding
Activating payments and enabling payouts across web and mobile
Background
MPS allows merchants to edit multiple applications at the same time under the same email address
This feature is an add-on for merchants to work on a few applications at the same time.
Problem statements
Merchants face inefficiencies and delays during onboarding to multiple programs due to receiving Sign Up links instead of Sign In links and the lack of automatic Sign In flow for ongoing processes.
Problem 1
- Identification of the problem — Merchants receive Sign Up links instead of Sign In links when invited to additional programs, leading to inefficiencies.
- Impact — Redundant steps and wasted time.
Problem 2
- Identification of the problem — Multiple invites do not automatically trigger the Sign In flow for ongoing onboarding processes, causing delays.
- Impact — Delays and complications in completing additional onboardings.
User requirements
- As a user of a merchant that has already started onboarding to one program I want to receive an invite for onboarding to another program with Sign In link instead of Sign Up, so that I can save some time while starting the new onboarding
- As a user of a merchant who has received multiple invites to onboard to different programs while one of those onboardings has been started I want the rest of the invites to start Sign In flow for me, so that I can make the onboardings to other programs using the old invites
User flow
User story and high level flow.
Outcome
The flow detects an existing account at the invitation stage and sends a Sign In link rather than a Sign Up one, and routes every later invitation into the session the merchant already has open. The redundant account-creation steps that had been holding up onboarding to additional programmes come out of the journey entirely.
Retrospective
🪚 Trade-off
The obvious fix was a better sign-up screen. The right fix was to send a different link — the problem was never the form, it was that the invitation had already decided the merchant was a stranger. Moving the decision back to the invitation stage meant changing a backend behaviour rather than a page, which is a harder conversation and a smaller design.
♟️ Designing for the second time, not the first
Onboarding is usually designed for a merchant who has never been here before. This one is for a merchant who is already mid-application on another programme — the same person, a different state. Most of the work was deciding what the product should remember about them, and what it has to ask again for legal reasons even when it already knows the answer.
🚦 Working inside KYB
Nothing in a Know Your Business flow can be removed just because it is slow. Every step I took out had to be one that legal and QA agreed was redundant rather than merely inconvenient, which is why the change lands on routing and session handling and not on the checks themselves.
JP Morgan & Chase UK
APEX AI Assistant
48-hour internal hackathon — 6th of 32 teams
Background
As an employee with a busy schedule I need issues identified and resolved automatically / quickly so that it does not impact my work.
User stories
- As an employee who is part of a collaborative team I need a mechanism to flag to my team when I am experiencing tech issues
- As an employee I need to be able to identify tech-related issues as soon as they occur so that I do not get stuck in the middle of my work
- As an employee with a busy schedule I need issues identified and resolved quickly so that it does not impact my work
User research
We surveyed 18 people within the firm, who shared with us how they find the level of complexity of resolving tech issues internally. Tech issues are tedious and drag on for an extended period of time.
90%
of JPMC respondents have faced tech issues preventing them from doing their work
67%
say an issue can last more than 2 hours
34%
find it hard / very hard to resolve the tech issues
28% of respondents take longer than 2 days and up to a week to solve their issues.
Painpoints and drivers
Current tech hub chatbot relies on agent resolution and can only be accessed through the website.
What can APEX AI do?
- Identification — Identify when a user is experiencing a problem
- Learning — Assistant learns from various internal data sources and previous user queries
- Resolution — Easy fixes are automated; the assistant suggests fixes to user queries and can raise a ticket for the user, online or offline
Outcome
The concept placed 6th of 32 teams in 48 hours. The survey behind it — 18 colleagues, 90% of whom had lost working time to a tech issue and 28% of whom waited days for a fix — turned an anecdotal complaint into a quantified case for automating first-line resolution instead of routing every issue to an agent.
Side project
Ask Maria
An airfare assistant that lives in Telegram. You tell her where you'd rather be in plain English; she watches the fares and messages back only when there's something worth knowing.
Background
Price alerts tell you a number went down. They don't tell you whether the fare is worth taking, whether the seller is trustworthy, or what the trip actually costs once bags and self-transfers are counted. Maria is the version of that tool that answers those questions instead — in a chat, in the app people already have open.
How it works
- No commands, no forms — "anywhere sunny in half term, two of us, under £400 each" is a valid instruction. The interface is a conversation because the request is genuinely fuzzy, and a date picker would force a precision the traveller doesn't have yet.
- Two scheduled jobs, not a server — a launchd agent checks fares twice a day and a second one polls the inbox every minute, so she replies in about a minute without anything running in the foreground.
- Judgement, not just a number — each alert says whether she'd take the fare and why: seller screened against ATOL, IATA and Trustpilot, one-ways and baggage totalled, cheaper-but-worse options called out.
- Multi-user by invite — an invite table, per-user watchlists and price history in SQLite, so the beta can grow past one person.
Design decisions worth defending
- The copy makes no promise the system can't keep — no "24/7", no "instant", no cheapest-price guarantee. She "usually replies within a minute or two", and the footer states plainly that this is an information service, not a travel agent, which is a regulated description in the UK.
- The two quotes are labelled as mine, not as customers' — the design comp came with invented testimonials attached to invented people. Real results under a real name are worth less as marketing and more as trust.
- Signup is two steps on purpose — the landing page only carries an email across; the second page asks where you're dreaming of flying, which segments the waitlist from day one and tells me who to admit next.
Screens
Side project
SplitEasy
Splitwise-style expense splitter — multi-currency trips and a settle-up algorithm that reduces who-owes-who to the fewest transfers.
Background
Splitting a trip properly: several people, several currencies, and a final answer that is the shortest list of payments rather than a wall of balances.
How it works
- Fewest transfers — balances are settled by repeatedly matching the largest creditor against the largest debtor, so three people owing each other collapse into one or two payments.
- One base currency — expenses are entered in whatever was actually paid and converted through live rates, falling back to bundled rates offline.
- Splits must balance — the submit button stays disabled until the shares add up to the total.
Screens
Side project
InnerWaves
Tarot / I-Ching reading app with a retrieval layer and a feedback loop that turns well-rated readings into examples for future ones.
Background
A reading app covering tarot, I-Ching and angel numbers, in Traditional Chinese with an English toggle. The front end is a single static page; a Node server handles readings.
How it works
- Retrieval, not invention — reference knowledge for each drawn card or hexagram is injected into the prompt from a local dataset, so readings stay anchored to the source imagery rather than being improvised.
- Feedback loop — every reading is logged, and 👍-rated ones become few-shot examples for later prompts.
- Three modes — tarot spreads, I-Ching hexagrams and angel numbers share one interface.
Screens
localhost:8787 resolves there only.Side project
Attune
A sound-healing membership for ADHD, anxiety and sleep — brand, pricing and landing page, built to test demand before a single line of app code.
Background
Tibetan bowl sessions aimed at a specific nervous system rather than at "relaxation" in general. The product is three named sessions — Focus Flow (ADHD, 25 min), Regulate (anxiety and attachment, 10 min) and Wind Down (sleep, 20 min) — sold as a membership at £72 a year, with a £250 tier for work made to your intention.
How it works
- The app is deliberately not built yet — the sequence is waitlist, then payment links, then fulfilling the first members by hand, and only then application code. Three kill criteria decide whether that last phase happens at all.
- Named sessions, not a library — three sessions with a stated purpose each, rather than a content catalogue. No streaks, no badges, no app-blocking, no social feed; the product is meant to be closed, not returned to.
- Two tiers with a real difference — Core is the three sessions on your own schedule; Circle adds a monthly track composed for your intention, a live group session and a quarterly 梅花易數 reading paired with a custom track.
Screens
localhost:8794 resolves there only.Side project
Daily News Dashboard
Bilingual EN/粵語 newspaper-style briefing covering UK, London, Hong Kong and Global, rebuilt every morning.
Background
A daily paper written for one reader. It weights London first, keeps a Hong Kong section alongside UK and Global, and reads as a broadsheet rather than a feed — in English or Cantonese, at a tap.
How it works
- The model writes the content, code writes the layout — an agent gathers the day’s stories and emits a
data.json; a Python renderer owns every layout decision. Changing the design used to mean editing a prose spec and paying for a ten-minute generation to find out what it did. It now renders in milliseconds from yesterday’s data, and the same way twice. - Bounded, because it once wasn’t — an edit asking the agent to keep re-checking sources turned an eight-minute job into five consecutive runs of three to seventeen hours, unnoticed for five days. A budget written in a prompt is advisory; the wrapper that replaced it enforces a hard timeout that kills the whole process group, a lock against overlapping runs, and a dead-man’s switch — the only thing that catches a job that never started at all.
- Thirty feeds, each one verified — sources are checked rather than assumed, and the dead ones are written down so no run pays to retry them. Category-specific feeds exist so every filter chip has something behind it.
- Bilingual all the way down — every headline, summary, category, label and status line exists in both languages, so the toggle swaps the page rather than only the headlines.
Screens
What it changed
The failure and the success were visually identical: the job died, and yesterday’s front page sat there looking exactly like a page that had just been built. That is the shape of most AI failure inside a product — a model that returns nothing looks like a quiet day, and a confident wrong answer looks like the feature working. Neither trips the error states we spent a decade learning to design. So these are the questions I now ask in the same breath as “what does this feature do”:
- What does it look like when this returns nothing? Not an error — nothing.
- How does a person tell a confident answer from a correct one?
- Who finds out, and how, if it quietly stops?
- What is the honest thing to show while we don’t know yet?
Side project
Finance Hub
Personal finance dashboard — portfolio, spending, currency and an AI-written daily briefing. Figures are blurred in these screenshots.
Background
A dashboard that pulls broker and bank exports into one place and writes a plain-English briefing each morning. No database — everything is flat JSON on disk.
How it works
- Briefing over dashboard — rather than only charting balances, it writes a short daily note on what actually changed and what is worth thinking about, explicitly framed as information rather than advice.
- Ingest pipeline — parsers for Trading 212 and Vanguard exports plus spending CSVs.
- Scheduled — a morning briefing and a watchlist check run as scheduled jobs and notify over Telegram.
Screens
localhost:3000 resolves there only. GitHub privateSide project
Orchestrator
A Director drives planner → coder → tester → reviewer agents across the projects in this workspace, with every run tracked to a verdict.
Background
A local web app where a "Director" agent proposes and runs work across the other projects in the workspace, one stage at a time, so each change is planned, built, tested and reviewed before it lands.
How it works
- Four stages, one verdict — planner, coder, tester and reviewer each hand off a file, and the run ends in an explicit SHIP or FIX FIRST.
- Opt in per project — projects start disabled; enabling one is what grants the agents write access to that folder.
- Cancellable — a running cycle can be stopped from the UI.
Screens
127.0.0.1:8083 resolves there only.Side project
Project Hub
AI agent-team orchestrator — a team of role agents works a board, chats in threads and writes deliverables to a shared workspace.
Background
Where the agent-team idea is worked out properly: named roles — Product Manager, Tech Lead, UX Lead, Growth Analyst — each pick up cards, run background loops and produce real files.
How it works
- Roles, not prompts — each agent has a standing brief and its own thread, so the board reads like a team rather than a chat log.
- Blocked means blocked — agents that need a decision surface as "Waiting on you" instead of guessing.
- Ask me first — a global setting controls how much the team may do unattended.
Screens
localhost:8082 resolves there only. GitHubSide project
Postmarked
Travel map and digital postcard studio — an interactive world map of city suggestions, plus a postcard maker with stamps, typewriter captions and postmarks.
Background
Two halves of one idea: a world map of travel suggestions by city, and a postcard studio that turns a photo into something you would actually send.
How it works
- Paper reference — the postcard follows a real one: photo print top-left, perforated stamp with a globe cancellation and black ring postmark top-right, typewriter caption below, a dashed divider and a 📍 line at the foot.
- Exports a PNG — the finished card downloads as an image.
- No backend — state is shared entirely through a base64url link.
Screens
Side project
Anti-Flare
Eczema anti-inflammatory diet app — a daily fact, habit tracking, and a camera scan that reads a meal and rates its likely impact.
Background
A companion for managing eczema through diet: what to eat, what to avoid, and whether yesterday actually helped. Everything stays on the device — there is no sign-up and no server-side record.
How it works
- Point the camera at a meal — the photo goes to a vision model that returns a structured assessment of its likely eczema impact rather than a calorie count.
- Evidence on the card — daily facts cite their source, so the advice can be checked rather than taken on trust.
- Habits, gently — eight daily habits tracked without streak pressure.
Screens
Side project
Dream Oracle
Dream analysis for Wavesbychin — speak or type a dream and get a structured reading back, with voice input in three languages.
Background
Built for the Wavesbychin sound practice. You speak or type a dream, optionally answer a few refining questions, and receive a reading in five parts.
How it works
- Five sections — dream analysis, interpretation, an I Ching / 梅花易數 cross-reference, a matched soundscape and art prompt, then a shareable insight.
- Voice or text — dictation in English, 廣東話 and 普通話, with an eight-language interface.
- Works without credentials — with no API key the server still serves a demo reading, clearly flagged, so the flow can be shown at any time.
Screens
127.0.0.1:8788 resolves there only.SIZE
STAMPS
MIRROR
CHECKPOINTS
0 / 14
EXTRAS — JUMP FOR THEM
0 / 14
CHAPTER
Hong Kong → London
KEYS
UNLOCKED
- Walk right to begin.
CAST
you The Stakeholder
in-house The Aerialist
beyond the desk Agent 04
the Lab
START
Walk right to begin.
Each checkpoint you pass unlocks a piece of the journey here.
SCORE
0
BAGGED
0 / 18
PATIENCE
FOCUS MODE
Hold space to slow the sky and widen the bag. It runs down, and refills when you let go.
KEYS
BAG THESE
DODGE
NOTHING BAGGED YET
HOME
0/5
WAVE
1
LIVES
LEVEL
KEYS
Click the board, then press space.
SCOPE
3
SHIPPED
0
SPEED
1
NOS LEFT
LEVEL
KEYS
Requirements will be added here as you agree to them.
Click the board, then press space.
DEADLINES LEFT
14
PROGRESS
0 / 18 DUG UP
TIME
000
WHAT YOU FOUND
FOUND
Click any square to start digging
Click digs. To flag a deadline, turn on FLAG MODE, or right-click a square, or hold it on a touchscreen. Numbers count the deadlines touching that square.
MOOD
Eighteen things I keep. Fourteen deadlines. Dig carefully.
COMBO
0
SCORE
0
BPM
96
TRACK
JUDGEMENT
Waiting for the first note.
KEYS
Click the board, then press space.
MOVES
0
HOME
0/52
HOW
Click the deck to turn cards. Click a card, then where it goes. A double-click sends it home.
Click the deck to turn cards. Click a card, then where it goes.