{ "version": "v1", "generated_at": "2022-01-01T05:00:00.000Z", "self": "https://aatmanjain.com/data/v1/projects/hattle.json", "html_url": "https://aatmanjain.com/work/hattle", "markdown_url": "https://aatmanjain.com/work/hattle.md", "data": { "slug": "hattle", "title": "Hattle", "tagline": "who'd you get? A World Cup sweepstake app, sketched on paper and shipped in 8 hours.", "summary": "A sweepstake app for the 2026 World Cup. It dealt all 48 teams out with a draw anyone could verify, tracked every fixture and never touched a penny. Sketched on paper, shipped in 8 hours.", "category": "Web app", "year": "2026", "role": "Brand, design and build", "timeline": "8 hours, May 2026", "stage": "live", "featured": true, "order": 3, "stack": [ "Base44", "React", "Tailwind CSS", "openfootball data" ], "stats": [ { "value": "8", "label": "hours from sketch to shipped" }, { "value": "48", "label": "teams dealt at random" }, { "value": "0", "label": "pennies handled. Ever." } ], "case_study_url": "https://aatmanjain.com/work/hattle", "markdown_url": "https://aatmanjain.com/work/hattle.md", "detail_url": "https://aatmanjain.com/data/v1/projects/hattle.json", "live_url": "https://hattle.app/", "repo_url": null, "cover_image_url": "https://aatmanjain.com/images/work/hattle/01-hero.webp", "cover_image_alt": "The Hattle homepage during the 2026 World Cup: a sticker wall around the HATTLE wordmark, the scribble who'd you get?, a Free forever badge and two buttons.", "og_image_url": "https://aatmanjain.com/og/work-hattle.png", "brand_colors": [ "#F5C518", "#FBF3D5", "#1A2B6B", "#E5142B", "#F2A900" ], "problem_markdown": "My mates ran their World Cup sweepstake on a spreadsheet. It had bugs. Two people ended up with the same team. By the group stage nobody trusted the standings, and the slagging stopped working because half the group thought the table was wrong.\n\nEvery tournament, the same broken setup. So I built the thing they actually needed.", "approach_markdown": "**Paper first.** Before I touched a keyboard, I sketched the whole system: the draw, the scoring, the money tab, and how debts would settle between people. Get the logic right on paper and the build becomes typing.\n\n**Then the brand.** I called it Football Frenzy: sunshine yellow, cream, navy outlines, red marker headlines, gold accents and hard offset shadows. Anton for the big headlines, Caveat Brush for the scribbles, Inter for the body and Space Mono for the scoreboard digits. Sticker-doodle on purpose, so it looks like a person made it.\n\n**Then eight hours of focus.**", "build_markdown": "The hard part of a sweepstake is making \"fair\" something you can check.\n\nHattle's draw is a **seeded Fisher-Yates shuffle**. Every draw gets a seed, and anyone can paste it back in on a public verify page to re-run the exact same draw. Nobody, me included, can rig who gets which team.\n\nAround that:\n\n- **Solo or multiplayer.** One organiser can run the whole pool, or everyone gets their own dashboard.\n- **Real fixtures.** Every match comes from openfootball, a free public-domain (CC0) dataset, so the standings follow real results.\n- **A two-sided money tab.** Your group sets a stake (a curry, bragging rights, whatever you agree) and Hattle keeps track of who owes who. One person marks a debt paid, the other confirms it.\n- **It never touches the cash.** No payments, no payouts, no holding money. It just keeps score.", "outcome_markdown": "Hattle was my entry for Base44's **Vibe Sprint: Championship Edition**. Brand, landing page, sign-in, the draw, fixture sync, scoring, the money tab and multiplayer pools, all shipped in one eight-hour stretch in May 2026.\n\nReal groups ran their World Cup sweepstakes on it through the tournament. The spreadsheet did not survive.", "features": [ { "title": "A draw anyone can verify", "description": "A seeded Fisher-Yates shuffle. Paste the seed back in and you get the exact same draw." }, { "title": "A public verify page", "description": "Don't trust the organiser. Check the draw yourself." }, { "title": "Solo or multiplayer", "description": "One person runs the pool, or everyone gets their own dashboard." }, { "title": "Real fixtures", "description": "Every match from openfootball, a public-domain (CC0) dataset." }, { "title": "A two-sided money tab", "description": "Tracks who owes who. One marks it paid, the other confirms." }, { "title": "Football Frenzy", "description": "Yellow, navy, red and a lot of stickers. It looks like someone made it." } ], "quote": { "text": "we keep score, not your cash.", "source": "Hattle's footer" }, "highlights": [ "Sketched on paper, shipped in 8 hours (May 2026)", "A seeded, verifiable Fisher-Yates draw", "Real fixtures from openfootball (CC0)", "Never touches the cash", "Entered in Base44's Vibe Sprint: Championship Edition" ], "images": [ { "url": "https://aatmanjain.com/images/work/hattle/annotated-01-hero.webp", "small_url": "https://aatmanjain.com/images/work/hattle/annotated-01-hero-sm.webp", "alt": "Hattle's sticker-wall homepage pinned into a scrapbook page with notes: who'd you get?, never touches the cash, sketched on paper, shipped in 8 hours.", "caption": "Sketched on paper, shipped in 8 hours.", "annotated": true, "width": 2048, "height": 1360 }, { "url": "https://aatmanjain.com/images/work/hattle/annotated-04-the-draw-cards.webp", "small_url": "https://aatmanjain.com/images/work/hattle/annotated-04-the-draw-cards-sm.webp", "alt": "Hattle's 'the draw decides your fate' section with team flag cards, pinned into a scrapbook page with notes: the draw deals all 48 teams, seeded and verifiable, shipped in 8 hours.", "caption": "The draw deals all 48 teams.", "annotated": true, "width": 2048, "height": 1360 }, { "url": "https://aatmanjain.com/images/work/hattle/annotated-02-spreadsheet-has-a-bug.webp", "small_url": "https://aatmanjain.com/images/work/hattle/annotated-02-spreadsheet-has-a-bug-sm.webp", "alt": "Hattle's 'your mate's spreadsheet has a bug' section pinned into a scrapbook page with notes: the problem, every group chat has one, Hattle keeps score instead.", "caption": "The problem Hattle fixes.", "annotated": true, "width": 2048, "height": 1360 }, { "url": "https://aatmanjain.com/images/work/hattle/01-hero.webp", "small_url": "https://aatmanjain.com/images/work/hattle/01-hero-sm.webp", "alt": "The Hattle homepage during the 2026 World Cup: a sticker wall around the HATTLE wordmark, the scribble who'd you get?, a Free forever badge and two buttons.", "caption": "During the 2026 World Cup.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/04-the-draw-cards.webp", "small_url": "https://aatmanjain.com/images/work/hattle/04-the-draw-cards-sm.webp", "alt": "The draw section: a fan of team cards with their pots, including an England card marked Rare pull, and the scribble no refunds on bad draws.", "caption": "The bit the group chat screams about.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/02-spreadsheet-has-a-bug.webp", "small_url": "https://aatmanjain.com/images/work/hattle/02-spreadsheet-has-a-bug-sm.webp", "alt": "A navy section headed Your mate's spreadsheet has a bug, next to a broken spreadsheet with a #REF! error and a Chaos stamp.", "caption": "The problem, basically.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/06-running-tab.webp", "small_url": "https://aatmanjain.com/images/work/hattle/06-running-tab-sm.webp", "alt": "The running tab: a live card showing who's up and who's down, with a note to settle up between yourselves.", "caption": "We keep the tab. Never the cash.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/03-three-steps.webp", "small_url": "https://aatmanjain.com/images/work/hattle/03-three-steps-sm.webp", "alt": "Three tilted step cards: drop in the crew, rip the draw, track the slagging.", "caption": "Three steps, then chaos.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/07-faq-how-the-draw-works.webp", "small_url": "https://aatmanjain.com/images/work/hattle/07-faq-how-the-draw-works-sm.webp", "alt": "The Hattle FAQ with the answer to How does the random draw actually work? open.", "caption": "Provably fair, explained.", "annotated": false, "width": 2400, "height": 1500 }, { "url": "https://aatmanjain.com/images/work/hattle/mobile-01-hero.webp", "small_url": "https://aatmanjain.com/images/work/hattle/mobile-01-hero-sm.webp", "alt": "Hattle's homepage on a phone during the 2026 World Cup.", "caption": "Built for the group chat.", "annotated": false, "width": 960, "height": 2078 }, { "url": "https://aatmanjain.com/images/work/hattle/mobile-02-three-steps.webp", "small_url": "https://aatmanjain.com/images/work/hattle/mobile-02-three-steps-sm.webp", "alt": "Hattle's three step cards on a phone.", "caption": "Three steps, thumb-sized.", "annotated": false, "width": 960, "height": 2078 } ] } }