Question 1 Albums

A long time ago, music used to come on large plastic discs called LPs. Inspired a bit by the prototype BumpTop interface, You will complete a sketch to help me organize my record collection.

1. Download the starter code above and open the Albums sketch. You'll see a very simple Fisica sketch that lets you toss around two squares.
2. In the data/ folder, you'll find two JPG images of the covers of the two albums in my record collection. Add code to the sketch so that these images are loaded and stored in global variables.
3. Now, modify the sketch so that the album covers are drawn right on top of the corresponding squares (you can decide which square gets which album cover, as long as you use them both):
   • Fill in the drawAlbum() function to extract the position, rotation, and size of any passed-in FBox, and draw the passed-in image over top of the box. Use as many geometric context functions as you need, probably surrounded by pushMatrix() and popMatrix(). Do not use fancy parameters in the image() function—when you draw the image, use the call image( img, 0, 0 )!
   • Add two calls to drawAlbum() in draw() that apply the two album covers to the two FBox instances. When you run the sketch you should now just see the album covers, since they exactly cover Fisica's boxes.
4. Finally, let's fly without a net. Comment out or remove the call to world.draw()—Since we're manually drawing the images, there's no need to ask Fisica to draw the world at this point.

Feel free to substitute your two favourite square images for the ones provided, just make sure that each square in the sketch uses a different image. And don't assume anything about the sizes of the images or of the squares in the simulation—you should be able to adapt to different combinations by querying the PImages and FBoxes for their dimensions.

Save your sketch, which should be named Albums.

Question 2 Dancers

In a series of exercises, you will use geometric context to draw different configurations of dancers.

1. From the provided code, run the Dancers sketch. You'll see a single dancer in the centre of the sketch window:
   
   Press any key to cycle through a number of drawing "modes". You'll see that only Mode 0 is implemented, and the others display blank screens. You will write code for the other modes.
2. Fill in the function drawMode1() so that it draws a 5×5 grid of dancers, as in the image below.
   
   All transformations must be based on the built-in functions translate(), rotate(), scale(), pushMatrix(), and popMatrix(). To draw each dancer, you must use shape( dancer, 0, 0 )—no other arguments to shape() are permitted here, or in any of the other problems below!
3. Fill in the function drawMode2() so that it draws alternating upright and upside-down dancers, with their arms all pointing to the same side of the screen. Again, make sure that every dancer is drawn using shape( dancer, 0, 0 ).
   

4. Fill in the function drawMode3() so that it draws a ring of eight dancers around the centre of the sketch window, each dancer rotated symmetrically:
   
   There are lots of different patterns that are correct solutions to this question, you don't have to copy the image here. What's important is that you have a ring of eight dancers twirling around the centre of the screen.
5. Fill in the function drawMode4() so that it draws a ring of eight dancers around the centre of the sketch window, all standing upright:
   
   The ring should be roughly circular, and the dancers should all be pointing in the same direction.

Tips

• You don't have to create exact copies of the screenshots shown here. The important thing is to create similar patterns. You may need to experiment with different scales and translations to get something similar.
• Obviously you should avoid writing functions that simply draw each dancer explicitly (e.g., 25 calls to shape() for Mode 1). When possible, use for loops to draw the dancers you need.

Save your sketch, which should be named Dancers.

Submission

Remember to review the Code Style Guide and use Processing's built-in auto format tool. Then review the How To Submit document. At the top of all of your source files, be sure to include a comment with your name and student ID number. When you're ready, zip up the entire L05 folder containing the two sketches above (Albums and Dancers) into a single archive called L05.zip and upload that file to LEARN.