Help making a circle simplebutton highlight & button...(Snapshots provided)

Question

Hello, I've searched the forums regarding buttons and circles, but seems that I'm still having trouble understanding.
I've noticed DVDSP4 is filled with more rectangular/square buttons, I have been using them in the past. This time, I'm working with circle buttons on a menu screen.
Here's a snapshot of what I'm working with today:
The circle button that came with DVDSP is called "Circle Highlight" and is the only one I can find. However, it's really pixealated:
/___sbsstatic___/migration-images/464/4647754-2.jpg
Is there a way I can recreate this button without it being pixelated? Does it need to be in exact dimensions with each circle in order for it to not be pixelated?
I'm a fan of the "simplebutton" that DVDSP provides, I currently have my settings set to this:
/___sbsstatic___/migration-images/464/4647754-3.jpg
The above image is when it is activated. I would like to basically make a "simplebutton" button and highlight that not a square or rectangle, but a circle. I would like to know the means of achieving that.
Thanks so much for your time! Your help is greatly appreciated.
iMac G5   Mac OS X (10.4.7)  

Answer 1

When doing something like this, I usually make a layered menu in photoshop. I don't know if that's the best way to do it but it works...
You need to make a photoshop document with a few layers for each button - one layer for the inactive state, one for the active state and one for the selected state. All your inactive buttons can be flattened to one background layer because they stay on the screen all the time. So create your menu background first and flatten it into one layer.
Then, create 2 new layers for each button. One layer will be show how the button will look when selected. Perhaps you can put a glow behind your circle when the user navigates to it. The second layer will be how the button will look when it is activated. Maybe you color the circle in to indicate it was selected. Essentially, your photoshop doc layer should look something like this...
button 4 active
button 4 selected
button 3 active
button 3 selected
button 2 active
button 2 selected
button 1 active
button 1 selected
menu background
Once you have the .psd created, import it into DVDSP, preserving the layers (do not flatten on import). Then select 'create new layered menu' (not create menu). Drop the document into the menu and all your layers will show up. Go to the menu inspector and turn off all layers except the background layer.
Next, create your 4 standard buttons like you showed in your picture - you can use the square buttons. Click on your first button, go to the inspector and you can select which layers will be visible there. So check the 'button 1 selected' box in the second column and the 'button 1 active' box in the third column. By checking these boxes you are turning that layer on when the user either selects or activates the button. Do this for all 4 buttons.
By creating the menu this way, you can still use the square buttons that DVDSP provide. When the user selects the button, it will only show what is on the layer that you selected in the inspector, which is the glow circle or colored circle you created in photoshop. Everything else is on different layers so if there is overlap with the next button you won't see that button's highlight because it is on another layer.
I'm not sure if this is the best way to do it but this is how I would do it. I haven't had any trouble doing it this way in the past.