This content originally appeared on DEV Community and was authored by Phil Eberhardt
Trying out the first tract from DEV and figured I could make a post about it. I don’t really have any experience working with AI except asking Google assistant/Gemini for things so I’m really curious.
Initial try
My daughter was doing a puzzle and I thought it would be helpful to have an application where I could get a prompt from my daughter and make a jigsaw overlay on the picture and be able to print it out on card stock or something. I started with this prompt:
Please create an app that will generate an image in puzzle pieces based on a user prompt and puzzle piece count
The first generation made a functioning app that would display a shuffle of blocks making up the image. It could solve the puzzle. I asked to adjust to using jigsaw pieces and the AI explained it would use a canvas an make unique tabs but then it seemed to have an error and I no longer saw any image after I entered the string prompt.
It tried to fix the error and seemed to say the prompt to image generation wasn’t very robust and could be blank. I tried it a few times without luck and thought maybe it was because I was using the Zen browser, I’ve had weird problems with some sites before.
Let’s try that again in Firefox
I started over in Firefox and added jigsaw to my first prompt to see if it would get the right generation.
Please create an app that will generate an image in jigsaw puzzle pieces based on a user prompt and piece count.
This time the user input had an example prompt in text and a drop-down to pick the puzzle size (like 4×4 is 16 pieces) instead of a range slider. This had an humorous start where it just shows I solved the puzzle, and it didn’t show the initial image! The process of pointing out an error and seeing a new version with a fix to try was pretty interesting. The AI had the most issues with my adjustment for printing and showing actual jigsaw pieces.
It took around 10 iterations to get a working application, but it was pretty fun to chat with the AI and peak into the thinking process.
Some observations
Overall I enjoyed the AI studio interface and hope to play with it more. Some takeaways:
Starting prompt should be a little more precise. While adding “jigsaw” didn’t help the second try (it was still squares), I should have mentioned I wanted something printable so it wouldn’t start interactive.
AI can fix bugs when pointed out using natural language. Though sometimes I had to refine my response (like learning better puzzle piece terms for sockets and knobs), it was quick to fix and preview the next iteration.
Seeing the thinking process and explanation of changes is really helpful. After each of my text entries you can see the AI thinking in steps. Generally after it was done you would see bulleted lists/paragraphs saying why it was doing something and explaining some new terms. The way it responded helped me figure out how to approach fixes.
It was weird to see the changes without any manual coding. Still pretty new to this stuff but it was really cool seeing the diffs pointed out and having a two page dynamic web app without me going into any code myself. The downloaded version had the extra setup files in it as well, which didn’t clog up my initial editor view.
The AI can suggest prompts for the app. Perhaps this is a form of the phrase, “eating your own dog food”. It was fun to ask the AI what puzzles it would suggest. It had three suggestions across a few themes and they all seemed pretty fun.
I hope to have my actual daughter and partner try this soon, but I had some fun asking the AI at the end what puzzle prompts I should try! My favorite one was:
Animals in a library, wearing spectacles and reading books that are flying off the shelves.
A fun time!
If you want to see the initial setup and any future work, I added a public git repo. If you want to see the initial AI studio App, check it out. Let me know if you made a fun project, especially if it is geared toward any fun young kid activities!
This content originally appeared on DEV Community and was authored by Phil Eberhardt