Forem: Victor Bash

Building Séance: My Kiroween Hackathon Experience

Victor Bash — Fri, 07 Nov 2025 19:24:02 +0000

I'd been bouncing between AI-powered dev tools for a while, and when the Kiroween Hackathon dropped, I figured I'd give Kiro a shot. I'm usually a CLI-first kind of developer — the type who'd rather wrestle with Vim keybindings than trust another Electron app. So I went in expecting yet another VS Code fork with some Claude wrapper slapped on top. Turns out the Kiro team actually cooked this time. The generous AWS credits didn't hurt either.

What I Built

I built Séance, an interactive web app that turns global folklore and dark history into something between a game and a conversation with the past. The concept was simple: make users feel like they're actually communicating with something ancient — uncovering myths, strange rituals, and legitimately eerie legends through an interface that responds to their choices.

The experience starts with an interactive world map. Click a country, and you're dropped into one of three thematic paths: People's Tales (folklore and myths), Crown's Secrets (political history), or Merchant's Ledger (economic history). Each path unfolds through a realistic page-flipping book interface — the kind where you can actually see the pages curl and hear them turn.

Here's where it gets interesting: every page presents a multiple-choice question about the lore. Get it right, and you progress deeper into the story. Get it wrong, and the book dramatically flips all the way back to the beginning while your ancestors judge you from beyond the grave. It's educational, but with stakes.

The whole thing is wrapped in atmosphere: 3D smoke effects powered by Three.js drifting across the screen, ambient soundscapes with owl hoots and distant wolf howls, and a heartbeat that intensifies when you're about to answer. Every page flip has its own sound effect. It's the kind of immersive experience that makes you forget you're technically learning about the Baba Yaga or the Transatlantic Slave Trade.

The Tech Stack

Built on Next.js 16 with React 19 and TypeScript, because apparently I enjoy living on the bleeding edge. The 3D smoke effects run on Three.js and react-three/fiber — turns out making ethereal fog drift convincingly across a webpage requires actual physics calculations. Who knew.

The page-flipping mechanics use react-pageflip, which does exactly what it says on the tin. The world map is react-simple-maps, styled with Tailwind CSS 4. Linting and formatting handled by Biome, because life's too short for ESLint config files that span multiple monitors.

The question data is organized across three thematic files, each containing country-specific lore. Components are properly separated — presentation logic lives in components, business logic stays in utilities, and the global audio manager ensures sound effects don't turn into a cacophony when users spam-click the page turner. (They will. Users always will.)

Why Kiro Actually Worked

Here's where things got interesting from a development perspective. Kiro's spec-driven workflow forced me to think through the entire architecture before writing a single line of code. I started by creating detailed requirements documents using the EARS pattern and INCOSE quality rules — which sounds incredibly boring but actually prevented the classic "oh god what was I building again" moment at 3 AM.

The specs acted like a clean, brutally organized to-do list. No scope creep. No "wouldn't it be cool if..." detours that derail the entire project. Just: here's what we're building, here's how it breaks down, here's the order of operations.

Kiro's task system chunked everything into manageable pieces. Each task built incrementally on the previous one, so I could actually see progress instead of drowning in half-finished features. The ability to mark tasks as optional (like comprehensive unit tests) meant I could focus on making the thing work before making it perfect. Controversial take: sometimes shipping beats perfection.

The Hook That Saved My Documentation

The hook system deserves its own section. I created a "Kiroween README Beautifier" hook that automatically polished the README whenever I modified it. This meant I could focus entirely on building features while the documentation improved organically in the background.

The hook added Halloween-themed badges, ASCII art, mermaid diagrams, proper formatting — all the stuff that makes a README look professional but takes a bunch of time to do manually. By the end of development, the README was polished and properly structured without stealing a single minute from actual coding time. It's the kind of automation that makes you wonder why we ever did this stuff manually.

Steering Rules: Teaching the AI to Sit

Early in development, I noticed Kiro's agent had a bit of an... enthusiasm problem. It would see something that could be improved and just... do it. Without asking. Like a helpful roommate who reorganizes your kitchen while you're at work. Technically useful, but deeply unsettling.

So I created a code-policy steering rule that required explicit commands before any code modifications. No more surprise refactors. No more "I improved your function names and filed your taxes" when I was in the middle of debugging.
.

The Challenges

Browser Autoplay Is a Lie

Browsers have this lovely policy where audio won't autoplay without user interaction. Makes sense for preventing annoying ads. Less fun when you're building an atmospheric experience that relies on ambient sound.

The problem: users would interact with the map page, navigate to the book, and suddenly all the carefully crafted audio wouldn't play. The interaction context was lost in the transition.

The solution: leverage the existing mute/unmute button as the audio unlock mechanism. When users unmute on the home page, it unlocks audio globally for the entire session. Suddenly page-flip sounds work immediately when they reach the book interface. Crisis averted through creative reuse of existing UI elements.

Quiz Progression Is Deceptively Complex

The quiz system needed to handle questions distributed across book spreads with left and right pages. Users answer to progress, but wrong answers trigger a dramatic flip back to the beginning. This required coordinating FlipBook's imperative API (which likes to be told exactly what to do) with React's declarative state management (which prefers to describe what should exist).

Getting these two paradigms to play nicely took some careful choreography. Too fast, and the animations break. Too slow, and it feels laggy. Just right, and users don't even notice the complexity hiding underneath.

Making Smoke Look Good Without Melting CPUs

3D particle effects are great until someone opens your app on a 2015 Thinkpad and the fans sound like a jet engine . The smoke needed to be atmospheric without being expensive.

This meant implementing WebGL detection with CSS fallbacks, optimizing particle counts, and ensuring the effects enhanced the experience rather than becoming the experience. The goal was immersion, not a tech demo.

What's Actually Next

The current version covers 19 countries with three thematic paths each. Future expansion could add more countries, additional paths, and deeper question trees. Community contributions could help build a proper global folklore database — there's no shortage of dark history to explore.

Enhanced interactivity is on the roadmap: achievement systems for completing all paths in a country, leaderboards for those who need external validation, social sharing for the "look what I learned" crowd. The book interface could support more complex question types — ordering events chronologically, matching terms to definitions, maybe even short-answer questions if I'm feeling brave.

Accessibility needs work. Basic keyboard navigation exists, screen readers are supported, but there's room for high-contrast modes, adjustable text sizes, and more comprehensive keyboard shortcuts. The audio system could include visual indicators for users who prefer or require silent operation.

Performance optimization is the eternal struggle. Lazy loading question data per country, virtual scrolling for long question sets, more aggressive code splitting. The 3D effects could adapt dynamically based on device capabilities — richer experiences on powerful hardware, smooth performance on modest devices.

Tl;DR

Séance proved that educational content doesn't have to feel like homework, and that AI-powered development tools can actually enhance developer control rather than replace it. Kiro handled the structure, logic, and automation better than anything else I've used. The spec-driven approach kept development focused, the hooks automated the tedious stuff, and the steering rules gave me complete control over when and how changes happened.

I'm sticking with Kiro for the next project. And yes, the Kiroween Hackathon was a perfect excuse to build something atmospheric while learning a new tool. Sometimes the best learning happens when you're trying to make virtual smoke look convincing .

How to Squeeze Maximum Value Out of Kiro

Victor Bash — Sun, 24 Aug 2025 08:40:22 +0000

Kiro: The Hidden Costs of "Simple" Pricing

The Promise vs. Reality

Kiro presents itself with deceptively straightforward pricing. The marketing pitch is clean: vibes (conversational interactions) are cheap, specs (actual task execution) cost more. Pick your tier—$20 for 225 vibes and 125 specs, $40 to double that, or $200 for enterprise-level usage—and you're supposedly set.

The math looks reasonable on paper. You tell yourself you'll be strategic: maximize specs for real work, use vibes sparingly, stay within your limits. The unit economics seem to check out.

Then you actually start using the platform.

Where the Math Breaks Down

What Kiro doesn't advertise is how quickly those neat unit calculations dissolve into something far messier. A single "conversation" doesn't consume one vibe—it burns through four to six. A spec rarely executes in isolation; it triggers additional vibe requests, runs validation tests, and spawns follow-up queries you never explicitly requested.

Suddenly you're watching your usage dashboard with growing unease, wondering: Am I being inefficient, or is this system consuming resources behind the scenes?

The uncomfortable answer is both.

The Background Burn Problem

Earlier this summer, Kiro quietly acknowledged what users had suspected all along: a bug was multiplying requests invisibly. They reset affected accounts and paused billing while they patched the issue. But even with the fix in place, the fundamental problem persists.

You cannot trust the "one request equals one unit" promise.

Since specs cost five times as much as vibes, runaway consumption isn't just annoying—it's financially devastating. What should be a month's worth of experimentation can evaporate in a single afternoon if you're not careful.

The Sustainable Approach

The only way to use Kiro effectively is to work with its pricing structure, not against it. This means embracing a counterintuitive truth: specs, despite being more expensive per unit, are actually more cost-efficient in the long run.

Here's why: specs force you to plan your workflow upfront, reducing the chatty back-and-forth that vibes encourage. Instead of iterating through multiple conversational rounds, you define your requirements precisely and execute them in one focused action.

Kiro's welcome bonus—100 vibes and 100 specs during your first two weeks—isn't a gift. It's a testing ground. Use this period to map your actual burn rate and understand how much real work you can accomplish before hitting your limits. Most users discover they're not the "light users" they imagined themselves to be.

The Hybrid Strategy

But even disciplined usage won't save you from Kiro's fundamental economics. The real strategy requires thinking beyond Kiro as a complete solution.

Use Kiro for orchestration, not execution.

Kiro excels at the expensive cognitive overhead—breaking down complex problems, structuring workflows, and defining specifications. But once you have that blueprint, there's no reason to let Kiro handle the actual grunt work. Offload the execution to cheaper alternatives: Claude, GPT-4-mini, or whatever model offers the best price-performance ratio this quarter.

Think of Kiro as a premium architect. You hire them to design the building, not to lay every brick. If you try to make your architect handle construction, you'll quickly discover that your $20 plan doesn't buy you a house—it buys you a sketch.

Community Reality Check

The user community tells the real story. Complaints pour in about vibes disappearing in chunks, specs being wasted on seemingly simple tasks, and billing that never aligns with expectations. The consensus is clear: if you trust the unit model blindly, you'll overpay.

The successful users are those who treat Kiro as one tool in a broader ecosystem, maintaining careful logs of what each output actually costs in terms of consumed units. They've learned to game the system rather than let the system game them.

Managing the Overage Trap

You can experiment with overage billing—leaving it enabled for flexibility while you learn your usage patterns, then disabling it once you understand the rhythm. But this is just damage control.

The deeper reality is that Kiro's pricing model is structurally designed to push users into overages, the same way early "unlimited" AI subscriptions were designed to collapse under actual usage. The house always wins in the long run.

The Bottom Line

Kiro can be valuable, but only if you resist treating it as a complete environment. Use it for what it does best—spec-driven problem orchestration—and build workflows where other tools handle the heavy lifting.

The users who succeed with Kiro aren't the ones who find ways to use it more. They're the ones who find ways to use it less, but more strategically. They extract maximum value from each expensive interaction and delegate everything else to cheaper alternatives.

In the end, Kiro teaches the same lesson as every usage-based pricing model: the math never breaks in your favor. You either design around that reality, or you get squeezed by it.