Portfolio Website – Figma Make Prototype

This repository contains the original Figma Make–generated code for my portfolio website.

It represents the prototype and exploration phase of the project: translating high-fidelity Figma designs into a working interactive site to validate structure, layout, and narrative before committing to a production codebase.

This repo is intentionally preserved for context and transparency.
It is not the production version of the site.

Context

• Designs were created in Figma
• Code was generated and iterated on using Figma Make
• The output prioritised speed of iteration over long-term maintainability
• The code reflects the constraints and patterns of a design-to-code tool

The site was later refactored into a production-quality React application with a clean architecture, typed data layer, performance optimisations, and accessibility improvements.

That production codebase lives in a separate repository.

What this repo is (and isn’t)

This repo is:

• A snapshot of the design → prototype phase
• Useful for understanding the evolution of the project
• An example of rapid prototyping with Figma Make

This repo is not:

• A reference for production React patterns
• Actively maintained
• Deployed to production

Original Design

The original Figma file is available here:
https://www.figma.com/design/YOI0IKKY0bFz3bsPuedtiM/Portfolio-Website-Design

Running the prototype locally

If you want to explore the prototype code:

npm install
npm run dev