appendix

Bonus Appendix · HTML Book

The Play-First Prompt Modifier Cheat Sheet

The secret to becoming a great Play-First Programmer isn’t writing code from scratch — it’s knowing how to talk to your AI partner to steer the experiment. Copy any of these prompts and paste them straight into your AI chat.


Adding User Interaction.

By default, AI might build a toy that runs on autopilot. Use these prompts to put your hands on the steering wheel.

Prompt 1
The Mouse Spawner
Copy this prompt

“Modify the code so that every time I click my mouse inside the canvas, a brand-new particle spawns exactly where my cursor is.”

Prompt 2
The Gravity Well
Copy this prompt

“Make it so the particles are attracted to my mouse cursor like a gravity well whenever I click and hold the mouse button down.”

Prompt 3
The Keyboard Trigger
Copy this prompt

“Add keyboard controls. If I press the Spacebar, it should instantly clear the screen. If I press R, it should randomise all the colours.”


Breaking the Physics.

The real world has rigid physics rules. The digital world doesn’t. Use these prompts to build impossible environments.

Prompt 4
The Wrapping Warp
Copy this prompt

“Change the wall boundaries. Instead of bouncing off the edges, make objects warp through the right wall and reappear smoothly on the left wall.”

Prompt 5
The Kinetic Energy Drain
Copy this prompt

“Introduce friction. Make it so that every time a ball bounces, it loses 5% of its speed, eventually slowing down to a complete stop until I click it to kick it again.”

Prompt 6
The Anti-Gravity Hack
Copy this prompt

“Add a constant upward gravity vector so all the shapes fall upward toward the ceiling instead of down to the floor.”


Aesthetic Transformations.

Want to change the mood of your playground in seconds? Give your AI these stylistic constraints.

Prompt 7
The Cyberpunk Overhaul
Copy this prompt

“Update the design system of the entire page to have a clean, dark cyberpunk theme. Use sharp lines, deep dark backgrounds, neon magenta (#ff007f), and electric cyan (#00f3ff) for the colours.”

Prompt 8
The Minimalist Blueprint
Copy this prompt

“Make the visuals look like an architect’s retro blueprint. Use a deep navy blue background and make all the shapes render as thin, crisp white outline strokes with zero colour fills.”

Prompt 9
The Rainbow Spectrum
Copy this prompt

“Make the colour variables cycle smoothly through the entire rainbow colour wheel over time using an HSL loop.”


Expanding the Control Board.

If you loved building the Chaos Equalizer, use these prompts to add even more complexity to your dashboard.

Prompt 10
The Toggle Switch
Copy this prompt

“Add a custom checkbox button to the dashboard labeled ‘Chaos Mode’. When it is checked, make all the particles change shapes randomly every frame. When unchecked, they should go back to normal.”

Prompt 11
The Dropdown Palette Changer
Copy this prompt

“Add an HTML <select> dropdown menu to the controls with three options: ‘Midnight Forest’, ‘Neon Sunset’, and ‘Electric Volcano’. Update the JavaScript so choosing an option instantly swaps out the colour palette.”


Play-First Programming · playfirstprogramming.com A clubhouse for curious builders