Snooker Club Project Report
1. The Concept
Snooker Club is a premium HTML5 snooker game built entirely with HTML, CSS, and Vanilla JavaScript. The goal of this one-day sprint was to create a responsive, polished cue sports experience that feels similar to a commercial mobile game while remaining framework-free and lightweight.
I chose a snooker game because it combines multiple challenging systems into a single project: real-time physics simulation, collision detection, responsive canvas rendering, touch and mouse controls, UI/UX design, animation, audio, and performance optimization. It became an excellent benchmark for evaluating how effectively AI could plan, iterate, and refine a relatively complex browser game within a strict development window.
---
2. The Stack
The Stack: HTML5, Vanilla CSS, HTML5 Canvas, and Vanilla JavaScript.
The AI Assist: ChatGPT planned the overall game architecture, gameplay flow, responsive UI, visual direction, optimization strategy, and technical handoff documentation. OpenAI Codex handled the implementation, translating the design documents into working source code. Throughout development, multiple refinement passes were performed to improve gameplay feel, responsive layouts, rendering quality, physics, premium UI styling, and overall player experience.
---
3. The 1 Day Sprint
Morning (Hours 1–3):
The project started by defining the gameplay loop, scoring system, timer mechanics, combo system, and responsive layout. During this phase we designed the screen flow including the loading screen, home screen, gameplay HUD, remaining ball tracker, game-over screen, and responsive landscape-first interface. We also planned the physics engine, pocket detection, aiming controls, and rendering pipeline before generating the technical handoff for Codex.
Afternoon (Hours 4–6):
The implementation phase focused on transforming the design into a playable game. The initial build successfully produced a functional snooker game, but numerous gameplay issues appeared during testing. We spent most of these hours refining ball physics, collision stability, cue controls, responsive scaling, HUD layout, aiming accuracy, pocket detection, and rendering quality. Multiple visual redesigns were also completed, including premium wooden rails, realistic felt lighting, glossy balls, improved cue rendering, redesigned menus, and responsive gameplay layouts.
The Finish Line (Hours 7–8):
The final hours focused entirely on polishing the overall experience. Performance optimizations were introduced to maintain smooth gameplay, responsive behavior was improved across desktop and mobile devices, premium UI elements replaced temporary placeholders, audio feedback became more realistic, and multiple gameplay refinements were applied to improve aiming guidance and first-time player usability. Extensive testing was performed on several landscape resolutions before preparing the project for release.
---
4. The Roadblocks
Roadblocks:
The biggest challenge throughout development was balancing gameplay quality with visual polish under a strict one-day deadline. While the initial AI-generated implementation provided a functional foundation, many important gameplay details required several refinement passes.
Some of the largest obstacles included:
- Physics occasionally produced unreliable pocket detection.
- Cue controls sometimes became stuck during aiming.
- Four corner pockets rejected valid shots.
- Ball rendering appeared slightly distorted on certain screen sizes.
- Responsive layouts behaved inconsistently between desktop, tablet, and mobile.
- Initial cue rendering looked flat and lacked realism.
- The gameplay HUD occupied too much screen space, reducing the visible table area.
- First-time players struggled to understand aiming direction and shot mechanics without additional guidance.
Rather than rebuilding the game from scratch, each issue was solved through iterative improvements while preserving the existing architecture and gameplay systems.
---
5. Key Takeaways
#
What worked the best?
The planning phase proved extremely effective. Having a detailed architectural outline before coding significantly reduced implementation time. Separating gameplay systems into rendering, physics, UI, and flow modules made it much easier to iterate without introducing major regressions. The repeated AI-assisted refinement process also accelerated visual improvements that would normally require many manual redesign iterations.
#
What worked the worst?
The first implementation focused heavily on functionality rather than gameplay feel. While the mechanics technically worked, achieving a premium player experience required many additional prompt iterations. Small details such as cue movement, aiming guidance, responsive scaling, collision tuning, and UI balance demanded considerably more refinement than expected. These polish tasks ultimately consumed more development time than building the core game itself.
My final thought:
If I had one more day, I would focus entirely on making the experience feel even closer to a commercial mobile snooker game. I would implement more advanced cue-ball prediction, realistic spin mechanics, AI opponents, tournament progression, richer ambient audio, improved procedural table materials, particle effects, replay cameras, achievements, and online leaderboards. The existing architecture provides a solid foundation, and the next stage would concentrate on transforming the project from a polished prototype into a feature-complete premium browser game.