{"id":22263,"date":"2025-06-29T12:57:05","date_gmt":"2025-06-29T16:57:05","guid":{"rendered":"https:\/\/umainenewmedia.net\/nmd100\/?p=22263"},"modified":"2025-06-29T12:57:05","modified_gmt":"2025-06-29T16:57:05","slug":"task-7","status":"publish","type":"post","link":"https:\/\/umainenewmedia.net\/nmd100\/task-7\/","title":{"rendered":"Task 7: Code an Avatar with AI"},"content":{"rendered":"

<\/p>\n

Introduction<\/h3>\n

Communicating with AI is one of the most frequent challenges you will run into during your journey of getting the tool to be helpful. In this exercise you’ll practice providing small incremental change prompts to reach a result that you want, rather than a single large complex prompt.<\/p>\n

Process<\/h3>\n
    \n
  1. Think of what sort of avatar or icon you want to use to represent you that you feel can be made with simple shapes. (Do not use any of the Pacman examples shown in class.)<\/li>\n
  2. Identify individual parts of the avatar and think about how you would describe their properties (shape, location, color) in words. Pick a part as a starting point.<\/li>\n
  3. Using our class’ custom interface<\/a>, ask ChatGPT to code a P5.js image based on this starting point. Paste the output into the online p5.js editor<\/a> and click Play to test the code ChatGPT wrote.
    \nAn example starting prompt:<\/p>\n
    \n

    \ud83d\udccd Acting as an expert programmer familiar with the P5js JavaScript framework, write the code for a mouse face that could be used as an avatar icon.Assume I will paste this into a P5js editor, so don’t give me any HTML, just the script contents.<\/span><\/p>\n<\/div>\n<\/li>\n

  4. Refine the starting prompt if necessary until you feel comfortable with it as a starting point.<\/li>\n
  5. Start requesting small incremental changes to the image, refining the prompt if it’s interpreted poorly or if the result is not what you expected.<\/li>\n
  6. Add a post with a title like Task 7: Mary Gonzalez and add the category \u201cTask 7\u201d.<\/li>\n
  7. To the Visual tab add:\n
      \n
    1. The starting prompt and the image it created (as a screenshot).<\/li>\n
    2. Two intermediate steps providing the image before your prompt, the prompt itself, and the image after your prompt, for a total of 4 images and 2 prompts.<\/li>\n
    3. The final image and the final prompt.<\/li>\n<\/ol>\n<\/li>\n
    4. Complete the reflection survey form<\/a>\u00a0to get credit for this task.<\/strong><\/li>\n<\/ol>\n
      \ud83c\udf97 Did you remember to add the Task 7 category and click Publish?<\/h5>\n

      FAQ<\/h3>\n
      \nWhat’s the grading rubric?<\/summary>\n