FizzHop

About FizzHop

Inspiration

Years ago, stuck on a long-haul flight with nothing but pen and paper, I rediscovered a simple grid puzzle that let me escape my anxiety and pass the hours: draw a 10×10 square, start in any corner, then jump two spaces straight or one diagonally, numbering 1 through 100. It was pure, pen-and-paper bliss—no pixels, just strategy and calm focus. FizzHop was born from that memory, reinvented digitally to bring the same zen energy to phones and tablets.

What I Learned

• Player Psychology: Turning stress into fun taught me how small, self-contained challenges can soothe anxiety and build confidence.
  
• Visual Design: Crafting pastel gradients and light/dark themes helped me appreciate the emotional power of color and subtle animations.
  
• Mobile UX: Balancing touch targets, haptic feedback, and instant validation honed my sense of “snappiness” in UI.

How I Built It

I used Unity’s Bolt visual scripting to assemble FizzHop without writing a single line of C#. I created a 10×10 tile grid prefab, then wired up “TileTapped” events that enforce the two-step straight and one-step diagonal jumps. Customizable gradients, a light/dark detection system, and dynamic tile coloring all live as exposed Inspector variables—so I can tweak the feel at runtime.

Challenges Faced

• Rule Validation: Encoding the skip-and-hop logic in Bolt required some creative graph work to calculate valid moves every turn.
  
• Dynamic Styling: Generating complementary tile colors from arbitrary gradients meant sampling hues and adjusting saturation on the fly.
  
• Cross-Platform Input: Designing both touch and mouse flows in a single “TileTapped” event stream took careful event management to feel seamless on mobile and desktop.

FizzHop is my tribute to that pen-and-paper lifeline—reimagined for the digital age, still built to calm the mind and keep you “hopping” toward your next creative breakthrough.

Built With

• bolt
• jsx
• react
• typescript