Introduction

This exercise helps you practice generating code from an AI chatbot, first by manually tweaking the code, and next in an incremental fashion.

The sample prompts follow the  role  output  level  context  standard  structure liate.

Code-tweaking exercise

1. Ask the class chatbot to generate an icon for a game avatar using P5js.

   Type a prompt similar to the following:

   📌 Acting as an expert programmer familiar with the P5js Javascript framework, write the code to draw a turtle icon. This will be used as an avatar for an interactive children's game. Assume I will paste this into a P5js editor, so don't give me any HTML, just the script contents
2. Open the P5js editor, paste in your code to overwrite the existing code in the left pane, and click ▶️ to view the results at right.
3. Without reverting to the chatbot, try tweaking some aspect of the code to see if you can improve the results.

   💡 Try replacing the numbers inside the fill() or stroke() functions with quoted color words like "red". You can find a list of valid color words here.

   ℹ️ You can find a P5js cheatsheet here.

   ℹ️ For more on manually tweaking code generated by AI, see How To Prompt AI: Code, part 1.

(You do not need to post the results anywhere.)

Incremental prompting exercise

4. Return to the class chatbot and prompt for a more complex image.
5. As before, paste and run the code in the P5js editor and save a screenshot of the results (just the image, not the code).
6. This time, instead of tweaking the code manually, return to the chatbot and start over with a simpler version of the shape you want to create. Follow the process shown in How To Prompt AI: Code, part 2 to prompt and check your results, adding new features incrementally.
7. When you're satisfied (this could as many as 50 steps!) or run out of time, screenshot the final results.
8. Post the starting and ending screenshot, along with at least one sentence detailing the process by which you added new features, to #incremental-prompting.