OSX/iTunes Based Theme

General HouseBot discussion. Any issues that don't fit into any of the other topics belong here.
Post Reply
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

OSX/iTunes Based Theme

Post by Osler »

I have been working on a theme based upon the new OSX/iTunes and figured I'd share what I have so far. The majority of the work has been completed for the PDA based SWRemote, with plans for a 1024 x 768 version for some SmartDisplays I have.

This is a sample of the PDA channel logo buttons (nearly complete set of logo buttons):

Image

Sample PDA transport control:

Image

Sample PDA background with hardbuttons used for volume, channel, and cursor navigation:
Image

Sample PDA control button (based on Motorola DCT series):
Image

Sample PDA weather image (string of images as indicator image also included):
Image

Sample of higher resolution button using transparency:
Image

The file is large, so be warned. You can dowload all of the theme components I have thus far at:

http://home.comcast.net/~jpbrowning2/OSX_PDA.zip

Plain buttons (small and large) are also included for PDA use. For text on these buttons I would recommend using RGB 140, 140, 140. In addition, a plain background and small background (for pop-ups) is also included. There are faux LCD screens for use at the top or bottom of background as well. You just need to be sure you place them correctly so they blend with the chosen background.

Osler
Richard Naninck
HouseBot Guru Extraordinaire
Posts: 1121
Joined: Tue Sep 28, 2004 7:49 am
Location: The Netherlands

Post by Richard Naninck »

I downloaded your .zip and it sure is very nice stuff!!!!!!!
If only there was more of this around. Too bad I can't use most of the channel buttons since I have different channels where I live. My own XGA theme also uses a different background color, but I could always rebuild my PDA theme and I guess at some point I will with these new images. I can't wait until you finish your XGA library.
Do you also have a .skn xml file to go with this so using it in HB would become a little bit more easy?

Thanks and if you ever create more icons to go with this, please let us know.
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

If you have Adobe Photoshop I'd be happy to provide you with the base .psd files for the buttons. All you would have to do is alter the color overlay to suite your needs and add two layers (one on left, one on right) measuring 74 x 42 pixels with the logo of choice on a white background.

I am not done as yet, so I can't export a skin file. Once I have it completed it is on my list of ToDo's.....unless Scott removes that option in the next upgrade.

Osler
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

Are these what you are looking for:

Image

and

Image


I have updated the file to include a SkyTV button folder. It is not complete yet, but I will get to it eventually. I will post back when all logos have been added.

Osler
yaccri
HouseBot Special Member
Posts: 304
Joined: Wed May 07, 2003 2:19 pm
Location: Tel-Aviv, Israel
Contact:

Post by yaccri »

Very nice!
Richard Naninck
HouseBot Guru Extraordinaire
Posts: 1121
Joined: Tue Sep 28, 2004 7:49 am
Location: The Netherlands

Post by Richard Naninck »

I wouldn't need the .skn file to reskin my theme using your images, but just to get this nice pop up window where all the buttons are displayed so I can select more easy in stead of going through directories. It doesn't really matter, it is just nice to have. I added zome buttons of my own to the Red Theme and put these in the xml .skn file so it becomes easier to find and select such a button.
I will try to PM a zip file containing my Meedio channel icons so you can have a look. Don't even bother creating buttons out of them.
I don't have Adobe Photoshop, but could this be done with PSP or Fireworks in stead?[/img]
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

Nederland channel logo folder added to the .zip file. This is half complete based upon what Richard sent me. More to come later. I will also add the rest of the SkyTV logos as well for those that use this provider. I have to say, some of these channel names are quite interesting.

http://home.comcast.net/~jpbrowning2/OSX_PDA.zip

Osler
Richard Naninck
HouseBot Guru Extraordinaire
Posts: 1121
Joined: Tue Sep 28, 2004 7:49 am
Location: The Netherlands

Post by Richard Naninck »

Thanks, I put them in my theme already. I missed only a few, but those were from channels I never watch, so I deleted them from my theme.
I do see however some black lines to the left and right sides of the lighter background buttons and the reverse on the darker buttons. is that intentional?
Anyways thanks for the quick response. Theme is looking better by the day now!
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

Not on purpose, but an artifact of having to convert the GIF files to PNG files so I could work with them. It didn't appear terribly noticeable at the time, but if its really noticeable on the PDA, tell me and I will crop those particular images and remake the buttons. I will get to the other folder you sent later, perhaps this evening. I will try to get the SkyTV buttons done by this weekend as well.......in case there is anyone wanting them?

Yaccri:

I have posted my .psd files to the web. I think I have included everything. To make round buttons, you will need to use the .psd file and save a .png image. Then make the inside shadow and color overlay visible on the first layer. This will turn it blue and make it look depressed. Save this as a .png. You will then need to bring both images you just saved back in, set them side-by-side, and save the file again to get your final button. A bit labor intensive I know.

To make a square button, just take your image and make it 74 x 42 pixels (or 74 x 21 pixels for a small button) with a white background (save as a PNG file). Now open the PNG file and the square button psd file. Drag one copy of your image over the "up" side of the button and another copy to the "down" side. The up image should be the second to last layer and down image should be the third to last. Now save for web as .png.

http://home.comcast.net/~jpbrowning2/OSX_PSD.zip

Osler
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

All Nederland buttons complete. Download for latest. I think I fixed the black bar issue as well this go round.

Osler
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

All SkyTV logos now added as well.

Osler
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

I have done a bit more work. Here is the "main" background:

Image

Here is the layout for the main portion of my cable/TV remote:

Image

Here is the layout for guide/menu navigation:

Image

I have added new round buttons to be used on a black backround and othe misc. buttons.

The PSD folder has also been updated. This is a work-in-progress so I will update as I go.

Osler
Richard Naninck
HouseBot Guru Extraordinaire
Posts: 1121
Joined: Tue Sep 28, 2004 7:49 am
Location: The Netherlands

Post by Richard Naninck »

Thanks Osler, I am changing my simple buttons for your much better looking ones a few at a time. Things start looking good!
Osler
HouseBot Guru
Posts: 742
Joined: Fri Feb 03, 2006 11:18 pm

Post by Osler »

Excellent. I will try to get some screenshots of my theme and post those in addition to the above shots from Adobe PS during the planning stages.

Osler
Post Reply