Click on the keyframe of the Play button to make it active and then click on the Action tab of the Inspector window. Select the Mouse Click event, and click on the Add New Action button. Select Movie Rate from the drop down menu and change the value to 1, and then Apply.

Click on the keyframe of the Stop button, make it active, add a new action, and select the movie rate as before, but this time change the value to 0. We have just set these two buttons to play and stop the QuickTime movies. If all you are adding is Play and Stop buttons, you can jump to the next section.

Rollover buttons created in Photoshop must
maintain certain naming conventions to work
in Adobe GoLive 5.0

The segment buttons were a bit different. To save time and space, I will quickly outline how to do one of the buttons. Make sure to Add New Action for each action listed.

Segment 1 button Mouse Click

Repeat this process for the other segments of the movie.

The skin stands alone
That does it for wiring the sprites. If you examine the QuickTime tab, you will notice that you can also embed .swf, hypertext and 3D tracks into you final movie.

Save the QuickTime movie as a self-contained movie. Another thing that I discovered is that the file size for this interactive QuickTime movie is the same size as a regular edition of DMN TV that plays the segments sequentially.

If we play the QuickTime movie, the viewer will be able to use all of the interactive controls that we just set, but it still plays within the QuickTime player. Time to make it a stand-alone skin.

The next step requires some XML programming, but thanks to Apple, the script is already written. Paste the following text into a text file.

<?xml version="1.0"?>
<?quicktime type="application/x-qtskin"?>
<skin>
<movie src="savedquicktime.mov"/>
<contentregion src="mask.pct"/>
<dragregion src="drag.pct"/>
</skin>

This little script will load and place the mask and drag mask images we created earlier and create the media skin.

Save this text file with the .mov extension (xml.mov for example), and place this script, the interactive QuickTime movie and all of the image files in the same directory. Launch the xml.mov file in QuickTime Pro. If everything has been done correctly, you should have the QuickTime movie playing in its own standalone window.

The final step is to save this movie once more as a stand-alone movie (final.mov, for example). The movie can then be linked on a Web site, with the following embed tag, which will display a poster frame. As soon as the viewer clicks on the image, it will launch the QuickTime movie as self-contained.

<EMBED SRC="poster.mov" TYPE="image/x-quicktime" HEIGHT=120 WIDTH=160 HREF="final.mov" TARGET="quicktimeplayer">

The only drawback to this entire process is the end viewer needs to have QuickTime 5 installed on their system. If they do not, the movie will open inside the standard QuickTime window with the skin and all inside the regular QuickTime borders.

Whew!
Because I used three different movie files for this tutorial, it made this exercise a bit longer than normal. If you are using a single movie track, creating a regular QuickTime movie in its own skin on a regular basis could become second nature.

Click on the image to view Media Skin.
Press Command W to close.

Hopefully this exercise not only showed you how to brand your media, but also gave you some ideas on how you can add more interactivity to your QuickTime movies. Think how easy it would be to add a director's commentary track or other audio or video track to your future streaming masterpieces.

If you are still confused about how all of this goes together, there is another cool item I discovered. If you find a great example of a QuickTime media skin, and if you can save it to your hard drive, you can open that QuickTime movie in GoLive and it preserves all of the formatting. It's then a simple matter of viewing the timeline and seeing how they did it.

Go to Page [ 1, 2, Complete, Home ]

Post a message in the Creative Mac World Wide User Group.