From Puzzle Generator to Puzzle Ecosystem: My Finish-Up-A-Thon Journey

Muneer Alam — Fri, 05 Jun 2026 19:03:54 +0000

This is a submission for the GitHub Finish-Up-A-Thon Challenge

What I Built

BOOP started life as a Python command-line tool that generated word search puzzle books as PDFs.

Eventually I wrapped it in a React + FastAPI web application so anyone could create puzzle books from their browser. Technically, it worked. Users could choose topics, configure puzzle settings, and download a generated PDF.

But it wasn't finished.

At the start of the challenge BOOP had:

31 commits
12 components
5 routes

By the end of the challenge it had grown to:

162 commits
20+ components
7+ routes
68+ features

The goal wasn't to start over.

The goal was to finally finish what already existed.

The GitHub Finish-Up-A-Thon gave me the perfect excuse to revisit a project I had been postponing for months and turn it from a working prototype into something that felt like a complete product.

Over the course of the challenge, BOOP evolved from a simple PDF generator into a complete puzzle platform with two distinct experiences:

Create

Generate fully customized puzzle books with multiple difficulty levels, custom word lists, image uploads, progress tracking, previews, and downloadable PDFs.

Play

Solve word searches directly in the browser with mouse, touch, keyboard controls, hints, timers, game persistence, poster downloads, and sharing features.

By the end of the challenge the project grew from:

Metric	Before	After
Commits	31	162
Components	12	20+
Routes	5	7+
Features	16	68+
Accessibility Features	0	6
Security Improvements	1	8
Interactive Gameplay	No	Yes
Dark Mode	No	Yes

The biggest realization was that people don't just want to generate puzzles.

They want to play them.

That insight completely changed the direction of the project.

Demo

Compare Both Versions

One thing I'm particularly proud of is that both versions remain publicly available.

You don't have to rely on screenshots or marketing claims. You can directly compare the before and after versions yourself, inspect the code in both branches, and see the entire transformation.

Before (Challenge Starting Point)

Website: https://boop-m70hnwxro-muneer320s-projects.vercel.app/

Branch: finishupathon-before

After (Current Version)

Website: https://boop-web.vercel.app/

Branch: master

Repository

https://github.com/Muneer320/BOOP-web

Before vs After

Landing Page

Before: a functional blue interface.

After: a complete visual identity inspired by puzzle books, newspapers, and vintage publishing.

Mobile Experience

The entire experience was redesigned to work naturally on mobile devices.

Before:

After:

Interactive Play

The largest feature added during the challenge was an entirely new gameplay system.

BOOP can now be used without generating a PDF at all.

Dark Mode

A fully themed dark experience was added across the entire application.

The Comeback Story

The Project Was Already "Done"

At least that's what I told myself.

The PDF generation worked.

The backend generated books.

The frontend could submit requests.

Users could download files.

Mission accomplished... right?

Not really.

When I revisited the project, I realized it was a prototype pretending to be a product.

It solved the core problem but ignored everything around it:

No accessibility
No dark mode
No interactive gameplay
No meaningful feedback during generation
No proper security protections
No polished mobile experience
Minimal documentation

The challenge wasn't building BOOP.

The challenge was finishing BOOP.

A Complete Visual Redesign

One of the first things I changed was the visual identity.

The original version used a fairly generic blue theme.

The new version embraces a puzzle-book aesthetic:

Warm paper-inspired colors
Vintage typography
Custom SVG iconography
Newspaper-inspired layout elements
Full dark mode support
Responsive layouts across desktop and mobile

Instead of feeling like another web form, BOOP now feels like a digital puzzle publication.

The Biggest Feature: Interactive Play

The largest addition was an entirely new gameplay system.

Before the challenge:

Generate → Download PDF

After the challenge:

Generate → Download PDF

Play Immediately

The new Play mode includes:

6 difficulty levels
Mouse selection
Touch drag support
Keyboard navigation
Hint system with cooldowns
Persistent timers
Saved progress
Poster generation
Sharing support

This single feature transformed BOOP from a utility into an actual puzzle platform.

Rebuilding the User Experience

The original application communicated very little.

Loading meant:

Loading...

That's it.

The redesigned version introduces:

Skeleton loading states
Animated generation progress
Multi-stage status tracking
Better success screens
Error recovery flows
File previews
Improved navigation

Users can now understand what is happening instead of waiting blindly.

Accessibility Improvements

The original project effectively had zero accessibility support.

The updated version includes:

ARIA labels
Keyboard navigation
Focus management
Focus-visible styling
Reduced-motion support
Accessible puzzle controls

A user can now navigate and play the application without relying entirely on a mouse.

Security and Backend Improvements

The backend also received significant attention.

New additions include:

Rate limiting
Security headers
Input validation
Async generation
Safe file handling
Exception handling
Path traversal protection
Improved deployment configuration

The goal was simple:

Move from "it works on my machine" to something I would actually feel comfortable deploying.

Refactoring and Documentation

A surprising amount of work happened behind the scenes.

Some highlights:

Large sections of repetitive JSX replaced with reusable components
Route-level code splitting
Dependency cleanup
Documentation overhaul
Backend documentation
Frontend documentation
Deployment instructions
Audit reports

The project is now significantly easier to maintain than when the challenge started.

My Experience with GitHub Copilot

GitHub Copilot wasn't used as a code vending machine.

It worked best as a collaborator.

I used Copilot heavily for:

UI Development

Copilot helped generate:

Dark mode token structures
Accessibility patterns
Skeleton loading components
SVG icon implementations

Gameplay Features

One example was the new Play mode.

Copilot helped scaffold parts of the touch interaction system used for selecting words on mobile devices, allowing me to focus on integrating the logic into BOOP's game state and user experience.

It also helped accelerate development of:

Touch interaction logic
Keyboard controls
Timer persistence
Hint cooldown systems
Canvas poster generation

Backend Improvements

Copilot was particularly useful when implementing:

Validation logic
Middleware patterns
Security headers
Async processing flows
Error handling structures

Refactoring

The project contained a lot of repetitive code accumulated over time.

Copilot helped identify patterns, suggest abstractions, and accelerate the process of turning one-off implementations into reusable components.

The result wasn't code that Copilot built for me.

It was code that I was able to build faster because Copilot handled much of the repetitive scaffolding and exploration work.

What I Learned

The biggest lesson from this challenge is simple:

Working software is not finished software.

A project can successfully solve its core problem and still feel incomplete.

The difference between a prototype and a product is often everything around the main feature:

Accessibility
UX
Documentation
Performance
Security
Feedback
Polish

Before this challenge, BOOP generated puzzle books.

After this challenge, BOOP became a puzzle ecosystem.

And for the first time, it finally feels finished.

Links

Current Version
https://boop-web.vercel.app/

Before Version
https://boop-m70hnwxro-muneer320s-projects.vercel.app/

Repository
https://github.com/Muneer320/BOOP-web

DEV Community: Muneer Alam