Selected Work

Projects with the thinking behind the work.

A mix of client work and independent products showing how I approach frontend engineering, data visualization, accessibility, and product design.

01Problem

What needed to be solved, who it affected, and why it mattered.

02Decisions

The trade-offs, constraints, and technical choices behind the work.

03Learning

What each project taught me and how it shaped the next one.

Approach

More than finished projects.

Rather than focusing solely on the final design, I like to document the thinking behind the work: the decisions, trade-offs, and lessons learned along the way.

Each case study covers the problem, my role, key decisions, technical approach, accessibility considerations, and what I learned along the way.

The goal is to show how I understand users, make technical decisions, and explain the reasoning behind the work.

Portfolio

Selected Work

A mix of client work and independent products showing how I approach frontend engineering, data visualization, accessibility, and product design.

ChartGPT finance dashboard mockup on a desktop monitor with charts and Ask about this chart buttons

Product Designer / Frontend Developer

ChartGPT

Helping people understand complex charts through conversation.

A reusable chart-assistance tool that allows users to open a chart in a focused modal, ask suggested or custom questions, and receive explanations based on the selected visualization.

  • React
  • TypeScript
  • AI Integration
  • Accessible UI
Institute Dashboard executive dashboard mockup on a gold monitor with spending growth charts and KPI cards

Frontend Developer / Data Visualization

Institute Dashboard

Turning complex institutional data into an accessible dashboard.

An interactive dashboard that combines custom React controls with D3-powered visualizations, helping users explore data without sacrificing usability or accessibility.

  • React
  • TypeScript
  • D3.js
  • Accessible Data Visualization
Non Profit Funding Tool mockup on a desktop monitor showing a step-by-step funding entry form

Product Designer / Frontend Developer

Non Profit Funding Tool

Helping nonprofits understand funding concentration and plan a more diversified mix.

A privacy-first, client-side wizard that lets nonprofit leaders map current funding sources, model a target mix, and compare results through accessible visualizations and exportable insights.

  • React
  • JavaScript
  • SCSS
  • Bootstrap
  • Local Storage
  • Accessible Data Visualization
Little Talks mobile app showing a daily conversation prompt, streak tracker, and weekly progress view

Product Designer / App Developer

Little Talks

Helping parents create more meaningful everyday conversations.

A mobile-first product that gives parents a thoughtful daily conversation prompt and helps them build a consistent habit through reminders, streaks, reflections, and lightweight progress tracking.

  • React Native
  • Expo
  • TypeScript
  • Notifications
  • Local Storage
Mill-Max product search results mockup on a desktop monitor with technical diagrams and filter controls

Lead Frontend Developer / UI/UX Designer

Mill-Max Filter Tool

Making complex product discovery feel simple.

A React-based product discovery tool that transforms a large technical catalogue into a guided filtering experience. Its reusable controls, API integration, and clear information hierarchy help users narrow complex product specifications quickly.

  • React
  • TypeScript
  • JavaScript
  • CSS
  • API Integration

Client Work

Additional Client Work

Earlier client projects that shaped my approach to CMS-driven brand sites and responsive front-end development.

Entenmann's brand website mockup on a desktop monitor with product photography and Goes great with people tagline

National consumer brand / CPG Brand Site

Entenmann's

A CPG brand site upgrade focused on modernising Drupal, cleaning up the experience, and aligning the interface more closely with the company brand.

  • Drupal
  • Bootstrap
  • Twig
  • PHP
  • SCSS
  • JavaScript
Little Bites brand website mockup on a desktop monitor featuring Mystery Mini Muffins campaign hero

Consumer packaged goods / Web Development

Little Bites

A product-led brand website with CMS-friendly content sections, reusable front-end patterns, and clearer product storytelling.

  • Drupal
  • Bootstrap
  • PHP
  • SCSS
  • JavaScript

End of page

More than finished projects.

Every project represents an opportunity to learn something new. I'm always exploring better ways to design interfaces, write maintainable code, improve performance, and build products that are genuinely enjoyable to use.

If you'd like to know more about any of these projects, or discuss how I approach front-end development and product thinking, I'd be happy to chat.