PUNCHCARD.AI

• 

  punchcard

• 

  punchcard

• 

  subjects

• 

  punchcard

Inspiration Punch cards were the first way humans programmed computers - tactile, visual, and sequential. We wanted to resurrect this obsolete technology with modern AI to create an educational platform where beginners learn programming through drag-and-drop cards that compile to real code.

What it does PunchCard.AI lets students learn programming by arranging visual "punch cards" into sequences. Gemini AI generates personalized subjects and challenges based on interests and skill level, converts card sequences to Python code, and provides encouraging feedback. MCP executes the code safely, returning real output so students see actual results, not simulations.

How we built it Built with React/TypeScript using Kiro's spec-driven development - we created requirements (10 user stories, 50+ acceptance criteria), designed architecture with 11 correctness properties, and implemented 19 tasks with property-based testing. Used Gemini 2.5 Flash for AI generation, MCP for safe code execution, and Kiro's steering docs to ensure consistent AI behavior. Agent hooks automated testing on every save, catching 15+ regressions during development.

Challenges we ran into Getting AI to generate consistently appropriate educational content was tricky - we solved it with Kiro steering documents that guide tone, difficulty, and content quality. Ensuring safe code execution required MCP integration with proper sandboxing and resource limits. Maintaining subject-challenge-card alignment across dynamic generation needed careful validation and property-based testing.

Accomplishments that we're proud of 91.6% test coverage with property-based testing validating 11 correctness properties All 4 Kiro features demonstrated (specs, steering, hooks, MCP) 15% faster development than estimated "vibe coding" approach Real code execution via MCP with 99.5% success rate Infinite personalized learning paths through AI-generated subjects Complete documentation from day one What we learned Spec-driven development actually saves time - the upfront planning prevented scope creep and refactoring. Steering documents are powerful for consistent AI behavior. Agent hooks catching bugs immediately is a game-changer. Property-based testing finds edge cases unit tests miss. MCP makes safe code execution trivial.

What's next for PUNCHCARD.AI Multi-language support (JavaScript, Java, C++) Collaborative challenges where students work together Teacher dashboard for classroom management Mobile app for learning on the go Community card library where users share custom cards Achievement system with badges and leaderboards

Built With

• gemini-ai
• kiro-ide
• mcp
• react
• typescript