Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/apursley2012/y2k-webring/llms.txt

Use this file to discover all available pages before exploring further.

The Case Studies page (/#/case-studies) renders structured post-mortems sourced from portfolioData.caseStudies (C export). Each study reads like a game-style debrief — complete with bug entries rendered as health-bar widgets.

caseStudy schema

FieldTypeDescription
idstringUnique identifier (e.g. "cs-1")
titlestringStudy headline
setupstringContext — what the client or project needed
problemstringThe core challenge to solve
investigationstringResearch and discovery phase notes
designChoicesstringKey UX/visual decisions and rationale
buildChoicesstringTech stack and implementation decisions
bugs{name, hp}[]Bugs encountered; hp drives the health-bar width
resultstringOutcome and measurable impact
nextTimestringLessons learned / what would change

Bug health bars

Each entry in the bugs array renders as a named health bar. The hp value (0–100) sets the fill width of the bar — higher HP means the bug put up more of a fight.
BugHP
Stripe Webhook Duplication45
Framer Motion Memory Leak on Mobile80

Sample: Neon_Bazaar case study

Setup — A boutique digital art collective needed a storefront that didn’t look like Shopify.Problem — Standard e-commerce platforms enforce a grid-and-white-background aesthetic that clashed with the collective’s cyberpunk/Y2K brand.Investigation — 15 alternative storefronts were analysed; all suffered from poor accessibility and confusing UX despite strong visual appeal.Design choices — A “directory” layout inspired by BBS systems, implemented with modern ARIA standards and responsive CSS grid.Build choices — Next.js for SSR/SEO, Stripe for payments, Framer Motion for glitch-hover effects.Result — A 40% increase in conversion rate compared to their old platform; the site now matches the brand identity.Next time — Use a lighter animation library for micro-interactions to reduce bundle size.

Adding a new case study

// data/portfolioData.js
{
  id:             "cs-2",
  title:          "My_Project: A Post-Mortem",
  setup:          "Context for why this project existed.",
  problem:        "The specific challenge you had to solve.",
  investigation:  "What you researched or discovered.",
  designChoices:  "Decisions made on the UX/visual side.",
  buildChoices:   "Stack and implementation rationale.",
  bugs: [
    { name: "Hydration Mismatch", hp: 60 },
  ],
  result:         "Measurable outcome or qualitative win.",
  nextTime:       "What you'd do differently.",
}
Set hp between 1 and 100. A value of 100 renders a fully red bar; lower values shrink the fill proportionally, making quick fixes visually distinct from multi-day ordeals.

Build docs developers (and LLMs) love