CASE STUDY PACK · THREE PROJECTS / THREE WEEKS / ONE OS · 2026.05.01 · Built for Jack's Community · Florian feature
15 to 20 minute walkthrough

Three case studies.
One operating system underneath.

A $15K event-site rebuild, a $900 Upwork win, and a $500 friend rescue. Three different price points, the same OS underneath: scrape, build, ship, reflect. The skills at the end are yours to fork.

$15K + $500/mo
Cascadia · event site rebuild + 1yr retainer
$900
Upwork case study · MVP-first bid
$500
Inner sphere · honey rescue + warm intro flywheel
5
Skills shared at the end as lead magnets
01 Case Study · Event Site Rebuild

Cascadia. A 14-year institution running on 2012 infrastructure.

The event has been running 14 years. Roughly 1,000 attendees, 100 vendors, three days, sells out the top sponsor tier every year. The website went down the week after the show. That is the gap I was hired to close.

cascadia-design-demo.pages.dev
Cascadia Design Summit 2026 hero: dark theater interior, big serif headline, March 27-29 Portland OR, get tickets $20. Click to open live
188
pages built (27 main + 104 vendor profiles + 67 event & class detail pages)
80
scheduled events across 3 days, all bookable
$12K/yr
recovered from the booking platform's 11% take
5
partner hotels · 17 sponsors · raffle · custom 404
Old site (what was breaking)
  • ×TCP timeout on the origin IP the week after the 2026 show
  • ×2012 site builder, HTTP-only internal links
  • ×Booking platform takes 11% on every ticket sold
  • ×Owner could not edit a name or price at 2 in the morning
  • ×Vendor applications lived in his email inbox
  • ×No itinerary builder, no conflict detection on overlapping events
  • ×SiteStats analytics from when the site was first built
Cascadia rebuild (what shipped)
  • Astro + Cloudflare Pages, sub $5/mo, CDN distributed, never down
  • Sveltia CMS so the owner edits at 2am without touching code
  • Personal itinerary builder with bookmark and conflict warnings
  • Every price badge on the schedule is a direct booking link
  • Sticky mobile ticket bar in the thumb zone, every page
  • Vendor questionnaire form + 104 cross-referenced profile pages
  • EMF meter, planchette, reactive fog, scroll animations (the vibe stays intact)
Thinking in systems · what's actually under the hood
Highest Leverage
  • Interactive wayfinding: 6 GPS-mapped venues, walking and driving times, off-site purple badges across the site
  • Personal itinerary builder + cross-page "Up Next" countdown that follows attendees room to room
  • Direct booking on every price badge, every CTA, every ticket button. Zero dead ends.
  • 104 auto-generated vendor profile pages, SEO-indexed, cross-referenced with the schedule
  • Stagehand visual CMS, Git-backed, edits go live in roughly 60 seconds
  • 3-day schedule with search and 7-category filter (Class, Speaker, Investigation, Tour, Main, Special, Off-site)
Cool Factor
  • K-II EMF meter in the navbar (cursor proximity on desktop, scroll velocity on mobile)
  • The site is haunted: random disturbances every 45 to 90 seconds, respects motion-reduction
  • SVG floor plan fades onto the Leaflet map tiles as you zoom into the convention center
  • Installable PWA, fully cached for the convention-center cell-signal dead zone
  • Konami code (up up down down left right left right B A) triggers a Spirit Detected overlay
  • Midnight Shift: fog effects intensify automatically between 10pm and 5am
Beyond the Site
  • Vendor questionnaire form replacing the inbox-as-CRM workflow
  • Paper convention-center flyer digitized into an interactive SVG with hover tooltips
  • Clean JSON data layer: change dates and vendors, the 188-page site rebuilds itself
  • SEO across 188 pages: meta + Open Graph + Twitter cards + auto sitemap
  • $0/mo hosting on a global CDN, handles 3,000+ concurrent attendees
  • WCAG AA: skip links, 44px touch targets, ARIA, prefers-reduced-motion
The competition · who else was bidding
Bidder 01
The dabbler.

Someone who "dabbles in websites" on the side. Did not even quote a price. Pricing strategy: vibes.

Bidder 02
The agency.

A company that says they build websites for a living. Their own site reads like a scam supplement page you'd land on from a malicious Facebook ad. If your shop window looks like that, your work looks like that.

The recurring pattern The honey client in case 03 paid $15K to an agency that shipped a fancy front end and a broken back end. People pay top dollar for surface. The competition is lower than you'd think. Showing up with a working build before the first paid meeting is half the deal.
The line that won the deal

"I kind of thought you'd have a mock-up but I didn't know it would be in depth. That tells me, okay, they get it."

Conference Organizer · IN THE ROOM, BEFORE THE FIRST PAID MEETING
02 Case Study · Upwork

Upwork case study. $900, signed off a Loom.

The bid stack: scrape every fresh job, score the fit, build a working MVP before the proposal goes out, send a 4-minute Loom from the actual product. Every Upwork application I send has a clickable, working site at the URL.

/upwork scraper
→ Live demo in Cursor

Apify pulls every fresh posting matching ~25 keywords on a 3-hour cron.

Sonnet 4.6 scores each one against my fit profile. Top scorers get a Pharallax structural read enriched in.

Results land in a Google Sheet I open with morning coffee. I spend more time bidding than searching.

Slack-style DM with the live MVP link and Loom URL embedded right at the top, before any pitch text.
Winning CV · MVP shipped before the pitch
Loom thumbnail showing the live client site, with my webcam in the corner, paused at 4 minutes.
Loom thumbnail · 4 minutes on the live site, my face in the corner
RULE 01
Every link is clickable.

If you ship an example site as part of an Upwork bid, the nav routes, the buttons scroll, the form posts to a real endpoint. A static mockup reads as I made this in Canva yesterday. A working MVP reads as this person can ship. There is no in-between.

RULE 02
Stock photos are placeholders, not finishes.

Tell the client up front in the DM: the stock photos are pulled from Pexels, swap any of them for your real assets. Removes the "this looks fake" objection without pretending you have access to their real library.

The bid math

A few dollars in Connects to fund the bid. A working MVP in 90 minutes. One signed retainer back.

YOU'RE NOT PAYING FOR THE GIG · YOU'RE PAYING TO COMPOUND
03 Case Study · Inner Sphere

The honey rescue. $500, paid in trust.

A friend got burned by an agency. Roughly $15K paid for a fancy front end and a broken back end. She came back with a salvage job. I quoted $500 because the gig was friend pricing and the real currency was the warm intros that follow.

The actual pricing verbiage I sent: $500 flat, paid when the work is done, plus a referral clause that pays the delta back over time through warm intros.
01
Comet did the work.

The Comet browser agent ran the recon, the audit, the broken collection URL scan, the Google indexing check. I orchestrated and reviewed. The cost of the audit was an afternoon and a few cents in tokens.

02
Already talking about next projects.

Phase 1 had not even shipped before she was asking about the Substack import, the branded sending domain, three Klaviyo flows, and the seasonal product launch. The $500 gig is a doorway, not the deal.

03
No shame in inner-sphere leads.

People in your existing network already trust you. Inner-sphere does not mean lazy. It means the conversion is faster, the lifetime value is higher, and the work compounds through warm intros instead of cold ones.

04
$15K agency = fancy front, broken back.

Pretty homepage. Three of four collection URLs broken. Product pages dropped from page 1 of Google after a re-crawl. Klaviyo on the free tier hitting the 250-contact ceiling. The audit took an hour. The client knew within a day she had paid for surface, not function.

The play

$500 today. Warm intros tomorrow. The friendship pays the delta back, and usually more.

04 Take Home · Skills

Five commands you can make your own.

Each of these is a Markdown file Claude reads when I type the slash command. To make any of them yours: replace my prompts with yours, point it at your stack, swap my taste constitution for whatever you want. The "Make it yours" block on each card tells you exactly what to fill in.

/pilot was built from Jack's BLAST framework. Credit where credit is due.

The take-home pack. Three skills, three customize prompts, one tuning history. Drag into your own ~/.claude/skills/ and run the customize prompt to make them yours.
Download the pack →

/pilot

Spawn a battle-tested project from a brain dump. Scrapes inspo URLs, anchors design seeds to known-good shipped work, scaffolds copy and components, builds, validates with screenshots, and hardens before deploy.

One brief, one shipped site, zero handoffs.

  1. Reference Calibration - scrape 3 inspo URLs and 2 anti-references for palette, type, and motion.
  2. Anchor - bind the design seed to a known-good shipped exemplar, not a generic taste pool.
  3. Scaffold - generate sections, copy, and components from your brief.
  4. Build - Astro + Tailwind, mobile-first, accessibility baked in.
  5. QA - screenshots at 1440 and 375, fix violations, re-shoot until clean.
  6. Harden - taste audit, banned-punctuation eval, deploy.

a deployed URL you can text to the client.

Make it yours

Drop your own brief. The skill answers: what do you sell? Who buys it? Three sites you respect? Two you can't stand? Your one-line promise?

Download skills/pilot/

/taste

Run a binary visual review on any HTML file or URL. Ten pass/fail evaluations plus a 34-principle constitution sweep. Reports a scored table with specific violations and an optional auto-fix.

The receipts on whether your build looks AI-generated.

  1. Screenshot - capture at 1440x900 desktop and 375x812 mobile.
  2. Read source - extract font sizes, easing curves, accent counts, color usage.
  3. Binary evals - 10 pass/fail checks (typography, contrast, density, restraint, motion).
  4. Constitution sweep - 34 design principles graded against the rendered output.
  5. Report - violations with file lines, fix suggestions ranked by impact.
  6. Auto-fix - optional pass that edits the source and re-screenshots.

a one-page audit you can hand to a client or a freelancer.

Make it yours

Paste a screenshot of a site you love and let Claude infer your taste constitution. Or write the rules yourself in plain English.

Download skills/taste/ + tuning history

/100x 173 runs deep

Spawn a team of researchers in parallel, each attacking your strategic question from a different angle. Findings get synthesized, stress-tested by a critic, and run through a second pass if confidence is too low.

One question, multiple lenses, hardened synthesis.

  1. Spawn - 4 to 7 Opus agents in parallel, each a different lens (technical, business, competitive, growth, market).
  2. Research - extended thinking + web, each returns 2 to 3 ranked plays.
  3. Synthesize - cross-reference for convergence. 5/5 agree is signal. 1/5 is noise.
  4. Red team - force 3 to 5 flaws, name the weakest assumption, assign confidence %.
  5. Gate - under 60%? Spawn Round 2 on the cracks. Never Round 3.
  6. Persist - save output. Future runs read prior runs first.

ranked plays with confidence levels, ready to act on.

Make it yours

Open with your question and three constraints. The lenses adapt to your industry.

Download skills/100x/

/ship

Autonomous commit-to-production pipeline. Detects branch strategy, build command, and deploy method automatically. Works in any project with a git repo, or with bsync-only personal tooling.

Deploy without thinking about it.

  1. Detect scope - personal tooling stays local; project files commit and push.
  2. Detect project - branch flow (main vs dev/main), build command, deploy method.
  3. Stage + commit - smart commit message from the diff. Never amends.
  4. Build + verify - npm run build, fail fast on errors, no silent regressions.
  5. Push + deploy - merge, tag, deploy via wrangler / vercel / netlify / firebase.
  6. Journal - append journal.md, update phases.md, log to memory.

a deployed URL and a paper trail of what changed.

Make it yours

Wire your deploy command into package.json. The skill reads the script and runs it. No config files to learn.

Pack v2 · coming later

/reflect

The counterpart to /ship. Ship flushes code to production. Reflect flushes knowledge to memory. Captures wins, lessons, journal entries, and cross-project patterns at the end of any meaningful session.

Make every session compound the next one.

  1. Read state - wins.md, lessons.md, journal.md, and the project memory file.
  2. Scan for wins - praise, trust signals, first-try successes, external sharing.
  3. Scan for lessons - corrections, failed approaches, three-attempt fixes.
  4. Append - dated entries with category, signal, and reusable pattern.
  5. Promote - cross-project learnings to a compound knowledge base.
  6. Update - action list, phases.md, the next move.

a session that taught the next one.

Make it yours

Define your own categories. Match memory to how you actually think, not how someone told you to.

Pack v2 · coming later
END Find me

Three weeks. Three projects. One operating system.

If any of this lands, the skills are yours to fork. Pull them, replace my prompts with yours, and run the same loop on your work. I'm always around to compare notes.

Russ Gardner
SHIP-FIRST · AUTOMATION-DEEP · BUILT IN PUBLIC