CS 106 Winter 2017
Assignment 07: Noise
Question 1 Moon Patrol
Remember Moon Patrol, the classic side-scrolling arcade game from the early 80s? Of course you do. The game simulated a rover-type vehicle driving over uneven lunar terrain. The vehicle stayed more-or-less fixed on the screen while the terrain scrolled underneath it. The game uses a classic technique for creating the illusion of depth: parallax scrolling. With this method, farther away layers of scenery scroll more slowly. Amusingly, this technique is experiencing a resurgence in the world of modern web design, perhaps aided by its availability on Squarespace.
In this assignment, you will create a sketch that simulates the visual style of Moon Patrol. You don't have to make a playable game; we're just trying to recreate a few main features:
Multiple layers of mountainous scenery. You'll use the noise() function to create unbounded amounts of random mountains.
Parallax scrolling to create the sense of depth.
A small rover the drives along the lowest-level terrain. The wheels of the rover will bump up and down in response to changes in the terrain height.
A complete sketch will simply be a kind of Moon Patrol screensaver, a car that drives forever on scrolling terrain. It might look something like this:
Proceed as follows:
Create a folder called A07, and inside of it open a new sketch called MoonPatrol.
Write a setup() function that creates a sketch window of size at least 400×400.
Add a draw() function that clears the window (to a colour of your choosing) and draws a mountain range in the background. Don't worry about animation yet, just get the mountain range to look the way you want.
To draw the mountain range, you can start with something like the Noise1DDirectManip sample sketch. That sketch just draws an open path. To close it off, you can borrow the technique of the UnknownPleasures sample sketch in Advanced Shapes: extend the path off the screen to the left, right and bottom, and close it. Stretch out the noise function horizontally and vertically until you're happy with the way it looks.
Add a second mountain range below the first one. Give it a different colour, and make it somewhat smoother. Make sure that this mountain range doesn't have the same general shape as the first one. This is best accomplished by making sure you sample a different part of the noise() function. A fancier approach is to sample the 2D noise() function at two distinct y values.
Add a ground-level terrain for the rover to drive on. The terrain can be drawn similarly to the mountain ranges in the previous steps, but you must scale it vertically so that it's nearly flat.
Draw the body of a rover that sits just about the ground, part of the way from the left edge of the sketch to the right. If you want, you can simply download the file rover.svg and use it in your sketch. Feel free to design your own rover as an external SVG file, or write code to draw it directly in Processing.
Add scrolling to the mountain ranges and terrain, so that they are constantly moving from right-to-left as the sketch runs. The technique is almost identical to the sample sketch that supports direct manipulation, except that the location from which samples of the noise() function are taken updates automatically every frame, instead of being controlled by the mouse. In a first pass, see if you can get all levels of terrain moving at the same rate.
Now implement parallax scrolling. This is a small change relative to the previous step. Just imagine moving the terrains by different amounts every frame. The background mountains move the slowest, the middle mountains slightly faster, and the ground terrain fastest.
Draw at least two circular wheels under the rover. Each wheel can be as simple as a single circle.
Finally, add code to set set the y location of each wheel every frame in such a way that its bottommost point rises and falls to contact the terrain underneath it. In other words, the position of the wheel should be chosen using the same noise() function used to draw the ground terrain. Optionally, you can also adjust the y position of the rover (in the sample above, the rover moves to the average of the heights of the three wheels).
Although there are many steps above, the solution does not need to be very long. The sample solution is about 65 lines of code. One way to keep things short is to invent a helper function that draws a terrain, and call it three times to draw the three levels of mountains and ground; but this might be slightly tricky, so don't worry if your solution requires more lines of code.
You are welcome to experiment with aesthetic changes or any other enhancements to the sketch. Feel free to add more levels of mountain ranges, vary the colours, the design of the rover, add background stars or a moon or other objects, have structures move by in the background, etc. We will award bonus marks to creative, ambitious, or visually compelling sketches.
Submission
When you are ready to submit, please follow these steps.
If necessary, review the Code Style Guide and use Processing's built-in auto format tool. You do not need to use the precise coding style outlined in the guide, but whatever style you use, your code must be clear, concise, consistent, and commented.
If necessary, review the How To Submit document for a reminder on how to submit to LEARN.
Make sure to include a comment at the top of all source files containing your name and student ID number.
Create a zip file called A07.zip containing the entire A07 folder and all its subfolders.
Upload A07.zip to LEARN. Remember that you can (and should!) submit as many times as you like. That way, if there's a catastrophe, you and the course staff will still have access to a recent version of your code.
If LEARN isn't working, and only if LEARN isn't working, please email your ZIP file to the course account (see the course home page for the address). In this case, you must mail your ZIP file before the deadline. Please use this only for emergencies, not "just in case". Submissions received after the deadline may receive feedback, but their marks will not count.