Blu-ray Tutorial 3: Basic HDMV Menu Using Photoshop and Designer
My third tutorial is complete, again as a screencast. This time I show how to create a basic one page menu for Blu-ray HDMV. It’s a little longer than the last tutorial and goes much more in depth with Sonic Designer. The next tutorial will be on creating multi-page menus with animation using After Effects and Photoshop.
Get the Flash Player to see this player.
If you are having trouble viewing the video, please read *A Note About  Flash
April 23rd, 2008 at 3:33 am
Hi there,
Thanks for your blog, it’s packed of usefull info.
I’m starting my personal deep dig into Scenarist and I’m very impressed about how difficult is to make a simple PSD for export in Designer.
I would appreciate if you tell where can I get a sample PSD, then I’d have a point to start from.
Thanks again for your valuable info.
April 23rd, 2008 at 8:13 am
Hi Claudio,
I’m glad you found the website helpful.
I’ll upload my files I use in the tutorials for you later today so that you can see what is being done on your own computer. But for now, if you go to http://forum.doom9.org/showthread.php?t=135757 there is a link for a PSD file that might help you.
Check back later today for an update with the files.
April 23rd, 2008 at 11:03 am
Thanks for the quick answer!!
Would be a great idea to sign up to that doom9 forum !!
May 12th, 2008 at 4:29 am
Hi Kroona.
First is not much English, I am of the Spanish island of Ibiza Spain. I translate the Tradutores of Google, so pardon for the mistakes.
I find it very interesting your blog, because almost nothing on the website on Scenarist, let alone BluRay version.
Well I have followed with great interest your tutorials, and although I find it difficult to follow the thread, (and therefore language) I work with photoshop and windows in Spanish, folders are not in the same place on the agenda.
I am interested in the tutorial Basic HDMV Menu Using Photoshop and Designer, I feel fantastic this scrip and save a lot of work, but it gives me an error loading HTML, I think it is because I do not have version 3 of Scenarist designer, also work in Version 4.3 of Scenarist.
I also like the Flash HDMV Viewer, is similar to DVD Reauthor of DVDLogic Software?, I used it in the Reauthoring DVD, is going very well and learned a lot about the menus.
Well, I do not want liarme but for now, thank you very much and fantastic blog.
May 12th, 2008 at 8:18 am
Hi Juan,
Thanks for the feedback, I’m glad you are getting a lot out of the blog.
Designer is currently on Version 2.2, which I’m sure is included with 4.3 of Scenarist. If you can send me what the error says when you load the HTML file I might be able to help you. Some times if you don’t format it correctly you get some errors that just need a little tweaking to get going.
The HDMV viewer isn’t really like DVD Reauthor. It’s more of a quality control/client approval program to look at the menus without sending them into Scenarist HDMV yet.
I hope that helps you out a little, let me know about that error and I’ll see what I can find.
May 13th, 2008 at 4:25 pm
Hi again Kroona.
Thank you for responding. After reviewing a couple of times I see that the problem is the version of Designer. The HTML file not charged either because neither able to create good, I do not have to keep the option “designer” in setting, and then I cripts not an option “slices to Scenarist designer.”
After the tutorial and to see Installing Sonic Designer PS, and I saw more clearly the problem.
In order that will have to see how to get the appropriate version of Sonic Designer. Thanks again. Sorry for the English.
I leave a few images of the versions I have.
http://img179.imageshack.us/img179/1002/designer1gz2.jpg
http://img527.imageshack.us/img527/5985/designer2uk9.jpg
May 28th, 2008 at 12:21 am
Hi kroona
thanx for the tutorials it was very usefull
but i couldnt get the scripts which you used to convert the png layers in to Scenarist main menu sets could you help me out…
I am using photoshop cs3
sonic scenarist 4.5 versions for authoring blu ray disc
regards
sai
May 28th, 2008 at 12:24 am
Hi kroona
Thanks for the tuturials it was very useful
But i am unable to make IG main menu set with animated buttons in png files
I got it on layers but unable to make it as
IG Main menu sets
I dont have the script to make it in folders
could you help me out
I am using Photoshop cs3 and sonic scenarist 4.5
Scenarist designer 2.0
regards
ananthasai
June 15th, 2008 at 11:32 pm
can any one send me sonic hdmv authoring full author tempelets
June 16th, 2008 at 8:57 am
There is one on Sonic’s support site, but I also remember seeing one at bdjforum.com. I was looking for it, but didn’t see it right away.
July 10th, 2008 at 4:11 pm
Hey,
thanks for the tutorials, they’re really helpful. Quick question,
when designing the menu in photoshop everything goes good until the last step Export to Designer PS. Everytime i try this Photoshop crashes. It doesn’t give an error message, just “PS has quit unexpectedly.”
Do you have any idea what i may have done wrong? Everything looks good. The menus are basic without animation etc.
PS i’m using a Mac running CS3
Thanks
July 10th, 2008 at 4:52 pm
I ran into a similar problem, but I don’t exactly remember what I did to fix it. Are you on 2.5? Make sure you installed the CS3 version, not the CS2. Otherwise, I’m not really sure. I think there may be a photoshop update, you might want to install that.
Sorry I couldn’t be more help.
July 28th, 2008 at 4:37 pm
antena merlin…
antena merlin telkob…
September 17th, 2008 at 9:52 pm
Hey Rey,
This is a huge part of my job, but I’ve only done static buttons. Until I watched this, I actually didn’t know you could have N2, N3 etc. states. I was given a test menu, and part of the design was colored lights. The designer wanted to know if there was a way to make those lights blink. I didn’t think there was, and the author said he didn’t think so either – but I’m wondering if I could do that by having 2 normal states for each light, one being black and one being that color. Is that how I would do that? I would email you but I can’t find it – feel free to email me back though, it would be awesome if we could figure that out and I could make it work!
September 17th, 2008 at 10:19 pm
Hi Adam,
Yes that is possible, I’ve actually done some pretty complex (well I think they are complex) animations. For more complicated things I try to use After Effects to make my animations a little easier. I have a tutorial (tutorial 4) that takes the HDMV menus a step further to explain how to do this. An example of this can be seen on this menu I did a month or so back:
http://bluray.reykroona.com/index.php?LoadMenu=Immortal&bgVid=vmf_bg_immortal_n.flv&s=false&f=12
In Scenarist the trick is to tell it how fast you want it to animate. 1 is the fastest, which I think is about 12 frames per second depending on the player. 0 doesn’t animate and anything above one is slower. There is also an option somewhere that tells it if you want the animation to loop, or hold on the last frame. In your case you probably want the light to switch every second or so, so you’d probably want to set the animation rate to 8 or so (completely guessing) and tell it to loop.
In fact you can animate all 3 states if you really wanted to, though I suspect your buffer would run out pretty quick.
So to give you a final answer, in your case all you have to do is add another N2 layer with the different color for each button and you would be done. You can also try downloading the Flash HDMV Viewer I created to help you see what it would look like. You don’t have to install it onto a server, you can drag and drop the DesignerAS.swf file into Internet Explorer and just type in the name of the folder Designer exported for you to see it. Just make sure the swf file is in the same directory
Hope this helps,
Rey
October 23rd, 2008 at 2:21 pm
Hi Rey,
First of all, thank you for your very good tutorial !
Now I am a SD DVD programer (on Sonic Scenarist and on DVD SP) and I will go to Sonic next month to have a training on Scenarist BD… So I’m happy you know
But I can’t wait for a month so I’m looking at your tutorial and I have one question for the moment : You said that the most important thing is we have to be careful about the total remaining into the .csv document (F column “Total memory 8 bits”). But in one of my test menu I see a negative value into the G column (Total memory 32 bits), is it a problem or not ? and why ?
Thank you to take a little time to answer me and excuse me for my approximative english (I am a french man in Montréal
Regards,
Sven
October 23rd, 2008 at 5:28 pm
Hi Sven,
The newer version of Designer (2.5) has a built in buffer checker so you don’t have to use the script anymore. It’s a lot easier to read and also checks for other dithering issues you mighBut in the script, for some reason they put a 32-bit option in there. I think it’s more for BD-J stuff, but for HDMV you can completely ignore it. When you export the images are all automatically exported at 8-bit.
Hope that helps, you should be able to just move forward if you are ok in the 8-bit column.
Rey
November 24th, 2008 at 1:42 pm
Hi Rey!
First of all, amazing hompage, super tutorail. It helped me a lot. thank you!!
but my photoshop designer doesn’t work as i what to. when i klick export scenarist designer an then export image, he write all the right folders and pngs an mei harddisc but there ar no .scenarist.designer file, which i can import into scenarist bd. whats wrong?
another problem is: if i have a BG:BG_Background picture in mei P:P_Menue folder photoshop write “non bog/group layer in page [path:...]
i hope you can halp me a little bit, additionaly to the other things you had done for me. like the tutorials
Tanks!!!!!
domi
November 24th, 2008 at 1:48 pm
I’ve never heard of designer not creating the .scenarist.designer file, that’s very strange.
Can you send me your Photoshop document and I’ll take a look at it and if I get it working I’ll send back over to you with the changes so you can see what I did.
November 24th, 2008 at 2:10 pm
That would be great!
But i have allready not finished my menue. i have allwayes tried is with yout tutorial3 or previous version of my menue.
i will try to komplete my maneu this week and send it to you after i complete it.
maybe you can send me your mail adress where i can send my file to
thanks very much
December 8th, 2008 at 3:16 am
I come from China! (Translated by Google)
You write the curriculum, provided us with a great help!
Because of language barriers, in the course also met a lot of problems.
For example, “Import Folder To Layecs” and so on several scripts, I do not here!
Can provide a download it?
In the first expressed his thanks
February 9th, 2009 at 12:20 pm
First of all, thanks for your great tutorials, they’ve been a great help to me so far!! However, I’m stuck with this problem: when I make my IG template in Photoshop CS2, and I export it to designer, I keep getting error messages that certain buttons overlap with other buttons. After a lot of trying I found that every button has to be at least 300 pixels away from the other. Surely, this can’t be right? (it’s almost 1/3rd of the screen hight in 1920×1080 resolution) Why can’t I place my buttons any closer to each other?
February 9th, 2009 at 12:26 pm
No, the buttons can be right next to each other. What I’m guessing is happening is there is a glow or a stroke or something that might be overlapping just a little bit. You have to be really careful with this sort of thing. Sometimes you might also get a single stray pixel that is slightly transparent that is causing the problem.
What I do sometimes when I run into this is select around the image, inverse the selection, and hit delete to clear out anything that might be in the way.
Try that and if you are still having issues you can email me the PSD and I’ll take a look at it.
February 9th, 2009 at 1:11 pm
Unfortunatelly, I tried it all, starting out with completely empty layers, rebuilding everything, moving buttons around, but no luck. Unless I leave a space of roughly 300 pixels or more between the buttons, Designer will keep giving me the overlap error. I’ve sent you one of my trial PSD’s, really hoping you can shed some light on the matter. Many thanks in advance!
February 10th, 2009 at 12:54 pm
Hi, just wanted to say that I’ve been struggling with some menu issues for quite some time and in addition to this tutorial, Rey’s been a great help to me, figuring out where I went wrong. Thank you very much!!!
February 14th, 2009 at 2:49 am
hi,thank you very much.but I dont have the script”import the folder to layers”
could you share the download site.
February 23rd, 2009 at 8:06 am
Hello,
I found the script here:
http://morris-photographics.com/photoshop/scripts/import-folder.html
February 28th, 2009 at 2:49 am
thanks for your tutorial and the script.
Follow your video I have finished the menu.
But tutorial 4,I don’t know how to do it.
especially the slices.
March 19th, 2009 at 5:41 am
Hi, Kroona.
First of all, i really appriciate for your so useful tips always.
i’ve got some questions here, i am very bad in english though.. so plz forgive me:(
i also got similar problms with above.
which is buttons can’t be overlapping.
as you said, a little bit of pixel’s overlapping between each buttons is ok, but when i work with
Scenarist HDMV, i get message like this :
Error : Two or more Buttons are overlapping.
and before HDMV working Scenarist Designer also
gives me error messages but still can generate
desiner files for only BD-J/HD-i but diable for
HDMV.
Do you have any idea about that?
**
my client wants to make a menu what has a circle button on biger circle button. like target.
do you get it? T_T
March 19th, 2009 at 9:26 am
Hi there,
I think you might have misunderstood one part, you actually can’t have any overlapping pixels. Not even 1. Sometimes they get very difficult to see, especially if it’s a transparent pixel.
To fix this when I run into it, I select around the button, then inverse the selection and delete anything in there for every layer. You kind of have to clean everything up.
You may also just want to go back a few steps and make sure everything was sliced correctly. Maybe your slices are overlapping or something which could be causing issues.
I know it can be frustrating. Email me your psd if you are still having trouble and I’ll take a look at it.
March 20th, 2009 at 12:37 am
thank you for your reply
maybe i did, i misunderstood. sorry
my problem was other issue.
there was no button overlappings.
i tried several way of delete job for get rid of
extra pixels. but i never could pass through
Scenarist designer.
lately i found important info in your very early tutorial. maybe it’s problems concern with it.
‘Buttons still must be square’
but they(buttons) share some cordinate.
you can imagine ’star’ shapes buttons sticking toghether in edge(side, not point).
so a button can’t be out of square of other button.
that’s what i understand about the situation im on.
right?
July 22nd, 2009 at 10:57 am
Hello Rey,
I luv your site, your tutorials are awesome, they’ve been so helpful xoxoxo !!! Quick question, can we rename the slices before saving as a html file? So when importing back with the script “Slices to Scenaris Desginer” the layers and folders could be already named properly.
July 22nd, 2009 at 11:05 am
Hi Maria,
Yes, if you name the slice then save the HTML when you slice it the name will be correct. You however need the newer script for this to work, which is bundled with 2.5 I believe (which this tutorial was recorded with an older version that didn’t have that option). To name the slice just Control+Click it with the slice tool and you can put a name in.
One interesting note, the 2.6 scripts also run in reverse so that your buttons are all in the right order and you don’t have to rearrange them.
October 29th, 2009 at 3:10 pm
YOU ARE AWESOME. Thank you so much for this tutorial. I had to do all this for my job and had no idea how until I watched this and all your other tutorials. Thank you thank you thank you!!!
November 29th, 2009 at 3:32 pm
Hi koona,
Nice job as usual:) By the way Do you happen to have any idea about using in/out effects for scene selection Menu with scenarist BD .I meant having the chapters slide-in slide out from one index to another. I tried to use after effects but I had a problem when importing the png folder into layers ! it just did not work
Thanks a lot
February 3rd, 2010 at 5:13 pm
Any idea what it means when it’s telling me “Active state button name should start from 1″?
February 3rd, 2010 at 5:36 pm
got it!!!