Over the past 6 months, in between contract gigs, client work and The Alib.ai, I’ve been spending a lot of time exploring what’s possible with generative AI. Not just playing around with ChatGPT or generating cool images with Midjourney, but really digging into what you can build with these tools. Like, how fast can I prototype something useful or weird or interesting using nothing but a text editor, some JavaScript and a smart prompt?
I kept building these little tools. Some were practical, like a sitemap generator for marketers. Some were just fun, like a fantasy RPG powered by GPT. But most of them never made it past a DM to a friend, a quick Slack message or a passing reference in a meeting.
So I finally did something about it.
Today I’m launching a new section of my site: Jon Bishop’s AI Projects
It’s a home for all the AI-powered tools and experiments I’ve been quietly building behind the scenes. Each project is a fully functional, standalone app, built fast, packed with personality and purpose and delivered as a single self-contained file. They’re not demos or half-finished ideas. They’re little digital machines that do one thing well.
Why I Built This Section
The idea came from a simple pattern I noticed: AI makes me faster, so why not lean into that? When I’d finish a client engagement or find a quiet weekend, I’d sit down, come up with an idea and try to ship something functional in a couple of hours. The catch? I limited myself to a one-page file, usually a .php file with HTML, CSS, JavaScript and backend logic all embedded.
No build systems, no frameworks, no dependencies. Just a browser and a few GPT calls.
Helpful Tip
Constraints can be a creativity cheat code. When you limit your tech stack, you’re forced to simplify and that’s often where the magic happens.Read more about creative constraint in The Democratization of Creativity.
I started calling the series One Page Projects. And that format shaped everything, from how fast I iterate to the kind of ideas I pursue. Some of these tools were built in under an hour. Others took a few focused sessions. But they all share the same DNA: small surface area, big potential.
How I’m Building These Tools
Every project on the new AI Projects page follows a few core principles:
- Single file architecture – Each tool is one
.phpfile with everything baked in. That means no frameworks, no webpack and zero setup headaches. - Frontend-first logic – The browser does as much of the work as possible, using JavaScript, localStorage and the DOM to drive interaction.
- Secure AI proxying – Any API call to OpenAI or other services goes through a secure PHP proxy I built, with cost and token tracking baked in.
- Modern UX, no bloat – All interfaces are built from scratch using plain HTML/CSS, but they’re designed to feel clean, responsive and modern.
- Build fast, polish later – Most ideas get prototyped in under two hours. If it works, I’ll spend another hour or two tightening up the UX and functionality.
I’ve been using this stack for everything from games to marketing tools and it’s been surprisingly powerful. The freedom of not having to spin up a full app environment lets me stay in that creative flow state longer and get to “usable” way faster.
What You’ll Find in the Project Gallery
I’ve already moved a handful of the more polished projects into the new section. They fall into a few different categories, marketing tools, creative apps, games, but all of them explore unique ways to interact with AI. Here are some of my favorites so far:
AI Wireframe Builder
Out of all the tools, this one might be the most useful for web designers, UX folks and marketers. The AI Wireframe Builder takes in raw content, URLs, screenshots or plain text and turns it into an editable, canvas-based wireframe using Fabric.js. You can even give it feedback and iterate section by section.
How it works:
- Paste in a block of text or a list of URLs.
- Optionally upload screenshots if you want to preserve layout elements.
- The tool runs a multi-step OpenAI process to:
- Analyze the content and screenshots
- Break it into logical wireframe sections
- Generate a low/medium-fidelity layout using UX principles
- You can review and revise each section individually, then download the final design.
What’s cool is that it doesn’t just spit out lorem ipsum boxes. Each component is labeled with intent, “Hero Tagline”, “Feature List”, “CTA Button”, so you know what belongs where.
It’s basically a turbo-charged assistant for early-stage UX design. I’ve already used it to ideate landing pages and client homepage reworks in minutes, not hours.
AI Recipe Generator
I built this one as a fun side project after realizing how often I was using ChatGPT to generate recipes. The main issue is I was losing track of recipes I had actually used and there was no easy way for me to manage my ingredients and add notes to successful recipes.
The AI Recipe Generator is a simple interface where you enter ingredients, add a prompt (“spicy vegetarian dinner”, “impress my in-laws”) and it generates a full recipe.
You can save recipes, add notes (like “used soy sauce instead of tamari”) and refine them using feedback.
Everything runs locally in your browser using localStorage, so you don’t need an account.
Behind the scenes, it prompts GPT to structure recipes with clear sections: ingredients, instructions, timing, servings and creative notes. You can iterate as many times as you want.
The idea here wasn’t to compete with recipe sites, but to explore how generative AI can handle something deeply personal and subjective, cooking and still be useful.
Helpful Tip
Don’t be afraid to get weird. Try prompts like “dessert with only two ingredients” or “birthday cake for a dog”. The AI will roll with it.AI is great at combining constraints with creativity, exactly what recipe-making needs.
AI Composer
This one was a bit of a stretch technically, but it was also one of the most fun to build. AI Composer combines GPT and Tone.js to create multi-track music directly in the browser.
You describe the vibe, something like “cinematic ocean scene” or “lo-fi beat for studying” and the tool generates:
- A group of virtual musicians (each with their own instrument, tempo and playing style)
- Structured note sequences using Tone.js-friendly notation
- Synth definitions and audio effects
- A visual background prompt (eventually tied to DALL·E)
Then you can play the music live.
This isn’t about perfect music. It’s about experimenting with a new format, using large language models to write music in code. The patterns it generates are short, loopy and rhythmic, perfect for sketching out ideas or setting a background mood.
I was curious if an LLM could act as a composer rather than just a melody generator. The answer? Sort of. But even in its imperfections, it creates something you’d never compose on your own. That’s the point.
Fantasy Game Adventure
This one’s for the storyteller in me. Fantasy Game Adventure is an interactive, text-based RPG where you play through a rich narrative guided by an AI Dungeon Master. It blends GPT-4’s storytelling ability with dynamic scene generation, inventory tracking and dice-based skill checks—all running in the browser, no downloads required.
Here’s what it does:
- You describe your character and the AI sets the scene.
- Every action you take, talking to a barkeep, sneaking past guards, entering a cursed ruin, gets a vivid, fantasy-style response.
- For skill-based moves, the game prompts a dice roll (complete with animated overlay) and outcomes are decided based on your result.
- Your inventory updates as you explore and major story moments trigger AI-generated visuals that reflect the evolving scene.
The backend logic returns structured JSON: story narration, roll mechanics, inventory updates and optional DALL·E image prompts. But as a player, you only see the story. It’s meant to feel like a living, breathing gamebook with endless possibilities.
And More
There are about a dozen more live already and I’ll keep adding to the collection as I build. Some are more polished than others, but they’re all interactive, functional and fun to explore.
What’s Next for the AI Projects Section
This whole section started as a creative outlet and that’s still the core goal. I’m not building a product suite here, I’m building a playground. A place to try new ideas quickly, test weird interactions and get my hands dirty with the evolving AI ecosystem.
Going forward, I’ll keep adding new tools as I come up with them and occasionally refine the ones that feel worth revisiting. If something starts to gain traction or seems genuinely useful beyond my own workflows, I might spin it out into its own dedicated experience. A few of them are already flirting with that line.
As the collection grows, I’ll probably need to rethink how I manage usage, especially for tools that rely on higher-cost models or heavier compute. If repeat usage picks up, I may offer a simple way for people to contribute or donate to unlock more access. But that’s all TBD.
Helpful Tip
If you’re using one of these tools regularly and want to see it grow, shoot me a message or consider supporting it once I roll out donation options.For now, everything’s free and experimental by design.
At the end of the day, this is about keeping my creativity sharp and my hands on the keyboard. Generative AI is moving fast and this project gives me a space to keep up, stay curious and build things that might not fit anywhere else.
Final Thoughts
The tools on this page aren’t just AI toys. They’re mini-apps that explore the limits of creativity, speed and usability in a world where AI is now part of the toolkit. Some might evolve into full-fledged solutions. Others might just be stepping stones to the next idea.
If you’re curious about the future of AI-enhanced creativity or just want to see what happens when you blend code, constraint and curiosity, you’ll probably find something you like in My AI Projects.
Give them a spin. Break them. Send feedback. And if you build something inspired by one of them, I’d love to see it.