[Meta-Scrum]Engineering a 2026 Brand Hub via Vibe Coding

Case Study Detail

The Narrative: Agile-Driven AI Collaboration

This project isn't just a portfolio; it’s a "Meta-Project." It documents the synergy between the Scrum framework and Next.js 15, developed through high-velocity AI collaboration (Windsurf/Claude).

In this ecosystem, I stepped into a dual role: Product Owner, defining the competitive edge of my brand in the global sustainability market, and Scrum Master, translating complex UX frictions into precise Prompt Engineering. We moved from a blank canvas to a fully optimized, multi-language CMS platform in just four sprints.

The Process: Sprint Backlog & Velocity

We didn't just "code"—we established a Scope Baseline and executed a disciplined iteration cycle.

The Decision Making: Quality vs. Friction

As a PMP, every technical choice was a trade-off between performance and scalability. Here are the core "battles" won:

The i18n Strategy: I opted for Path-based routing (/[lang]) over simple state switching. While it increased Middleware complexity, it secured independent SEO authority for both English and Chinese versions—a non-negotiable for a global brand.
Decentralized SEO: I moved SEO management out of the codebase and into Sanity CMS. By building a dynamic generateMetadata function, I enabled "Operational Flexibility"—allowing me to update keywords based on the latest ESG trends without touching a single line of code.
Data-Driven Governance: Setting up sitemap.ts and Google Search Console wasn't just a technical task; it was about creating a Feedback Loop. We now use GA4 real-time data to analyze which projects (Sustainability vs. PMP) resonate most with our stakeholders.

The Magic: High-Velocity Implementation

This project redefined my understanding of Vibe Coding. By treating Intent as the New Syntax, I directed AI to handle the "heavy lifting" of boilerplate code while I focused on system architecture and logic flow.

Whether it was debugging Middleware route interference or automating XML generation, the development felt less like "writing" and more like Orchestrating.

The Result: A Living Ecosystem

The final delivery is a high-performance, future-proof brand asset:

Lighthouse Performance: 90+ across the board (Performance, SEO, Accessibility).
True i18n Implementation: Seamless bilingual navigation with synchronized content.
Automated Monitoring: A "Set-and-Forget" system with GA4 and GSC auto-indexing.

The takeaway? This isn't just a static site. It's a scalable, living brand hub designed to evolve as fast as the market does.