Art & Music - Module 8: Notes and Scales Continued (Fall 2024)

"Creating Art & Music" is an introductory course designed to introduce creative activities in the context of art and music. Thus far the course has been taught at the middle school, high school, community college, and university level (with appropriate adaptations for each level). Each week this fall, students in the course are posting their projects in this strand of the Snap! forum. Here is s a link to the course materials:

Art, Animations & Music

In last week's exercise, we created an original melody to match a backing track of chords and drums. The results were quite good. (Last week's forum thread.)

Next we are going to revisit the concepts introduced in the Combining Art with Music module. However, instead of using the Play Note block and simple musical motifs, we will use your fully developed songs and the Play Track block.

For this week, please:

  1. Review the resources on the course page for this module.
  2. Import your song into the visualization projects linked below.
  3. Test the visualizations with your song.
  4. Design a visualization of your own that follows your melody track.

Sample Visualization Programs:
Note Color
Piano Roll
Musical Panda
Starburst

EDIT: Here are some tips based on discussions and discoveries in today's class that you may find helpful.

  1. The Current Note block does not always work if you have a drum track in your Play Tracks block. If your visualization is not working, try removing the drum tracks. We are looking into this issue.
  2. The Current Note block defaults to checking the first track of the Play Tracks block. For this reason, we recommend putting your melody track in the first slot of the block. However, if a note plays in a different track while there is no note playing in the first track, the Current Note block will likely pick it up. Because of this, the more tracks you have, the more difficult it might be for the Current Note block to keep up with note changes.
  3. If Current Note detects a chord, it will only register the first note of that chord.

Here's my project for this week: I tried to combine animation with my melody and tracks, drawing different colored/sized/dimmensioned "notes" according to current notes. I would work on figuring how to get the "notes" more spaced out.

https://snap.berkeley.edu/snap/snap.html#present:Username=rachael_yuan&ProjectName=Music%20Chord%20and%20Scale%20with%20Visualization%20Project_Rachael%20Yuan

For this week's project, I made it so that clones spawn and drawn lines across the screen. The angle at which the clones arc is determined by the note, as well as the color of the clone. I will continue to work on this and maybe make it so the pen lines that are drawn also change with something related to the note.

Project Link: Notes and Scales Continued

Update: I made it so that the lines drawn on the screen also change color with the notes.

For my project I tried to combine random sized squares to appear in time with the notes. I have 3 randomly shaped squares in different colors that will appear with the current notes and I took some inspiration from the Jackson Pollock assignment we did earlier this semester. I want to maybe work on having more movement in my project that correlates to the notes.

https://snap.berkeley.edu/snap/snap.html#present:Username=francesdai&ProjectName=notes%20and%20scales%20continued

Here is my project for this week: Notes & Scales. I tried to align the dot size with the note and have them appear on the screen when a new note is played. I would like to continue working with the sizing and colors of the dots that appear to add some complexity to the piece. I am also running into an error after clicking the flag, but unsure what is causing it.

Here is my project for the week: Visual Music. I was looking to create a more fluid looking visual than the piano roll, while also maintaining a scale like look so that higher notes would be further up the screen and lower notes would be lower. Enjoy!

For this week, my project consisted of my own drawings of cats dancing while musical notes popped around them. I made it so for the notes playing, it would switch between the cat costumes, which made the dancing effect. I did the same thing with my notes, except I also dictated that they were to randomly appear at four specific corners. I may play around with changing up when the notes pop up so there is a different effect.

@rachael_yuan

You mentioned wanting to space the notes out more on the stage, so I took a closer look at the way you're setting the x-coordinate in your code. Right now, you're using Note to MIDI to scale the placement and subtracting a fixed amount from each product. The method you're using works, but since you're working with a relatively narrow range of MIDI (e.g. C4 and D4 are only two integers apart), you're going to have to scale and offset by much larger values. This means that to get significant spacing between notes, you're going to have to scale by relatively high values and then subtract large offsets.

For example, to get a space of 30 steps between C4 and D4, you'd have to multiply the values by 15 and then subtract 900 from the product to get them back in the center of the screen. If you wanted 50 steps between C4 and D4, you'd have to scale the MIDI values by 25 and then subtract roughly 1700 to get the x-coordinate.

Snap! Build Your Own Blocks . This visualizes how the whole notes are in green while the rest are in red.

I really like your animation and I think it is super cute, I think it was really smart to utilize switching between the cat costumes as an effective way to make the dancing effect and it is really well done!!

Here is my project for this week: Link
I tried to make my visualizer so that the notes change the dots to a longer shape.

The squares popping up were really cool! I can definitely see the Pollock influence as the overlapping opaque squares beautifully emulate an art piece. I found the code for the squares easy to read as well. Great job!

I really like listening to your piece along with the visualizations as well. The whole notes in green while the rest are in red is visually appealing and I like how all the whole notes in green are at the top of the drawing and then the red falls below these.

Here's my visualization of music. I used the random block to simulate falling snow in accordance with the music and a background. Visual Music - Spencer Lewis

This visualization works really well with the music and looks super smooth. All together I makes quite the entertaining and unique project to watch. Very well done, especially with pen lines and clones following the arcs.

Here is my project with the visual representation: Music and Animation

Here is my project for this week Animated Song. I animated my songs with dots dropping to each note.