Strict Rules For My 10-day AI Coding Challenge
Here's how I'm getting AI to play by my rules.
With a ‘10-products in 10-days’ challenge lined up, it’s time I set some ground rules that me and my AI have to work within. I’m doing rules is for the following reasons.
Creativity thrives in strict conditions
It’ll challenge what free Claude version can achieve
It’ll sharpen my prompt engineering (and also my understanding of AI efficiency when working with it).
Real world challenge rules:
Time limit, I’ll give myself 10-days. Giving me 24 hours-per-product to build and iterate it a workable point that I can get people to test it for final updates. A BETA version that’s almost ready to release.
Free tier of Claude only - no paid or upgraded versions. This’ll limit what it can do in one day. More like a human limit. Free AI Token use is eaten up quickly with bad prompting and AI’s reviewing of the tasks. I’ll need to focus on briefing products well.
Claude AI only. ChatGPT’s not strong enough with code on it’s free version. I’m not using vide coding - as this is paid.
Use a codebase that allows ongoing development. I’m getting Claude to write my code in a codebase I can use or later on edit. I can read code more than I know how to write complex code. So I’ll look at some lightweight code bases.
Release the products even if I’m not 100% happy with them. Yes, I could build all week long, but by commiting to releasing products for others to get for free or paid it requires me to consider users other than just me. My goal is to fix everyday pain points. Not just my own.
Here’s my Product development approach:
I’ve worked with coders before. I’ve managed complex product development across agencies and as a consultant. I know how to bring something to market from an idea. And how to take on the role for UX and design. This’ll help me understand how well Claude works with my instruction.
There’s usually way more time involved than my challenge is giving me. So I’ll look at it like a sprint.
Each product needs to solve one day-to-day task that myself of other people considers a pain-point. This means products need to be solution (and process) focussed. This one-task also limits scope creep - where I’d get sidetracked building a tool that tries to solve many things. And this will slow the process down. I need to avoid that.
I’m avoiding any over-reliance of ongoing AI, tech and online systems - that keep a product working after it’s built.
This might seem counter-intuitive but here’s my reasoning.
One aspect of AI I’m concerned about is the impact it has on the environment. Both in energy consumption, and in ecological impact - as it requires data centres and the associated supply chains of their building and running.
My goal here is to challenge myself (and AI) to consider products that could stand on their own. Not need API’s or data connections that run up ongoing costs for the user, or me. This limits my use of data reliance by keeping product code (and what it outputs) localised for the user. But it will make me consider more creative solutions by doing this.
My question - could this work on a laptop even if there’s no wifi or internet connection?
The outcome of these rules and product approach leaves me with some limited choices.
But I think I have an answer to overcoming this if I get AI to code in HTML5.
Why I’m getting my AI to develop code using HTML5?
Before committing to HTML5, I asked Claude directly:
“What can HTML5 actually do? What are its limits?”
I wanted to know whether I was choosing a constraint that would eventually back me into a corner, or one that was genuinely fit for purpose.
HTML works with scripts too. JavaScript handles all the interactive elements - the toggles, the controls, the real-time preview as you change settings. It’s the engine inside the file. Combined with CSS for styling, and the browser’s built-in Canvas API for visual rendering, it covers everything the tools need to do.
Python and R are worth mentioning here, because they’re the obvious alternative for anyone who builds data tools or generates charts and visuals. Both are powerful. But they require an installed runtime on the user’s machine - the latest version, with the right libraries, often with a command line.
That friction kills my proposition. My tools need to work for someone who isn’t a developer.
Right-click, open in Chrome, done.
Python can’t offer that without significant packaging. And that adds complexity, file size, and new things to break. HTML5 can do this.
How?
HTML5 isn’t a document format.
It’s a complete application that already ships standard inside every modern browser.
When someone opens one of my tools in Chrome, they’re running software - with JavaScript handling all the logic, state, and calculations, and the browser’s built-in Canvas API doing the visual rendering.
This means no install required. No runtime for a user to to configure. No dependency to manage. It’s already contained in the browser.
JavaScript is doing the heavy lifting throughout. It handles the interactive controls, tracks every setting the user changes, renders the preview in real time, and assembles the final export entirely in memory before writing it to the user’s machine.
That last part matters. You see any ouput file goes directly to their Downloads folder. Nothing touches a server!
Great for privacy. And works offline.
The file output capabilities surprised me most.
A single HTML file can export PNG at full print resolution, generate properly typeset multi-page PDFs, produce SVG vector files, and - relevant for the audio tools I’m building - output WAV and WebM files via the Web Audio API.
All of it assembled in the browser, all of it staying local.
This is pretty comprehensive technology for files and formats I use daily. And I pay lots of membership or subscription for tools that allow me to work with these formats. So it’ll be interesting to see how far I can push this technology approach for high quality content file formats.
The offline behaviour is worth a specific mention.
The tools I’m making need to load only one external resource on first open - the fonts from Google Fonts.
Chrome then caches these locally. After that, I can disconnect from the internet entirely and everything still works.
Flash, for anyone who remembers it, used to own this tool territory - video, animation, interactive elements inside a browser. HTML5 made it obsolete by building those capabilities into the browser itself, without a plugin.
What you’d have needed a proprietary license to build for in 2005, the open web standard handles natively now.
The file size constraint is a practical benefit too.
Each tool is a single HTML file and likely to be under 500KB. No framework, no bundler, no build process. They can be edited it in a text editor if I want. Right-click, open in Chrome, done. SO the long term coding aspect I could take over myself if I wanted to. Or work with a coder who’s human.
This feels like a good place to start building right?
Almost.
Here’s a quick bit on my UX and design approach too.
If I keep the tasks focus on simple fixes to everyday problems I can probably use a simple layout for the user. One screen, or some switching elements on the page to select options this tool does.
I’ll see what AI looks to build naturally in it’s layout. And I’ll give it some prompting to solve any UX issues as we go.
My first pain point to solve is personal - but I reckon it has a range of uses I know other design professionals and content creators will find very useful.
Let’s get building!
-R