Project Roulette / Projects

Frontend and Games projects

5 of 30 projects. Each has a stack, five features to ship, a difficulty, a time estimate, and a bonus challenge.

Frontend · Intermediate · 2 weeks

Accessible Design System & Component Library

A themeable library of accessible UI components (dialog, combobox, tabs, data table, toast) published to npm, with a documentation site where people can try every component live.

  • React
  • TypeScript
  • Storybook
  • Vitest
  • Testing Library
  • axe-core

Features

  1. 8–10 components with full keyboard support and correct ARIA roles
  2. Light and dark theming driven by design tokens
  3. Docs site with a live props playground for each component
  4. Automated accessibility tests that run in CI on every pull request
  5. Versioned releases to npm with a generated changelog

Bonus: Visual regression testing with Playwright screenshots that block a PR if any component changes unexpectedly.

Frontend · Intermediate · 1–2 weeks

Git Repo Time-Lapse Visualizer

Paste any public GitHub repository and watch its file tree grow over time as an animated treemap, with contributor activity and the files that change most often.

  • TypeScript
  • Vite
  • D3.js
  • GitHub REST API
  • Web Workers

Features

  1. Fetch and cache commit history with pagination and rate-limit handling
  2. Animated treemap playback with a timeline scrubber
  3. Contributor timeline and a churn heatmap of hot-spot files
  4. Heavy parsing moved into a Web Worker to keep animation smooth
  5. Shareable URLs that encode the repo and timestamp

Bonus: Export the playback as a WebM or GIF that people can drop straight into their own README.

Frontend · Intermediate · 2 weeks

Browser Logic Circuit Simulator

Drag gates, wires, clocks, and LEDs onto a canvas and watch signals propagate in real time. Build anything from a half adder to a tiny CPU in the browser.

  • TypeScript
  • Canvas 2D or SVG
  • Vite
  • Web Workers
  • Vitest

Features

  1. Drag-and-drop gates, switches, clocks, LEDs, and seven-segment displays
  2. Event-driven simulation with propagation delay
  3. Truth-table generator for any selected circuit
  4. Reusable custom components built from sub-circuits
  5. Save, load, and share circuits by link

Bonus: A waveform timing-diagram viewer that works like a logic analyzer for any wire you probe.

Games · Advanced · 2–3 weeks

Multiplayer Arena with Real Netcode

A fast top-down browser arena game with an authoritative server, client-side prediction, and lag compensation, so it feels smooth even at 150 ms ping.

  • TypeScript
  • HTML Canvas or Phaser
  • Node.js
  • WebSockets

Features

  1. Authoritative server running at a fixed tick rate
  2. Client-side prediction with server reconciliation
  3. Entity interpolation for other players
  4. Lobby and simple matchmaking
  5. Built-in network simulator with latency and packet-loss sliders

Bonus: A replay system that records inputs and plays back any match deterministically.

Games · Intermediate · 2–3 weeks

Procedural Roguelike with ECS

A turn-based dungeon crawler with procedurally generated levels, built on an entity-component-system architecture.

  • Rust + Bevy
  • or C# + Godot
  • WebAssembly build

Features

  1. Seeded dungeon generation using BSP or cellular automata
  2. Entity-component-system architecture for all game objects
  3. Field of view and A* pathfinding for enemies
  4. Items, inventory, and save/load
  5. A playable web build published on itch.io

Bonus: A daily seeded challenge where everyone plays the same dungeon.