Projects & Case Studies

A motion-driven personal portfolio built with Next.js, Framer Motion, React Three Fiber, and particle-based interaction design.

This portfolio is designed as an interactive entry point rather than a traditional static landing page. The top page focuses on visual presentation, motion, and creative frontend expression, while the supporting pages provide readable project, lab, blog, and about content.

A developer-focused proof-of-work concept for recording development traces, progress, and technical decisions.

Traceraft is a product concept for developers who want to keep a clear record of their engineering process. The idea focuses on turning everyday development activity into structured, shareable evidence of technical work.

A handmade particle morph system that transforms skill icons into interactive visual experiences using React Three Fiber.

The skill section uses React Three Fiber to create an interactive particle stage. Instead of only listing technologies as text, each selected skill can be represented through particle motion and handmade icon point generation.

A lightweight blog system using Supabase, server-side data fetching, and Cloudflare R2 assets.

The blog system is designed to keep the public portfolio lightweight while still allowing structured content, image assets, and detailed technical writing. Supabase is used for data storage, while Cloudflare R2 handles image assets.

A replacement plan for a long-running LINE Messaging API and GAS automation app.

This project explores how an existing LINE Messaging API and Google Apps Script automation app could be redesigned with a more modern architecture. The original app has continued running for years, making it a useful case for thinking about replacement strategy.