A personal portfolio is more than just a list of projects—it's the ultimate proving ground for a frontend developer. I wanted to build a digital space that not only showcased my work but also served as a testament to my technical capabilities and design sensibilities.
From a Business Analysis perspective, I clarified audience needs (recruiters vs. collaborators), defined primary user goals (quick skill scan, depth via case studies), and prioritized content to reduce cognitive load. This informed the information architecture and the order of sections.
To break away from standard template-based portfolios, I focused heavily on micro-interactions. The goal was to make the interface feel alive and tactile, rewarding users who explore the page.
The portfolio is built on a modern React stack, prioritizing fluid animations without sacrificing load speeds or layout stability.
The project cards use custom Framer Motion hooks (`useMotionValue`, `useTransform`) to calculate mouse position relative to the element's bounding box. This creates a performant 3D tilt effect that reacts instantly to mouse movements, complete with a layered parallax effect on the internal elements.
Try moving your mouse over this card to see the 3D tilt effect and parallax layering in action.
Handling complex absolute positioning and flexbox layouts across thousands of device sizes required strict CSS constraints. Fallbacks and `whitespace-nowrap` were utilized to ensure UI elements never break, even on extremely narrow mobile devices like the iPhone SE.