This archive keeps browser experiments separate from the main case studies while still showing frontend mechanics: canvas state, keyboard and touch input, collision checks, score persistence, and compact no-backend interfaces.
Browser drawing needs reliable state; I built a vanilla JavaScript Canvas editor with tool modes, undo/redo snapshots, import/export, zoom, and mobile-friendly panels.
What I built
Implemented Canvas drawing modes for pencil, eraser, shapes, fill, text, selection, and preview rendering.
Built undo/redo snapshots, import validation, PNG export, zoom, canvas resizing, and local save/load behavior.
Managed toolbar state, swatches, brush sizes, selection bounds, and status output in custom vanilla JavaScript.
Demonstrates
Canvas state, pointer events, touch-friendly toolbar UI, and client-side export.
Controls
Mouse, touch, swatches, sliders, toolbar buttons, and file actions.
Mobile/touch
Supported for touch drawing and toolbar actions; the dense ribbon works best on tablet or desktop widths.
Production readiness
Solid static prototype for drawing and export. Before real users, it needs memory-aware history, autosave recovery, richer keyboard shortcuts, and stronger nonvisual drawing support.
Touch golf needs clear aiming and scoring; I built a Canvas/JavaScript five-hole course with drag power, collision response, hazards, scorecards, and best runs.
What I built
Created five course layouts with par values, walls, hazard zones, surface types, cup targets, and hole progression.
Built scorecard UI, best-score persistence, pause/restart/fullscreen controls, touch hints, and hole navigation.
Demonstrates
Canvas physics, level state, collision handling, and local persistence.
Controls
Drag to aim and set power, release to shoot, then advance hole-by-hole.
Mobile/touch
Supported with drag aiming and on-screen course controls; designed to remain playable on narrow screens.
Production readiness
Archived live experiment with solid input and scoring. A fuller release would need physics edge-case tests, more mobile QA, accessible alternatives, and save-state controls.
Arcade loops need low-latency input; I built a Canvas/JavaScript Asteroids-style demo with thrust, shooting, shields, randomized spawns, collisions, waves, and touch controls.
Built randomized asteroid spawning, split behavior, wave progression, collision checks, and HUD progress updates.
Added keyboard and touch controls that feed the same input state, plus pause/restart/fullscreen and reduced-motion handling.
Demonstrates
Real-time game loop, entity spawning, collision response, and HUD updates.
Controls
Keyboard or on-screen controls for thrust, turn, fire, pause, and fullscreen.
Mobile/touch
Supported through on-screen thrust, turn, shield, and fire buttons alongside keyboard controls.
Production readiness
Polished prototype with the strongest game loop in the lab. Hardening would focus on difficulty tuning, performance profiling, device testing, and expanded nonvisual state output.
Snake needs fast turns without illegal reversals; I built a Canvas/JavaScript grid game with buffered input, growth, collisions, pace changes, and best scores.
What I built
Implemented grid state for snake segments, food placement, growth, wall/body collision detection, score, and length.
Built input buffering for Arrow keys, WASD, swipe gestures, and touch buttons while blocking illegal reverse turns.
Added pace changes, pause/restart/fullscreen controls, viewport-aware canvas sizing, and local best-score persistence.
Demonstrates
Grid state, timed movement, collision rules, and input buffering.
Controls
Arrow keys, WASD, swipe-style touch controls, pause, restart, and fullscreen.
Mobile/touch
Supported with large on-screen direction controls and the same buffered movement logic as keyboard play.
Production readiness
Archived experiment with solid grid state and input buffering. Real-user hardening would add collision/turn tests, save reset controls, and better screen-reader alternatives.
Paddle games need precise collisions; I built a Canvas/JavaScript Brick Breaker with launch state, wall/paddle/brick checks, levels, progress, and touch controls.
Keyboard, pointer movement, touch controls, restart, pause, and fullscreen.
Mobile/touch
Supported with touch controls for moving and launching, plus viewport-aware canvas sizing for narrow screens.
Production readiness
Archived experiment with a working arcade loop. Hardening would add collision edge tests, performance checks, validated level data, and nonvisual gameplay alternatives.
Tile merging needs deterministic board transforms; I built an HTML/CSS/JavaScript 2048 with single-merge rules, random spawns, undo, best score, and accessible summaries.
What I built
Implemented directional board transforms, merge rules, random tile spawning, win/loss checks, score updates, and move counting.
Built undo snapshots, local save/best-score persistence, keyboard shortcuts, swipe handling, and on-screen direction controls.
Added an accessible focusable board with dynamic row summaries, live status announcements, and decorative tile rendering separated from screen-reader output.
Demonstrates
Board transforms, merge rules, undo snapshots, and persistent score state.
Controls
Arrow keys, swipe, on-screen direction buttons, undo, restart, and fullscreen.
Mobile/touch
Supported with swipe gestures and on-screen direction buttons for touch-first play.
Production readiness
Archived experiment with solid board transforms, undo, and accessible summaries. Hardening would add merge-rule tests, state migration, and screen-reader regression checks.
Mine puzzles need clear state and safe starts; I built a JavaScript grid game with delayed mines, recursive reveal, flag mode, timers, and accessible labels.
What I built
Implemented delayed mine placement, safe first reveal, adjacent counts, recursive empty-cell reveal, flag toggling, and win/loss state.
Built difficulty switching, timer/best-time persistence, mines-left tracking, cleared-percent updates, pause/restart controls, and touch flag mode.
Rendered the board as a keyboard-navigable grid with roving focus, row/column labels, live announcements, and state-specific cell descriptions.
Demonstrates
Recursive reveal logic, board generation, flag state, and accessible grid feedback.
Controls
Click or tap to reveal, right-click or flag mode to mark mines, plus restart controls.
Mobile/touch
Supported with tap-to-reveal, flag mode, difficulty buttons, and a horizontally safe board shell.
Production readiness
Accessible prototype with keyboard grid state and safe first reveal. Hardening would add reveal/flag tests, focus regression checks, difficulty validation, and clearer saved-state controls.
Timing games need consistent physics; I built a Canvas/JavaScript Flappy-style loop with gravity, obstacle gaps, collision checks, best score, pause, and mobile flap input.
What I built
Implemented gravity, jump impulse, pipe spawning, gap sizing, collision checks, score tracking, and restart flow.
Built the Canvas render loop for the player, scrolling obstacles, ground movement, menu state, status text, and best-score persistence.
Added keyboard, pointer, tap, and labeled mobile Flap controls with pause/restart/fullscreen support.
Demonstrates
Gravity/jump physics, obstacle generation, collision checks, and game-state transitions.
Controls
Click, tap, or keyboard input to flap, with restart and fullscreen controls.
Mobile/touch
Supported with tap input, keyboard input, and viewport-aware canvas scaling.
Production readiness
Archived experiment with a working timing loop and mobile flap input. Hardening would add deterministic physics tests, mobile-browser QA, reduced-motion review, and pause/resume validation.
