Project.XO is a production-ready personality test experience for Folkative that guides users through dynamic quiz flows and delivers tailored persona insights powered by a typed Next.js + PostgreSQL stack.

Folkative needed to replace a slow, spreadsheet-driven prototype with a scalable quiz engine that could withstand launch-day traffic and a marketing site that did justice to the brand story. The legacy flow produced 500ms+ response spikes, frequently dropped connections during persona scoring, lacked responsive layouts, and gave the marketing team no reliable way to iterate on question sets or hero content without involving engineers.
We rebuilt the platform on Next.js App Router with an optimized scoring API backed by PostgreSQL. I profiled every API route, rewrote the quiz evaluator to use pre-computed scoring matrices, and reduced cross-network hops by moving heavy transforms into server actions. On the front-of-house, I translated the Figma system into a performant hero landing page and interactive quiz UI complete with staged animations, stateful progress indicators, and responsive layouts tuned for mobile-first launches. The result was a 34% faster median response time in kernel benchmarks, plus a modular configuration system that let the client ship new archetypes and marketing narratives without redeploying code.
Served as full-stack engineer owning both the product-facing UI and backend performance. I implemented the hero landing page and interactive quiz flows while also managing the data model, API layer, and release pipeline to align sprint goals with design and strategy.
Balancing marketing storytelling with strict performance budgets required close collaboration between engineering and brand stakeholders. We introduced tooling that surfaced latency metrics alongside component previews so design iterations always considered backend impact, and I built storybook-like sandboxes to validate complex hero/quiz interactions before wiring them into production data.
Next.js 14, TypeScript, Tailwind CSS, Framer Motion
Next.js server actions, REST endpoints, Node.js 20
PostgreSQL with Prisma ORM and connection pooling
Vercel for hosting, GitHub Actions CI/CD, Railway staging database
Jest integration tests, Playwright smoke checks, kernel benchmarks for performance
3 team members: