"Fusion" (ALPHA) skin, a little something i've been working on...

[agathorn]

Hello all,

I've been lurking around here for a while, and recently posting a few questions here and there. I recently started working on my own skin, and I wanted to share some of that design work with you all.

Before I post some images though, let me talk about a few things. I am building this skin for two main reasons. 1) To learn the XBMC skinning engine, and 2) For use here within our household.

It is important to understand that this is being built first and foremost for use here, in my house, and therefore will have certain design decisions based on that. The main one being that this skin is currently only designed for 4:3 standard TV because that is all we have in the house. That said however, once it starts to mature I will be releasing it for anyone else who wants to play with it.

I also should say up front that this skin's design has been heavily influenced by both Xephyr and Fluid.

The goal of this design was to put the media first, and have the UI take as far back a seat as possible while still being functional.

What you see here is all concept work done in Photoshop, although some of this is functional on my test Xbox.

So without further ado...

HOME SCREEN


I absolutely love the Xephyr backpacks, and the Home Screen was designed to make use of that media.


TV SHOWS - TITLE LISTING

This is the view you will see when browsing through TV show TITLES using the Video Library. Everything about this skin is currently designed for library use since that is what we use here.

You will immediately note the lack of pretty much anything except the media content. You don't see it in this shot, but you will in a later one, but there is essentially a hidden menu. Again, the media is the focus of this skin and the UI should be as minimal as possible. It shows itself when needed, then promptly goes away when not. In this view, and all of the library views, pressing the LEFT ARROW will bring up the UI controls for the library. again it isn't visible here but you will see it in a moment.

I'm still not happy with the frame around the selected show, despite having reworked it about 5 times now. Any suggestions on that would be welcome.

TV SHOWS - EPISODE LISTING

Once you have drilled down to the episode list for a TV Show, this is what you will see. Pretty self explanatory. The WATCHED banner of course is only visible on episodes that have been watched. If unwatched, it goes away.

TV SHOWS - EPISODE LISTING 2

Here you can see the hidden menu accessible by pressing LEFT, as well as how it looks for an UNWATCHED episode.

The HOME screen and 90% of the TV SHOW TITLE listing has been completed in the Xbox, and i've taken a break from coding it to work on the rest of the concept work.

[matt_cyr]

Looking nice...keep up the work!

[aart]

very nice, i'll be watching this thread..

[SleepyP]

Deceptive. When you first look at this skin it seems simple, but its actually got a lot of sophisticated stuff going on in the code. I like how the skin's own graphical resources seem to be kept to a minimum. This should make it very light on memory consumption, as well as make the overall package quite a small download

Also, I think that there's quite a huge market for 4:3 TV-friendly skins. One of the main things I have noticed now that I have gone HD is that using PM3 in standard def feels, well, "crappy" for lack of a better word. I think its mainly due to how screen real-estate is used and the fonts and whatnot. I think this is probably because PM3 isn't very specialized, nor is that a design principle in that skin. Don't get me wrong, I love it, but I think this skin will definitely have a sizable userbase.

[craze7]

looks great man, im still using a 4:3 tv too so i'll defo be checking this out!

[Gamester17]

Always nice with new skinners and new skins!

Looks like a good skin for adding themes to as well.

[agathorn]

Thanks for the comments everyone. Its always nice to know that when I feel it is looking good, it isn't just self delusion

Work on this will be rather sporadic, because I tend to work 4 days really long hours, then have 3 days off so most of my work on this will come on those 3 days.

I do have some newer concepts i'm working on right now though which I will hopefully post in the next day or two. I'm looking at something just slightly different that I think might work better and keep the various views tied together a little better.

One thing that is important to me is consistency in the UI. If you navigate the view up and down on one view, then you should do the same on all of them. If you get the menu to popup by pressing left in one area, it should be left everywhere. Things like that are important to me.

[jaredharley]

I love the way you've done the tv shows section - i just might have to steal - I mean, borrow - that for my own skin I use here. I'll be looking forward to testing yours out!

[agathorn]

I was working on the SEASON list view this morning, and I have a couple concepts for you all to view. I'm still not all that happy with them yet though.

The biggest problem is trying to maintain vertical list movement to stay consistent, but the season thumbs aren't really the right shape for that This makes it challenging.

Any comments anyone has on this would be most welcome. Personally i'm leaning towards the second concept right now, though I don't like the dead space. It could still go either way with me though if I can just figure out how to make it work a little better.

Anyway, Here is concept #1


And concept #2

[Rand Al Thor]

Very nice looking skin. I love how the images take full advantage of the available screen size. On an hdtv posters,thumbs,album covers etc look so nice they should be shown off!! I prefer the second image for season selection. Not only is the image larger i think it will look smoother flipping through seasons if you don't see the previous/next images. This is just a personal preference to but I have always liked seeing the list on the left and images on the right Anyway, great work. Cheers.