# Unit 3 Final Project: Patatap

### Teacher Notes && Overview

As with all projects, this can be customized to better fit the needs and interests of your students; this is simply a starting place! If making a patatap inspired piece does not interest you, consider asking students to recreate a musical instrument (such as a piano/keyboard) that they can 'play' in p5 with visual input, or something similar. The sky is the limit!

### Prompt

You are going to be tasked with making a program that will be fully interactive and allow the users to play sounds that also correspond to something that happens on the canvas. (Think back to our lesson on sound with the changing face!) This project is inspired by the [Patatap website](https://patatap.com/), which is worth exploring as a class and invidiually before beginning.

#### Task && Requirements

Create a program that has/does the following:

* Includes at least 5 sounds, each that plays when a specific key is pressed
* Makes something appear or change on the screen when each sound is played
  * While many can be shapes, at least one needs to use text/fonts
* Utilize loops for at least one drawn design
* Organize using arrays and/or dictionaries as needed
* Create functions where necessary to simplify code
* Utilize any other relevant skills from past lessons - think back on past projects and get creative with skills you can integrate into this one!

#### Writing Prompts

* Explain how your program works.
* Describe a challenge you faced in making your program and how you solved it.
* In what ways could this program be improved, given more time and resources?

### Sample Outputs

[Sample Project Code](https://editor.p5js.org/cmorgantywls/full/kNg4Q83p3)

<figure><img src="/files/SUMzaWTCSrXAmK5mZNeM" alt=""><figcaption><p>Be sure to visit the actual project - this isn't as exciting without the sound!</p></figcaption></figure>

### Extensions

As we get further and further into the course, the extensions become more about how students choose to challenge themselves by using the reference sheet and generalizing learned skills to do something new.&#x20;

In the sample project, a variation of timers are used (frameCount with modulo) to make things happen to a beat; this would be a great mini extension for students!


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cs4all-icm.gitbook.io/js-intro-to-computational-media-2.0/unit-3-arrays-loops-media/unit-3-final-project-patatap.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.