CS215 - Multimedia Design & Programming Homework


Past Projects
MAS Major






Homework 7 - Examining Sound
Due: See Schedule

Synchronizing audio and animation.

In this assignment you are asked to create a one-screen director application similar to the ones typically used in kids' CD-ROMs, where the computer reads aloud a sentence to the user, highlighting (or animating) the appropriate words. In addition, when the reading is over, the user has the option of clicking on a word and hearing again the word's pronounciation. See the (Japanese) version of the famous Just Grandma and me, for example. (The video just presents the interactive story, it is not the real thing.) I am offering two ideas below for creative departure from this basic functionality.

Idea 1: Creative Reading of Design Strategy Statements

One way to fulfil the requirements would be to produce a creative reading of one of the Design Strategy Statements made by the Architects of the Lulu Wang Campus Center. You are free to choose any one you want from these statements. Name your file name-visionX.dir where name is your puma account name and X is the number of your sentence. An example of such an application is the reading of "7. The building is a beacon" statement.

Idea 2: Karaoke of your favorite song

Another option would be to create a karaoke presentation of your favorite (or not) song. Like with idea 1 above, you need to provide the lyrics and animate them as they appear on the screen synchronixed with the sound, like the I Believe by Simian Mobile Disco or the Little April Shower song. Name your file name-karaoke.dir where name is your puma account name.

Implementation details

One way to implement this homework (there are several other ways, of course, use whatever seems more intuitive to you) is to have two "sections": One that plays the whole sequence with the right timing over a number of frames; the other that loops within a single frame and, when a word is clicked, it hilites the word and plays the sound portion.

To hilite the word you can use a command that would make a hilited image of the word visible and then invisible. To play a sound piece you could use the sound().play() command. For example, the PianoCue.aiff file used in the sound synchronization example has 2 cues. You can tell Director to play the portion between the two cues by executing (on a single line of code) the following:


Even though we have not gove extensively over font selection, you should think a bit about what is the appropriate font to use in this assignment. But do not worry if you do not get it right. In a later assignment you will update this application and choose fonts that match your sentence's sentiment.

What to turn in

Your .dir file should be no larger than 2 MB.

As usually, save your appropriately named dir file, along with the published html and dcr files inside a directory named ps07 in your home CS215 directory.

Creative part

There is a lot of room for crative design in this assignent. See, for example, the animated singing of Un Elephante. They come from a book with Spanish songs that I can lend you to create something similar, if you want. Or animate your own email signature. Or an excerpt of your favorite picture book. Of course, your project should have complexity comparable to the reading of the "7. The building is a beacon" statement.

As usual, you should remember what your learned in previous assignments: Sign your work, provide a title, animation, navigation as appropriate.

In addition to how well you executed the assignment, you will be graded on how well you followed the specifications of the assignment, and whether you completed its Assessment questionnaire.

Have fun!



Maintained By: Takis Metaxas
Last Modified: October 31, 2013