Changelog

Everyone can vibe code. But design is iterative, not a one-shot process. The magic is being able to refine faster than ever, in a real environment. This is every version of this site, start to finish.

v1.7.02026-02-08

Dynamic GitHub Commit Count

Live commit count fetched from GitHub API with a count-up animation.

  • Added API route to fetch real contribution count from GitHub GraphQL API
  • Count-up animation rolls numbers from 0 using framer-motion springs
  • Server-side caching (1 hour TTL) to avoid GitHub rate limits
  • Graceful fallback to static count when API is unavailable
Built with:Claude Code
v1.6.62026-02-08

Neutral Chat Input Styling

Removed accent color from chat send button and input focus, using Fin-style neutral black/white theming instead.

  • Send button: black in light mode, white in dark mode; grayed out when disabled
  • Chat input focus uses standard ring style instead of accent-colored border
Built with:Claude Code
v1.6.52026-02-08

Typewriter Hero & Commit Count

Added typewriter role animation on homepage and commit count above the GitHub contribution graph.

  • Typewriter effect: Designer → Designer? → Engineer? → Orchestrator
  • Trademark disclaimer tooltip on Orchestrator with shadcn tooltip
  • Computed and displayed 872 commits in last 12 months above contribution graph
  • Added GitHub profile outline button next to primary CTA
Built with:Claude Code
v1.6.42026-02-08

Default Dark Mode with No Flash

Changed the default theme to dark mode for a stronger first impression on portfolio visitors, and eliminated the flash of light mode on page load.

  • Default theme changed from system to dark mode for new visitors
  • Added inline blocking script to set dark class before first paint, preventing white flash
  • Server-rendered HTML now includes dark class on html element
  • Existing user preferences (light/system) are still respected via localStorage
Built with:Claude Code
v1.6.32026-02-08

Fix chat sidebar scroll bug

Fixed a bug where opening the chat sidebar caused the main page content to scroll down unexpectedly.

  • Replaced scrollIntoView() with direct scrollTop manipulation to prevent scroll from bubbling to parent containers
Built with:Claude Code
v1.6.22026-02-08

Subtle Accent Treatment for Selection & Chat FAB

Replaced bright accent backgrounds with a subtle muted treatment using color-mix() for text selection and the floating chat button.

  • Added --selection-bg and --selection-text CSS variables using color-mix() for light and dark modes
  • Text selection now uses muted accent background with medium-toned accent text
  • Floating chat button across all 6 pages uses the same subtle treatment
Built with:Claude Code
v1.6.12026-02-08

Fix Button Gravity When Particle Field Off

Fixed a bug where the magnetic cursor-pull effect on buttons remained active even when the particle field feature flag was disabled.

  • Added disabled prop to Magnetic component that resets offset and skips mouse listener
  • Linked Magnetic disabled state to the particleField feature flag
Built with:Claude Code
v1.6.02026-02-08

Interactive Venn Diagram Skills Section

Replaced the flat skills list with an interactive 3-circle Venn diagram (Product, Design, Engineering) to showcase cross-disciplinary skills.

  • Moved skills section from below header to just above testimonials
  • Added interactive SVG Venn diagram with Product, Design, and Engineering circles
  • Click any region (single, overlap, or center) to filter skills to that intersection
  • Two-column layout: Venn diagram (2/3) with scrollable skill tags (1/3)
  • Gradient borders on multi-zone skills using background-clip trick for rounded corners
  • Multi-zone title shows each zone name in its own color
  • Scroll-to-top on CV page mount to fix navigation issue
Built with:Claude Code
v1.5.02026-02-08

Blog → Changelog

Replaced the blog page with a concise changelog. Moved route from /blog to /changelog, stripped the long-form article, and kept just the version timeline.

  • Renamed /blog route to /changelog
  • Removed blog article and markdown renderer — page now shows only the version timeline
  • Updated header nav and feed links to point to /changelog
Built with:Claude Code
v1.4.02026-02-08

2x2 Bento Projects Grid

Replaced the horizontal auto-scrolling projects carousel with a 2x2 bento grid showcasing 4 curated case studies with SVG illustrations.

  • Replaced horizontal carousel with 2x2 bento grid layout (responsive: stacks on mobile)
  • Added themed SVG illustrations per card: GitHub heatmap, code brackets, workflow nodes, sparkle
  • Curated 4 featured projects: The Future is Now, Respond to RFP, How I Work, Conjure Your Own Tools
  • Added numbered cards (01-04) and "View all" link to /projects
  • Removed carousel auto-scroll, dot indicators, and related state management
Built with:Claude Code
v1.3.02026-02-06

Interactive Hero & Scroll Animations

Added an interactive particle constellation canvas to the hero section, magnetic hover effects on CTAs, and converted all below-fold sections to scroll-triggered reveal animations.

  • Built canvas-based particle field with organic flow, mouse attraction, spotlight glow, and accent-color-aware rendering
  • Particles connect with distance-based lines and pulse with breathing opacity
  • Added Magnetic wrapper component for satisfying cursor-follow hover effects on buttons
  • Converted About, Projects, Experience, Thinkers, and Testimonials to scroll-triggered `whileInView` animations
  • Respects `prefers-reduced-motion` and adapts particle count for mobile devices
Built with:Claude Code
v1.2.02026-02-05

Feed View

Added a new /feed route that aggregates all content types into a filterable, scrollable feed.

  • Created /feed page with vertical scrollable feed of all content
  • Unified feed items from projects, thinkers, and changelog entries
  • Added sticky filter bar with content type and tag filtering
  • Created FeedCard component with type-specific rendering
  • Extracted CHANGELOG to shared /src/content/changelog.ts
  • Added Feed link to Header navigation
Built with:Claude Code
v1.1.02026-02-05

New Essay: You Can Conjure Your Own Tools Now

Added a new article about how AI coding tools change creative practice — building custom tools on demand and preserving design iterations as living artifacts.

  • Published essay on creative tooling and the shift from waiting for features to conjuring them
  • Explores using feature branches and flags as a design canvas for iteration history
  • New project entry accessible from the projects page
Built with:Claude Code
v1.0.02026-02-05

New Essay: The GUI Has to Earn Its Place

Added a new article exploring how chat interfaces are changing expectations for GUIs. Chat API now supports Anthropic for production.

  • Published essay on changing expectations for GUIs in the age of chat
  • New project entry accessible from the projects page
  • Chat API supports Anthropic Haiku 4.5 in production, Groq in dev
Built with:Claude Code
v0.9.02026-02-05

Product Thinkers

Added a new section showcasing product thinkers who have shaped my approach to design and product work.

  • Created `/thinkers` page with edge-touching card grid
  • Added homepage preview section between Experience and Testimonials
  • Features Teresa Torres, Spiek & Moesta, Ryan Singer, and Christopher Alexander
  • Created thinkers content data model in `/src/content/thinkers.ts`
  • Created reusable `ThinkerCard` component for homepage use
Built with:Claude Code
v0.8.02026-02-05

RFP Case Study

Built out the "Responding to an RFP" case study page with full narrative content and video placeholders for key feature demonstrations.

  • Rewrote RFP case study with full narrative: situation, problem, approach, impact, and outcome
  • Added TLDR section summarizing the one-person-army story
  • Added 5 video placeholder sections for key feature demos (seed data, LLM chat, scale adaptation, rapid iteration, interactive workflows)
  • Structured before/after impact comparison (without AI vs with AI)
  • Updated project tags, description, and chat context for richer AI sidebar conversations
Built with:Claude Code
v0.7.02026-01-24

Edge-Touching Cards & Feature Flags

Major visual refinement with cleaner card layouts and developer tools for design iteration.

  • Implemented edge-touching card style (no gaps, shared borders)
  • Added feature flag system with Cmd+K drawer for toggling design options
  • Created shared GitHubContributions component for reuse across pages
  • Testimonials now show as horizontal carousel (2 visible at a time)
  • Projects page matches homepage shell styling with border-x
  • Section title borders toggleable via feature flag
  • Removed chat input border for cleaner alignment
  • Added Experience section with timeline visualization
  • Added Testimonials section with colleague quotes
Built with:Claude Code
v0.6.02026-01-24

Theme System Overhaul & System Mode

Complete redesign of theming with accent colors and system preference support.

  • Added theme dropdown with System/Day/Night mode options
  • System mode automatically follows OS light/dark preference
  • Added 16 Tailwind accent colors (amber, orange, red, rose, etc.)
  • Accent color persists to localStorage
  • Real-time system preference change detection
  • Default to System mode with Amber accent
Built with:Claude Code
v0.5.02026-01-24

ElevenLabs UI & Shimmering Effects

Integrated ElevenLabs UI components for enhanced loading states.

  • Added ShimmeringText component for loading states
  • TLDR generation button shows shimmering "Generating summary..." text
  • Chat interface uses shimmering "Thinking..." for AI responses
  • Smooth shimmer animation with customizable colors
Built with:Claude CodeElevenLabs
v0.4.02026-01-24

Chat Enhancements & Shared Components

Added project cards in chat and extracted shared components.

  • Chat can now include project cards using [[project:id]] syntax
  • Created shared Header component for consistent navigation
  • Added hover accent colors on project card titles and arrows
  • Fixed scroll-to-top behavior on article pages
  • Added "Back to top" button in footers
  • Fixed double border issues between sections
  • Fixed dropdown transparency with proper bg-background
Built with:Claude Code
v0.3.02026-01-24
View PR →

Two-Column Layout & Chat Sidebar

Major redesign focusing on storytelling and AI transformation narrative.

  • Redesigned to two-column layout (main content + chat sidebar)
  • Added "Gareth Chainey" as permanent title with animated role subtitle
  • Created GitHub contributions visualization showing 2024→2025 transformation
  • Implemented experience timeline with brand-colored highlights
  • Updated chat interface with black bubbles in day mode
  • Added Lucide icons for theme toggle (Sun/Moon)
Built with:Claude CodeAgentation
v0.2.02026-01-24

Theme System & GitHub Integration

Added dark/light mode theming and live GitHub activity feed.

  • Implemented ThemeContext with system preference detection
  • Added localStorage persistence for theme choice
  • Created GitHubActivity component fetching live data
  • Built contribution graph visualization
  • Added recent activity feed with formatted dates
Built with:Claude Code
v0.1.02026-01-24

Initial Scaffolding

Set up the foundational project structure with Next.js 14.

  • Initialized Next.js 14 with TypeScript and Tailwind CSS
  • Configured Framer Motion for animations
  • Set up Anthropic SDK for AI chat integration
  • Created edge-to-edge grid layout system
  • Built initial component structure
Built with:Claude Code