Designing a portfolio that feels editorial, scales with new work, and reflects how I think about product and brand.
This portfolio redesign started as a way to move beyond generic templates and create a home for my projects that felt intentional. I wanted the experience to balance storytelling and structure: immersive case studies, quick project overviews, and a performance-first build that I can evolve over time.
- Role
- Product Designer & Front-end Developer
- Timeline
- Jan–Feb 2025
- Stack
- Next.js 15, TypeScript, Tailwind CSS, Framer Motion
- Deliverables
- Design System, Component Library, Case Study Templates
Why Build a New Portfolio
Previous portfolio iterations made it hard to tell deeper project stories. They were image-heavy but light on context, and updating them meant hand-coding static pages every time I shipped new work.
The new version needed to feel more like a publication: thoughtful pacing, progressive disclosure, and a navigational system that supports both browsing and deep dives.
Goals & Requirements
I framed the build around a clear set of goals:
- Ship a fast, accessible experience optimised for mobile and large screens.
- Make case studies modular so new projects can be created from structured content, not ad-hoc pages.
- Create an interaction language (scroll pace, hover states, motion) that feels considered but never distracting.
- Keep the codebase maintainable with typed data, shared utilities, and a consistent design system.
Content Architecture & Source of Truth
Projects and writing live as typed JSON/MDX content that feeds into the Next.js app. Helper utilities normalise each entry, making it easy to trigger sticky navigation, section anchors, and metadata without touching UI code.
This separation lets me update project copy, add new sections, or swap imagery without redeploying layouts — perfect for iterative storytelling.
Outcomes & Next Steps
The new portfolio gives me a maintainable platform for sharing work, writing, and experiments. Publishing a new project now takes minutes instead of hours, and the modular system keeps visuals cohesive.
Next steps include expanding the writing section, adding lightweight analytics, and exploring automated image optimisation to keep performance sharp as the project library grows.