Working on design for Music Trivia for Zune.net (updated daily!)

[volvozuner]

A few days ago I got an email from Jessica Zahn (Zune.net Social manager)
She saw one of my designs that I had posted on the official Zune forums.
She asked me if I would like to help put together the skin for the upcoming Zune Music Trivia on the social.
It took me about 1\2 second to say yes    
anyways I finished a  rough draft today for the main landing page, Quiz choosing page and a sample quiz page.

Enjoy and keep the comments coming!

Please note that these layouts are just rough drafts until final skin designs are chosen.

Here is a digg link,
http://digg.com/microsoft/Microsoft_Working_With_Zune_Community_To_Create_New_Feature

Here is her post on the social,
http://forums.zune.net/253816/ShowPost.aspx

and here is my rough draft. (update 1.9 )

Here is an alternate version (beta) with a different banner that is more Zuneish


Here is what my idea of the actual quiz would look like (1.7)

Quiz chooser (1.4)

any tips or ideas would be much appreciated!


Thank you to everyone who is to contributing to this!!

[Dinaki]

I am not good at all on design, but whatever you will do volvozuner, it's the matter of trying because you always try to achieve the impossible.

Good luck my dearest with your designs and if you don't mind, keep us update with your project, at least I am interested to know.

[siedpe]

the font and pics in the boxes should have same aspect as boxes

[volvozuner]

I know, it's almost impossible to get them all the same
but I am trying! ver. 2.0 should be out sometime soon

[DjRicoRich]

good luck volvo

[nickd916]

I think the top desgn curvy things and the text are a but..."harsh".  Try to make them more mellowish.  I dont really know how to explain it...I guess make the opacity greater or something.  Also, If you get rid of the capitol letters, it will help give an authentic Zune feel.

[DaveWorld]

^ I agree with nickd916 about the "curvy thing", that was my first thought. But I think he meant Bring Down the Opacity not make it greater - it takes the focus away from the main area

[cs188]

I think everything is simply too big.  But apart from that and the extreme saturation of the colors, I think it looks great.

[Zuney Tunes]

Congrats with being chosen to do this. I would make these changes to make it look more consistant with zune.net's layout and color scheme.

1) Change all fonts to Segoe

2) "THINK YOU KNOW YOUR MUSIC?" and "PICK A GENRE & GO" all in uppercase and remove the 3D effect.

3) Move the color splash, 3D Zune logo and ZTrivia to the left until logo and ZTrivia is centered since the boxes at the bottom are in mirrored perspective your eyes want to focus center above it. Then reduce the word ZTrivia since now that it's centered it doesn't need to be huge. Too much text going on in the right side as it is.

4) Balance out the two boxes. Add album wallpaper like the one on the left, reduce transparency to the wallpaper then add a black or dark gray box over the wallpaper and give it a 50% opacity then reverse the color of the text to white. Text should follow the same perspective as the box. May also look good to make everything below ZTrivia black and white and have the album wallpaper as the main color insterest showing thru.

5) Zune.net website has a consistant margin to the right of the zune logo at the top and flush with the right side of the search box at the top right. You may need to adjust your proportion to compensate.

6) Don't forget the missing "?"  

[volvozuner]

thanks for all the great tips guys!
They are VERY helpful!
keep'em coming

[Z80]

"Think you know your music"  hmm?
well I did until the Zune-Software scrambled my music...

[volvozuner]

added update 1.5

[volvozuner]

added quiz page

[Dinaki]

You work very hard for your project sweety and that matters volvozuner.

You are reaching the ladder of success honey and you make yourself feeling good and proud!

[vanman]

what are you using? im assuming photoshop or paintshop pro... the font just doesnt look high res AT ALL, are you distorting it?  with warp or something?

Good luck!

[Zuney Tunes]

personally I prefer the symetric boxes on the first layout

replace "think" with "do" and "pick" with "choose" spell out "&" if you have a probem copy fitting the text phrases

[volvozuner]

what are you using? im assuming photoshop or paintshop pro... the font just doesnt look high res AT ALL, are you distorting it?  with warp or something?

Good luck!

I am using photoshop CS3, that is one thing I have yet to master, making fonts look high res,
but then I am using photobucket. and that scales the image down a ton.
I am using the perspective command on the font

[Zuney Tunes]

2 zune logos on the page seems kind of repetitive maybe make a simple collage of album art with pics of zune device(s) and the word ztrivia

and for consistancy repeat the same top banner for the quiz section

is it actually gonna be called ztrivia? seems kind of tacky...lol