Inspiration

I wanted to bring back the joy of chaotic, rule-free creativity — like doodling in notebooks or building messy Scratch projects. Most hackathons focus on MVPs and disruption, but I wanted a project that made tech fun, unpredictable, and playful, inspired by glitch aesthetics and AI art generators.

What I Learned

  • Canvas API & JavaScript: Real-time drawing, mirrored strokes, paint blobs, and cursor trails.
  • Randomness & UX Chaos: Using probabilities to make features unpredictable yet enjoyable.
  • Audio Integration: Adding sounds that react to user actions.
  • Interactive Design: Making a chaotic interface visually engaging and interactive.

I also explored CSS animations and DOM manipulation for AI-style popups and cursor effects.

How I Built It

  1. Canvas & Drawing: Implemented brush strokes using ctx.moveTo() / ctx.lineTo().
  2. Random Features: Unpredictable colors, delayed undo, mirrored strokes, paint blobs.
  3. Interactive Chaos: Cursor trails, AI Art Score meter, self-destruct timer, and shuffle mode.

4. Audio & Export: Fun sounds per stroke and ability to download your chaotic masterpiece.

Challenges

  • Performance: Multiple animations and mirrored strokes caused lag; optimized trail elements and animation loops.

* Balancing Chaos: Random features needed tuning — too much was overwhelming, too little was boring.

Fun Math

Feature probabilities kept things playful:

[P(\text{blob appears}) = 0.1, \quad P(\text{undo triggers}) = \frac{1}{3} \text{ to } \frac{1}{5}, \quad

P(\text{color changes}) = 1 ]

Outcome: A chaotic, interactive, and hilarious painting experience where every stroke is a surprise, every color is rebellious, and the AI judge is sarcastic. Pure fun over functionality — exactly what this hackathon needed.

Built With

Share this project:

Updates