|

W e l c o m e !


In t r od u c t i o n

AutoPlay Media Studio is the state of the art in CD-autoplay multimedia tools. With its intuitive workflow and drag-and-drop objects, even absolute beginners can quickly achieve impressive results. But despite its world-renown ease of use, AutoPlay Media Studio is a serious development tool. In fact, it's used by thousands of people to create everything from AutoRun/AutoPlay menus and CD business cards, to fully interactive training applications. With AutoPlay, your imagination is your only limit!Each lesson begins with a brief overview and a list of the things you will learn in that lesson. The lessons are divided into a number of exercises, which are broken down into individual steps. Each step appears in bolded text, with a number beside it so you don't lose your place. Additional information or explanation for each step is included in the non-bolded text that follows it.Each lesson begins with a brief overview and a list of the things you will learn in that lesson. The lessons are divided into a number of exercises, which are broken down into individual steps. Each step appears in bolded text, with a number beside it so you don't lose your place. Additional information or explanation for each step is included in the non-bolded text that follows it.Since you selected the Blank Project template, your project consists of a single blank page, with no objects on it or anything. A clean slate for you to build on!In the middle of the program window, the surface of the current page is visible in the work area, measured in pixels by a pair of rulers.One very useful pane is the properties pane. By default, it's located to the left of the work area, along the left side of the screen. This is where you can see and edit the settings for the currently selected object or page.When panes are docked alongside each other, dragging an edge will resize both panes at the same time-making one taller and the other shorter, for instance. As a matter of fact, when you make the properties pane smaller, you will be making the project pane taller at the same time.Note that when panes are tabbed, dragging the title bar moves all of the tabbed panes at once.Docked panes can also be "pinned" or "unpinned." Pinned panes remain open when you're not using them. (All of the panes in the default layout are pinned.) Unpinned panes stay out of the way until you click on them or hover the mouse over them. Whenever you need them they "slide" open, on top of everything else, and then slide closed when you're done.You can pin or unpin a pane by clicking the little pin icon on the pane's title bar.Panes remember their positions even after you unpin them. If you unpin a pane, and then pin itThere are three ways to navigate the online help system: you can find the appropriate topic using the table of contents, or with the help of the keyword index, or by searching through the entire help system for a specific word or phrase.The preferences are arranged into categories. The categories are listed on the left side of theThe Project Size preferences are where you can set the target media size, which determines theIf you set this target media size to match the size of the media you're using, you'll have a visual· Copy a color from one object to anotherSince a big white rectangle is a bit boring for this project, lets make the page more interesting to look at.On the color chooser, hold your mouse over one of the color squares until the name of the colorHexadecimal color values aren't as complicated as they look. They're just a compact way of describing colors.If you moved up to the parent Images folder, you would see the Backgrounds folder, along withTo reach the files in the Backgrounds folder again, just double-click on it. When you double-clickMost of the screenshots throughout this users guide were taken using the List view. AutoPlay Media Studio uses the Thumbnail view by default.The Gallery pane gives you another convenient way to change the page background. Lets use it to change the background to a different image.Whenever you drag and drop an image that is larger than 75% of the page size, AutoPlay asks you if you want the image to be used as the page background. (An image that big would cover most of the page anyway.)If you answer Yes, the pages Image setting will automatically be set to use that image as the background. (If you answer No, the image will be dropped onto the page as an image object.)Some people prefer double-clicking to make their changes, while others prefer to use theClicking the Gallery button takes you directly to the gallery folder that is most convenient for the type of file you are adding. In this case, because you're adding an image object, the Gallery button takes you to the Gallery\Images\Elements folder which is where the file you want to add is located.When you select the A-001.png file and click OK, that image file is copied into your projectIf you look closely, you'll see that the image is surrounded by a blue rectangle with a bunch of little white squares on it. This blue rectangle is the objects bounding box.Another thing you'll notice when an object is selected is that its settings appear in the properties pane.Does the File path seem a bit odd to you?You're probably used to seeing paths in Windows that start with a drive letter, like C:\Temp or D:\Program Files\Blah blah blah. So why doesn't this image object have that kind of path? Well, it's actually quite simple. Instead of showing you the full path, like you normally see in Windows, AutoPlay shows you only the part of the path that is relevant to the project. In this case, its the part of the path inside the projects CD_ROOT folder. This makes the path shorter and easier to read. This kind of partial path is what's known as a relative path.In addition, the objects current position and size are displayed on the status bar.As you move the object, the position readout changes on the status bar.Once an image has been added to your project, it becomes even easier to add it a second time.Heres how it works: whenever you add an image to your project, its copied into your projects Images folder first. Then the project uses that copy instead of the original. (Which is why the File setting is always a path like "AutoPlay\Images\redshoes.jpg" even if you added the file from "C:\My Documents\Graphics\Pictures" of clown feet.)Since there are three image files that you've added to the project so far, you should see three files in the Images folder: the two images you used for the page background (including 630B1151.jpg), and A-001.png.As you resize the object, the size readout changes on the status bar.Note that the contents of the Text setting are automatically selected for you. This makes it easy for you to change the objects text right away. When you type in Ted Sellers, it instantly replacesThis time, the object isn't added in the upper left corner...instead, it appears at the location where you right-clicked on the page.Were going to use this object to display Teds email address, but for now the default text is okay.Because the new object is automatically selected for you, you can create a chain of label objects very quickly by selecting an object and pressing Ctrl+D a few times.To change the text that is displayed in the label object, highlight the contents of the Text setting in the properties pane, and type in the text that you want it to display.As you type in the new text, the objects bounding box automatically resizes to fit.As you type in Teds mailing address, make sure you press Enter at the end of each line.You may notice some red squiggles under the words Fakereal and Realfake. These red squiggles are the spell checkers way of alerting you that those words aren't in its dictionary. We don't care if they aren't, since the whole address is fake, but if you wanted to, you could click the spell check button to step through all such flagged words and choose from a number of suggested spellings.Okay.If the current value is the last item in the list, it just goes back to the beginning. Since the FontBold setting only gives you two options to choose from - namely, true and false - double- clicking on the value goes from false back to true.When you set the Normal color, you should see the label objects text change from black to light blue-grey.Watch out for those crooked fonts...Some italic or cursive fonts can pose a bit of a problem for the label object. For various technical reasons, a font that leans to the right a lot can sometimes end up with the last letter extending past the right edge of the labels bounding box. When this happens, the part that falls outside the bounding box wont change colors along with the rest of the text-only the text inside the labels bounding box responds to mouse-overs and clicks.The other way to duplicate a color is to copy and paste the hexadecimal value from one setting to another.That's it...we don't have to bother changing any of the colors, because all of those settings were already made for us simply by duplicating the object.Congratulations! You've just protected yourself from having to redo everything in the event that a computer glitch (or four-year-old) causes your computer to spontaneously shut down.In this lesson, you learned how to:· Copy a color from one object to anotherThere are all sorts of things you can do with multiple objects, like move them all at once, line them up, group them together, or even change some of their properties in one fell swoop.When you ctrl-click on the Phone label object, it becomes selected in addition to the Email Address label object. The end result is that both objects are selected.When you drag-select objects, the object that is closest to the mouse pointer when you release the mouse button becomes the dominant object. So, if you started dragging from above the EmailNow that you have these two label objects selected, lets use them with the image object to create a simple logo.Clicking the Align to Page/Dialog button does the same thing.You can tell which mode the alignment tools are in by looking at the Align to Page/Dialog button on the Alignment toolbar. If the button has a blue border around it, then Align to Page/Dialog mode is on.Objects are actually drawn onto the page one at a time. (It looks like they're all just instantly there because your computer can draw objects very quickly.) The z-order is what determines the orderBy default, AutoPlay remembers the last 10 changes that were made, so at any given moment you should be able to step back like this up to 10 times in a row.You should now have the Label1 object selected (the one with Ted Sellers on it).Its a good idea to leave the Confirm deletion option enabled, so you'll have a chance to override AutoPlay's choices before the files actually do get deleted.Now that we've covered optimizing and arranging, lets get things back to the way they were before we set off on this little detour.Note that the Label1 objects bounding box is still green to remind you that it does belong to a group, even if the other objects in the group are not selected.Note that the bounding box for the dominant object doesn't have any resize handles on it anyThe Email Address, Phone, and Mailing Address label objects should be positioned vertically, with the Mailing Address and Phone label objects close together, and the Email Address label object off by itself.Choosing Align > Distribute Vertical distributes the three objects evenly between the top and bottom ones, so there is an equal distance between all three of them.If you're wondering how you would ever get the object back, don't worry...you can unlock an object by right-clicking on it and choosing Unlock from the right-click menu.· Pin objects (so they cant be moved or resized)· Lock objects (so they stay out of your way)This lesson is all about interactivity. Interactivity is important-it lifts your AutoPlay application above the limitations of mere pamphlets and traditional business cards that dwell in the lowly realm of paper. Interactivity makes your application seem alive and responsive, and lets it actually perform important tasks for the user, just like any other Windows program.Now let's change the text to something that better describes what this button does. (Or in this case, what the buttons going to do, once we add an action to it later in this lesson.)To change the text that is displayed on the button object, highlight the contents of the Text setting and type the new text in. (In this case type in the words Ted Sellers Online.)When you're done typing the new text in, press Enter.(Later in this lesson, well add an action to this button to make it open Teds website.)Double-click on the Buttons folder in the Project pane. This will show you a list of all the buttonWhen you click on the 0001-windows-7.btn file on the Project pane, a fully working preview of the button appears on the Preview pane. (If the Preview pane isn't visible, use the View > Panes > Resource Preview menu item to toggle it back on.)Move the mouse over the button in the preview area. See how it changes its appearance slightly? This is the buttons highlight state. (Buttons become highlighted when you move the mouse overTo add the button to the page, just drag the 0001-windows-7.btn file from the Project pane onto the page. A new button object will be placed at the spot where you drop the file. Move the new button object to just below the first one.To change the font family, just click on the Family setting, click the select button, and select Arial from the list.As you've probably guessed, this button will be used to exit the application.These places generally correspond to the events that the object can detect and that you can respond to. (The lone exception is the Quick Action, which is essentially a simpler version of the On Click event.)Right now, all six items have -- None -- next to them, which indicates that no actions will be performed when these events are triggered for this object.When you click the edit button in the properties pane, you're automatically taken to the corresponding tab on the script editor. For instance, since you clicked the edit button for the On Click setting, the script editor opened directly to the On Click tab. If you had clicked on the On Leave setting instead, and then clicked the edit button, the script editor would have opened to the On Leave tab.You can click on this blue text to get more information about the action from the online help. (GoThe other parameter, WindowMode, lets you specify how the users default web browser should open up - either normally, minimized, or maximized. Its set to SW_SHOWNORMAL by default, which is fine for our purposes.Once you've set the actions parameters, click Finish to close the New Action wizard. The File.OpenURL action will appear in the list on the script editor. Note that the parameters youHeres how its going to work: on Page1, were going to make the About Ted Sellers button (Button2) jump to the page named About Ted, and the Video Presentation button (Button3) jump to the page named Video.Since button objects can respond to five different events, there are five tabs on the script editor (or, depending on how you want to look at it, five tabs on the Script tab). Clicking on the On Click tab displays the action script for the objects On Click event, which at the moment is empty.Finally, click OK to finish editing the action, and then click OK to close the script editor andThat's it for this page. You don't even have to adjust the objects Page.Jump action, since its already configured to go to Page1, which is what we want the Back button on this page to do as well.When the application appears, try clicking on the About Ted Sellers button. The application jumps to the About Ted page, with the lonely little Back button on the left. Click on the Back button, and you're instantly taken back to Page1.Once you've changed the Cursor setting, click Ok to close the Properties dialog.· Match the width and height of several objects at onceAnother quick way to delete the text is to double-click on the object and switch to the Settings tab. (Double-clicking on the object opens the Paragraph Properties dialog and automatically highlights all of the text in the Text field for you.) Then press Delete to erase the highlighted text, and click OK to confirm the change and close the dialog.A quick way to add the Paragraph.SetText action is to click the Add Action button, and then type the letters par on the keyboard. As you type in these letters, the category drop-down will skip ahead to the first category that matches what you typed. Once the Paragraph category is shown, click on the Paragraph.SetText action in the list, and click Next to advance to the second page of the New Action wizard.When you move the mouse off the button, the text remains. This is because there's nothing telling AutoPlay to change the text when the mouse moves off the object.Use an empty string ("") for all of the On Leave events.Once you have the whole line selected, press Ctrl+X to cut the text. It will be removed from the script editor, and placed in the Windows clipboard.To paste the action, just click on the On Preload tab, and then press Ctrl+V. The text will be copied from the Windows clipboard and inserted into the script editor.That's it! Job well done.The Gallery pane lets you browse the library of files that came with AutoPlay. This library is organized into different sections, each one accessible with a button at the top of the pane. Clicking on the Images button at the top of the pane displays the gallery's image collection.This kind of image file containing different interface parts is usually referred to as a skin file.

|