Refine Statsbomb narrative and navigation styling

saadshahd · saadshahd · commit 4d1c7c06678f · 2025-10-30T14:25:49.000Z
- Update portfolio card to emphasize Electron app, team building, and constraints
- Change badges to highlight system characteristics over tech stack
- Switch navigation from rounded-full to rounded-lg for cleaner look
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -136,7 +136,7 @@ const ogImageURL = new URL(ogImage, Astro.site);
     {showScrollProgress && <ScrollProgress />}
 
     <!-- Responsive Navigation: Mobile circular badge → Desktop bar -->
-    <nav id="desktop-nav" class="headroom md:fixed md:mt-0 mt-8 top-2 left-2 right-2 max-w-6xl mx-auto z-50 rounded-full md:bg-surface/80 md:backdrop-blur-lg flex items-center justify-center border border-neutral-lighter" data-disable-auto-hide={disableAutoHideNav}>
+    <nav id="desktop-nav" class="headroom md:fixed md:mt-0 mt-8 top-2 left-2 right-2 max-w-6xl mx-auto z-50 rounded-lg md:bg-surface/80 md:backdrop-blur-lg flex items-center justify-center border border-neutral-lighter" data-disable-auto-hide={disableAutoHideNav}>
       <div class="flex items-center justify-center md:justify-between w-full px-4">
         <a href="/" class="hover:opacity-80 transition-opacity">
           <SSLogo />
diff --git a/src/pages/portfolio.astro b/src/pages/portfolio.astro
@@ -18,10 +18,11 @@ import Body from '../components/typography/Body.astro';
         <div class="p-8">
           <Heading level={3} as="h2" class="mb-4">Statsbomb Collection</Heading>
           <Body size="base" as="p" class="text-neutral mb-6 leading-relaxed">
-            How do you collect 90-minute matches without choosing between velocity and correctness?
-            We reduced collection from 16 man-hours to 4 concurrent collectors by building a DSL that let PMs define sports rules without engineering involvement.
-            The architecture separated collection rules from execution logic—new sports became configuration, not code.
-            Lesson learned: architectural separation eliminates trade-offs that feel inevitable.
+            How do you scale real-time sports data collection without sacrificing correctness?
+            Started with an Electron app (XState state machines, 30+ contextual keyboard shortcuts) that reduced 16 sequential hours to 4 concurrent collectors.
+            Then built backend DSLs so product managers could define sports rules as configuration—new sports became data, not code.
+            But architecture alone isn't enough: learning to build team ownership took until year three, and geo-political constraints meant the final piece—customer-facing DSLs—never shipped.
+            Lessons: Architectural separation eliminates false trade-offs. Team building shapes what's sustainable. Context determines what works.
           </Body>
           <div class="flex flex-wrap gap-2 mb-4">
             <Badge variant="skill">JavaScript</Badge>
diff --git a/src/pages/portfolio/statsbomb.mdx b/src/pages/portfolio/statsbomb.mdx
@@ -23,11 +23,14 @@ import Accordion from '../../components/Accordion.astro';
     <Body size="lg" as="p" class="text-neutral mb-6">Architecture as data enabled 10x scale, but building team ownership two years late meant racing geo-political constraints before completing what the domain needed.</Body>
 
     <div class="flex flex-wrap gap-2 mb-4">
+      {/* System Characteristics */}
+      <Badge variant="category">Real-Time Data Collection</Badge>
+      <Badge variant="category">Collaborative Workflows</Badge>
+      <Badge variant="category">Contextual UI Adaptation</Badge>
+
+      {/* Key Technologies */}
       <Badge variant="skill">XState</Badge>
-      <Badge variant="skill">Electron</Badge>
-      <Badge variant="skill">Ramda</Badge>
       <Badge variant="skill">Kafka</Badge>
-      <Badge variant="skill">DSL Design</Badge>
       <Badge variant="skill">ANTLR</Badge>
     </div>
 
