Personal developer portfolio: a scroll-driven showcase of 6 real projects, built with Next.js, React Three Fiber, and GSAP ScrollTrigger.
Live: chrisbrown-dev.vercel.app
The animated GIF above is the actual live site, not a mockup. An icosahedron made of 20 individually-addressable triangular faces that breathes, explodes outward, and reassembles in a continuous GSAP-driven loop. Each face also independently launches and fades whenever it rotates to point directly at the viewer, so no two loops look quite the same. The same face-explode technique is reused (with a 6-face cube) for the placeholder art on each project section below the hero.
The site is a scroll-driven tour through 6 real projects:
- Skinstric AI: 7-screen AI skin-analysis flow, Frontend Simplified internship project
- vuln-hunter: hybrid Semgrep + Claude security scanner
- rag-system: self-evaluating RAG engine with hybrid + graph-boosted retrieval
- agentic-rust-mcp: production Rust MCP server integrating Render, Vercel, Buffer, and Firestore
- NFT Marketplace: responsive marketplace build, Frontend Simplified internship
- Summarist: Blinkist-style book app with real Firebase auth and Stripe subscriptions
- Next.js: app framework
- React Three Fiber: the 3D icosahedron/cube hero effects
- GSAP ScrollTrigger: scroll-driven animation sequencing
- Jest + React Testing Library: component tests, run on every push via GitHub Actions
- Charcoal / amber / teal palette, Space Grotesk / Inter / IBM Plex Mono typefaces: a distinct visual identity from the Albatross AI brand
npm run devOpen http://localhost:3000.
See BUILDLOG.md for session-by-session build history and DECISIONS.md for architecture/design rationale.
Chris Brown
Albatross AI
Portfolio