1. Expert’s Corner | Paul Masters
HDMV Animated Buttons
an easier way
(Not animating buttons? This may help anyway.)

2. Introduction
One of the new features with Blu-ray Disc is animated buttons.
I am always interested in something new and different. Therefore, the second thing I did when I
became able to author an HDMV disc was to give it a try.
The first thing was to create a simple HDMV menu and project. (I had learned my lesson, at least
for now anyway. See Experts Corner: DVD to BD-J Transition or Going around in Circles)
Thanks to Christoph Schmidt for his Experts Corner: Real World 3D Example. His step by step
description on creating an HDMV menu and project made that learning curve almost a straight line.
Problems always seem to find me and this voyage of discovery was no different.
As with everything, there is an easy way and a hard way. In this case I made my own way.
Not as easy and streamlined as I would like, but easier than the hard way.
The following lays out that trek.

3. The hard way...
An animation is just a series of images. Right?
The documentation we have says animated buttons are available, but they have to be done
manually. No further explanation is given.
Using the menu already created for an HDMV project, I duplicated one of the selected buttons
three times and rotated each 90E in succession. Not a great animation but enough to test the
process.
As they were all Selected state, I named the layers S: name and then a number (1 2 3 4). They were
placed in the layers window with the N: and A: states and in order bottom to top according to the
way the DSA PSD is read.
A good guess. And, believe it or not, it almost worked.

4. The hard way... gets harder.
Importing the PSD into IGEdit worked. Some what.
Everything was there. Actually more was there than was wanted. There wasn’t a button with three
states. There were five buttons. One had the N and A images (no S image) and the other four had
one each of the S ‘animation’ images (no N or A images).
What a mess! What to do?
I guessed that if the button was deleted, it’s related image(s) would disappear as well.
I was wrong. Deleting a button does not delete the images. I deleted the four ‘extra’ buttons.
In the button properties window, there is a Start and End Object id Ref. From observation and
guessing, I surmised that these fields were used to indicate the start and end images for the
animation. Both fields have the same number if there is no animation for that state.
Fortunately, the imported images were together and in the correct sequence numerically.
I put the image number range in the Selected Start and End fields, set the Selected Repeat Flag to
True so the animation would loop instead of playing once. The Animate Frame Rate Code is in the
properties of the item that all the buttons are under. I set that to one.
Exported the Pes file. Imported to DSA. Compiled the disc. Played it with TMT3.
And there was animation (of a sort) when the button was selected!

5. There HAS to be a better way!
All of that is OK for a few ‘frames’ of animation. But what about 15 or more?
That’s only for one button. What about a number of buttons? Very time consuming.
It is obvious that IGEdit was written for Scenarist because there is an Import Scenarist Format PSD
File option. Not to mention that the field names are somewhat cryptic. (I learned later that they are
based on the BD specification. (It would be nice if they were in English for the rest of us.))
There is also an Import Sonic Scenarist Designer option. What ever that is.
Poking around on the WEB I discovered that Designer is a plug-in for PhotoShop that is supposed
to help in creating menus for Scenarist. From what I saw I would hate to do it manually. Actually,
I would hate to do it their way at all. You end up with a lot of files and a lot of folders.
Also on the WEB, I found hints about the Scenarist PSD format. Hmmm, if I could find the layout
of the Scenarist PSD, perhaps I could cut out the middle man and create one directly.
Luck turned my way this time. I was given the layout along with some documentation.
It turned out to be different from DSA, not surprising.
But not too difficult, which was surprising.

6. Keep in mind...
Considerations for BD-HDMV:
& An HDMV menu is limited to a 16MB buffer.
& Graphics are 8 bit, 256 indexed (Alpha+Red+Green+Blue).
& Index references a palette of colors.
& Alpha channel (transparency) is stored in the palette per color.
PSD layers: DSA format - read ‘bottom to top’. Scenarist format - read ‘top to bottom’.
Not critical, but knowing which orientation to use can eliminate changes in IGEdit and save time.
For example, in IGEdit:
& The top button in a menu is considered the default when the menu is displayed.
& Animated button images may be reversed if not loaded in the correct order.
& Setting navigation between buttons is easier because they are listed in the order read.
& The first page is the one initially displayed.
& An added Page, BOG or Button goes to the bottom of the related group.
& While there may be a way to reorder Pages, BOGs or Buttons, I have not found it.
As with BD-J, all HDMV menus are ‘pop up’ and all show on top of a playing video.
There is no way at this time to re-import a PSD and retain existing settings or code!
(That ability may be in a future release of IGEdit.)

7. “The prefix Mam ... just the prefix.” (Sgt. Friday -Dragnet)
The Scenarist PSD format has a lot of groups. However, there is nothing in most of them, except
for other groups that is. While Scenarist may make use of the all the groups, we in DSA only have
to work with a few of them, although they are all required by IGEdit.
The only thing of importance are the prefixes. The colon is part of the prefix.
The button group is the only one that needs a name.
The following is a short description of the layout with meanings and some notes.
IG: Interactive Graphics
DS: Display Set
P: Page (HDMV menus are like DVD menus in that they have pages.)
BOG: Button Overlap Group (More than one button may be in group, only one may be active at a time.)
B: Button (Need a name here for specifying navigation between buttons.)
Nx: Normal button image
Sx: Selected button image (x is 1 unless animating that state then a sequential number starting with 1.)
Ax: Active button image
BG: Common background for a page (overrides Background)
Background (notice - no colon)
I haven’t worked with the backgrounds, but would suggest that all background
images and static text be put in the video as when using BD-J looping menus to
reduce the buffer usage.

8. PSDs compared.
The same menu.
On the left is the DSA format.
On the right is the Scenarist format.
See the Experts Corner: Real World 3D
Example for explanation of the Init menu / page
(or the tutorial).
There are a lot of groups, but the button image
name is similar.
Animation (The DSA version
layers doesn’t have animation.)

9. Imported to IGEdit.
Note:
Set Animation The animation
Frame Rate in
here. images are
under Selected.
The Start and
End id Refs
were filed in.
(The required
Normal image
(created in
PhotoShop) is
nearly
transparent in
Set to true for the Scenarist
continuous PSD.)
animation.
DSA PSD Scenarist PSD
Imported into IGEdit they look remarkably the same.

10. One thing leads to another.
First a template with IG, DS and the first P groups was created. The idea was to open that, add the
buttons and save as... the menu. (Well...that was easy.)
Wait a minute. After the buttons were imported, they may have to be altered. Cropped to size,
remove the background and so forth. Some of that isn’t easy in PhotoShop. Each element has to
be worked on in another document and them moved / copied to the target or saved to a file then
opened in the target. Therefore the buttons have to be done one at a time. (Getting worse.)
Ok, bring in the images of a button, edit as needed and put them under a B group under a BOG
group. Then move / copy the top group to the target. Usually the three button states are the same
but they don’t have to be. That means each state may have to be done separately. (This is getting
messy.)
In Sony Vegas, created 3 buttons each with 3 animated states and each animation is ½ second long.
Rendered all to .png files with transparent background. Uh, wait a minute...that’s 3x3x15 = 135
images. That’s 3 iterations of the above paragraph with 45 images / layers each time.
Have you renamed 135 layers in PhotoShop? Neither had I. Renaming the few layers required for
DSA BD-J buttons takes too long as it is. (This is ridiculous!)

11. ...and another.
I know about PhotoShop Actions. I have created one or two simple ones. From that experience I
know Actions won’t do what is needed.
PhotoShop has scripts. I have never seen one much less written one. I found that they are written
in JavaScript. I have not written in that either. (By the way, JavaScript is not JAVA.)
Therefore with that wealth of experience, I decided to write one. Actually I wrote two.
They are not ‘elegant’ or pretty. When used in the way they are intended, they work. I know that
everyone who uses them will do so in exactly the way they are supposed to. (Yeah, right! In my
40+ years of programming I have many times seen users run programs other than as intended.)
The 90 90 rule of data processing: 90% of the work takes 90% of the time and the remaining 10%
of the work takes the other 90% of the time.
90% of the work is done. The scripts work. Perhaps some day I will do the other 10% of the work
to make them how I would like them to be.
My part of the scripts is small. The hard work was done previously by others.
See the Acknowledgments and Credits page.

12. The easier way.
The scripts are in the zip file in the BLOG: Scenarist Target.jsx and Scenarist Buttons.jsx
Copy them to: C: Program Files Adobe Adobe Photoshop CSx Presets Scripts
They will appear in PhotoShop in File/Scripts
The scripts were written in PC PhotoShop CS3. I have no way to tell if they will work in later
versions. They will likely not work in prior versions. They may or may not work on MAC.
They are provided as is. I am not a JavaScript or PhotoShop script expert.
For any questions about the usage of the scripts please eMail me at paulemasters@hotmail.com
If you are knowledgeable in these areas and can correct or improve the scripts, please do so and
post them on the forum for all to use.
Due to the scripting operation or my incomplete understanding of it, there are things I do not like
about the script operation:
& Input data is checked for errors and messages written. If there are errors, the script terminates
and must be run again. All data entered will be lost.
& There is no easy way to limit the length of input. If the first character is Y in the Y/N fields,
regardless of any following characters, Yes is assumed.
If you use the dummy Init Page/BOG/Button, as it has only one Normal empty
image, it may be easier to create it manually after the rest of the menu is
complete. Remember, it should be the first Page.

13. The easier way. Step 1 - Creation.
Create the button animation images using what ever means you desire. To avoid extra work:
& Frames / layers should have transparent background.
& Only one button on the screen.
& If from a video editor: Save as .png files. Use a sequential number at the end of the name.
& If in PhotoShop: Ensure the layers are in correct order - top to bottom in the layers stack.
Run script Scenarist Target:
This script will create a document with the initial Scenarist format groups.
The results of the second script will be placed in this document.
Upon completion of the menu, use File/Save as... to save this document with the desired file name.
Enter the names you want for the IG / DS Set and the first Page.
All are optional but recommended. Enter the first Page name if there will be more than one.
The remaining fields are setup information for the document. The defaults are for HD.
Make any needed changes. Warning: The data is not checked. Be sure all is valid for your needs.
Note: This document settings and that of the button frames / documents / layers should be the same.
Click on OK or press Enter.
Or click on Cancel to exit with out creating a document.

14. The easier way. Step 2 - Setup button.
Process only one button at a time. Regardless of how many frames / layers there are per state, all
may be processed at the same time. If for some reason each state must be processed separately, do
the Normal state first as that will cause the BOG/B groups to be created. When the Normal state
number is zero, the copy is not done, therefore, the related layers must be manually moved / copied
to the target and put in the correct place in the layers stack.
Remember: A Normal button state is required by IGEdit.
At this time, do buttons in reverse order. That is because they will be copied to the target document
and placed at the top of the group, not the bottom. This will make working with them in IGEdit
easier.
If the button images are in files, run PhotoShop script Load Files into Stack...
Use it to select the range of files to load. Once selected, click Ok and then Ok.
The files should be loaded in file name order one per layer with the file name as the layer name.
If the button images are in PhotoShop, switch to that document.
In either case:
& Ensure the images are in Normal, Selected, Active order - top to bottom in the layers list.
& Ensure the images in each state are in the correct order - top to bottom in the layers list.
& Make any adjustments to the images as needed.

15. The easier way. Step 3 - Process button.
Before running this script ensure:
& Layer in target PSD the button is to be paced under is active/selected. It should be correct
if Scenarist Target was run, no changes to it were made and no errors have occurred.
& The button work PSD is active, all layers are in the correct order and all selected.
Run script Scenarist Buttons.
Enter the number of layers for the Normal, Selected and Active button state to be processed.
The entered values must be numbers, no letters, spaces or special characters.
The total of all numbers entered must equal the number of layers selected/active in work PSD.
Enter the button name.
Enter the BOG name if it is the first or only button in that group.
Generally there is only one button in a BOG. The name may be the same as the button.
Copy to target PSD would normally be Y.
Click on OK or press Enter. Click on Cancel to exit with no action.
The selected layers will be renamed to IGEdit Scenarist format.
If Normal is not zero the selected layers will be placed in a Button group which will be under a
BOG group if a BOG name was entered.
If copy to target PSD is Y and Normal is not zero, the created group(s) will be moved to the target
PSD under the selected/active group.

16. The easier way. Once more with feeling.
If more buttons, delete (or close) the current work PSD (to avoid clutter and confusion).
Repeat Steps 2 and 3 for the next button.
When the menu is complete, make the target PSD active, add the Init Page/BOG/B groups and
empty layer if required, then use File/Save as... to name and place the file as desired.
Scenarist Buttons script checks for some errors and displays a message. In any of those cases,
nothing is changed. Except if the Scenarist Target created PSD is not found and you click on
Cancel instead of selecting one of your open PSDs as a target (see next page). In that case the
button layers have been renamed and the BOG/B groups have been created.
In case of an unforseen error, the target or work PSDs may be left in a state not conducive to
running Scenarist Buttons (Step 3). If that happens, use the PhotoShop History list to ‘backup’ both
documents to reset / clear / undo any operations that were performed.

17. The easier way. Variations on a theme.
This process was designed for various situations. Some examples.
If more Pages:
Remember to add pages top to bottom in the layers stack. May not be able to reorder in IGEdit.
When ready for the next page, make the target PSD active and add a new Page layer under the DS
layer. Position it as the last Page. Make that layer active. Continue with Steps 2 and 3.
More than one button in a BOG:
Create the last button in the BOG with Steps 2 and 3.
Make the target PSD active and make the desired BOG layer active.
Continue with Steps 2 and 3 with the buttons in reverse order and make no entry in the BOG name.
When done with that BOG, reset the target PSD active layer to the desired Page.
Add a button to an existing Scenarist format menu PSD:
Open that PSD. Make the desired layer active (Page or BOG).
Perform Steps 2 and 3.
If Scenarist Button doesn’t find the document created by Scenarist Target, a list of open documents,
not including the current button work PSD, is displayed. Select your document.
That is required each time a copy is performed.

18. Conclusion
I hope this helps if you ever want to do HDMV menus with animated buttons.
This process may appear complicated at first. But after doing it once you should find it easy.
It is definitely easier and less complicated than the one the Scenarist people have to do.
Even normal HDMV menus could be created with this process. However, the DSA format is
simpler and may be quicker to create. I’ll leave that up to you.
The zip file contains this PDF, the complete DSA project, the PSD and a video tutorial.
If anyone has any questions, comments, disagreements, arguments or problems with anything in
this presentation, please post it to the forum and I will do my best to answer.
I hope my perspective on this has been of some help to all.
Thanks for your attention.
Paul Masters

19. Acknowledgments and Credits
I am not clairvoyant nor do I have $25K+ for Scenarist. The format of the Scenarist PSD and other
information was given to me by Valery Koval at DVDLogic after my begging. With out which this
would not have been possible.
A document at http://www.kahrel.plus.com/indesign/scriptui.html written by Peter Kahrel provided
information about the data input process of PhotoShop scripts. It was invaluable as the Adobe
documentation is inadequate.
Already written code was found on user fora that is the bulk and ‘hard parts’ of the scripts:
Paul Riggott - http://forums.adobe.com/thread/831462?tstart=30
The majority of the code for Scenarist Button - Processing a group of selected layers.
Jeffrey Tranberry - http://www.tranberry.com
Make Guides, Document creation. (Scenarist Target)
Michael L. Hale - http://forums.adobe.com/thread/829411?tstart=30
Selecting layers, Duplicating layers, Make active by index, Copy to another document.
And much help on www.ps-scripts.com.
If you want to see what Scenarist people have to go through, see the tutorials at
www.reykroona.com/?page_id=35