Skip to content
Ivan Chang
Ivan Chang

Hi, I'm Ivan Chang, a product designer and builder.

Turn complex operations into products that people actually use.

I design mobile-first products for businesses, from B2B apps and internal tools to brand experiences, for distributed teams. Based in Hong Kong, originally from Taiwan.

Previously worked with Pernod Ricard, Swire Coca-Cola Taiwan, Bread Elements, PALO IT.

Selected work

How I work

Three principles, and what my managers and clients said about them.

I start from the business outcome and the people doing the work, and take ownership of getting there.

“Ivan proactively pointed out user experience and design details for us, things we couldn't have thought of with our own knowledge and experience.”

— PR Manager, Swire Coca-Cola Taiwan

“He is someone I could rely on to take ownership of complex topics and drive them forward. He consistently demonstrated a strong ability to understand business needs while keeping the end-user experience as his main focus.”

— Stéphanie Pontois, D2C & Prestige Product Owner, Pernod Ricard

I break complex problems into decisions a team can see, discuss and build on.

“His reasoning was clear, structured and easy to build on. Working with him across time zones between Hong Kong and France was always smooth.”

— Thibaud Lucchese, Product Manager and Business Analyst, Pernod Ricard

“His strong command of the timeline in our progress meetings was really reassuring. He replied quickly, and any issue was handled right away.”

— PR Manager, Swire Coca-Cola Taiwan

“What stands out about Ivan is his ability to translate complex requirements into clear, user-centred solutions through mockups, prototypes and usability testing.”

— Samson Ng, Head of Design and Strategy, PALO IT Hong Kong

I share tools, insights and reusable components, so the whole team designs faster and more consistently.

“Ivan has indeed inspired me a lot on how to structure design system. He contributed greatly to our internal design culture, from sharing the latest tools and insights to developing reusable components that boosted team efficiency.”

— Samson Ng, Head of Design and Strategy, PALO IT Hong Kong

Side projects

Things I build for myself and friends, mostly with Claude Code.

Contextual Dummy Data Figma Plugin

The Contextual Dummy Data plugin panel in Figma, set to Hong Kong (HKD), listing the client fields it will fill

Built with

  • Figma Plugin API
  • TypeScript
  • Claude Code

Why I built it

Filling clienteling mockups for 13 markets by hand took about 2 minutes a screen, and the data often didn't add up, like order totals that didn't match their items or a +852 number in the Singapore view.

How it works

The plugin reads the selected frames, detects the page type, and fills the text layers with data that fits the market and the business logic: order totals with the right tax rate, phone formats and currency for each market, and statuses that match purchase dates. Components stay as instances, so the design system is preserved.

Built a Figma plugin with Claude to streamline dummy data entry when designing a multi-market productRead about my process

Social Media Paid Ads Dashboard

Built with

  • Claude Code
  • Next.js
  • Framer Motion

Why I built it

The paid ads for my own LEGO social media account (Legology) were spread across different platforms, so I centralised them to see the trend and keep track of the key metrics I want to benchmark.

How it works

It brings the paid ads data from each platform into one view and shows the key metrics I benchmark over time. It runs on private data, so there's no public link.

What I learned

How to structure the data and choose the right chart for each metric, so the tracking actually means something.

Trivia GameMobile-first

Visit live site(opens in a new tab)

Built with

  • Claude Code
  • Next.js
  • Neon Postgres
  • Upstash Redis
  • Vercel

Why I built it

My friends, their children and I wanted to learn something new, so I researched different topics and combined them into a trivia game everyone can play and compete in.

How it works

Pick a topic, answer as fast as you can, and compete with everyone else who has played.

Players can also share their results and challenge their friends by sharing the challenge invite.

What I learned

How to set up a Postgres database and an API, and the concept of caching.

Aircraft Spotting GuideMobile-first

Visit live site(opens in a new tab)

Built with

  • Claude Code
  • HTML
  • CSS
  • JavaScript
  • Vercel

Why I built it

I needed one place to centralise and organise all the knowledge I'd found about aircraft spotting, so I made a guide of it.

How it works

The guide groups what I've collected by manufacturer (Boeing, Airbus and engine makers), with quick identification tips.

Home Cook Diary

Built with

  • Next.js 16
  • TypeScript
  • Neon Postgres
  • Drizzle
  • Vercel Blob

Why I built it

I want to remember what my partner cooks for us, and for the log to become a menu we can cook from at home. Existing recipe apps focus on recipes and instructions, but I wanted to focus on the log and our own home-cooked menu.

How it works

You log a dish just after cooking it, and the diary organises everything you've cooked into shelves by country style.

What I learned

Using three.js, and Cache Components to bring you back to the same spot in the list when you go back from a dish.

Why kanban is good for AI-assisted personal development projectsRead about my process