Pixel Joint Forum: Status screen: C&C needed

Message

   I finally got around to working on redoing the next screen for my game. It's the status screen, where you can upgrade your character (blueprint on the wall style), and with some menu items to choose from. Visually, it should remain in the style of the main menu (http://www.pixeljoint.com/forum/forum_posts.asp?TID=16294)

This is what I got so far:

It's not much, I know, but there are already two things that bother me, yet I don't know why:

1. The shape of the drop bothers me, but can't point out why

2. The menu part feels too cluttered. It can't breath enough. I got some ideas (like making the buttons smaller, or throwing the button style away and making it chalk on a blackboard), but I dunno if it's a good idea. I'm afraid it'll break too much from the style of the main menu.

Author	Message
Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Topic: Status screen: C&C needed Posted: 13 June 2013 at 1:54pm
	I finally got around to working on redoing the next screen for my game. It's the status screen, where you can upgrade your character (blueprint on the wall style), and with some menu items to choose from. Visually, it should remain in the style of the main menu (http://www.pixeljoint.com/forum/forum_posts.asp?TID=16294) This is what I got so far: It's not much, I know, but there are already two things that bother me, yet I don't know why: 1. The shape of the drop bothers me, but can't point out why 2. The menu part feels too cluttered. It can't breath enough. I got some ideas (like making the buttons smaller, or throwing the button style away and making it chalk on a blackboard), but I dunno if it's a good idea. I'm afraid it'll break too much from the style of the main menu.
	IP Logged

Kurieta Commander Joined: 25 May 2013 Online Status: Offline Posts: 141	Posted: 13 June 2013 at 4:07pm
	Well, personally, I would make the bottom of the drop fatter. And for the buttons, I like the chalkboard idea because it should reduce the clutter caused by the buttons. Instead of them looking like buttons you could have them highlight when the mouse is over it. It looks nice, keep it up :)
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 16 June 2013 at 11:20am
	Couldn't get the bottom of the drop fatter, but fixed the little kink in the left side and redid the right side a bit. Also turned the buttons into a blackboard. I think it needs more colours, something to break the drag greyness.
	IP Logged

r1k Commander Joined: 01 April 2014 Online Status: Offline Posts: 336	Posted: 18 June 2013 at 3:15am
	try making the chalkboard green, and giving it a ledge at the bottom to place an eraser and chalk on. All that might help with the color. Basically like this: http://school.phillipmartin.info/school_chalkboard.gif
	IP Logged

ultimaodin Commander Joined: 04 May 2010 Location: Australia Online Status: Offline Posts: 162	Posted: 18 June 2013 at 8:24am
	Personally I prefer a black chalk board, but definitely like the idea of a ledge and eraser idea. Also, personally I think you should scrap the raindrop in the left window and use the left window for showing stuff like positions, the racetrack etc...
	The world is but a shadow of emotion, cast in shades of grey.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 18 June 2013 at 9:42am
	Thanks for the input. * I made the blackboard a bit lighter, but it's still in a blackboard-ish colour. That green from the example pic would've been way off. * There's now a ledge with some tools on it * Added thumbtacks and a grid on the blueprint * Changed the blueprint's colours to be brighter * Added lines where text will go. These seem a bit tricky to add all the text necessary. The idea here is to add upgrade options (starting speed, acceleration, max speed, starting weight, weight gain, max weight), and an XP bar below. I don't think there is enough room for the upgrade text / buttons I think it does look better now. Some of the drabness is gone now. On the other hand, got 16 colours now, which seem a bit much for something like this.
	IP Logged

Kurieta Commander Joined: 25 May 2013 Online Status: Offline Posts: 141	Posted: 18 June 2013 at 11:50am
	Sorry, but this popped in my head as soon as I saw it: Edited by Kurieta - 18 June 2013 at 11:59am
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 18 June 2013 at 11:53am
	Got no idea what you just drew, but yeah... those lines might be done a bit differently too, I guess. Oh god, your edit, adding the little mustache and all Edited by Raf - 19 June 2013 at 1:26am
	IP Logged

Godjam Seaman Joined: 17 June 2013 Online Status: Offline Posts: 12	Posted: 19 June 2013 at 1:22am
	Hello, I tried something, For me the main problems were: 1) The wood background, which is (in my view) too flat, not enough "readable". 2) The font on right, not enough contrasted. 3) The general color variability, more precisely the blue on the board. So here is my little contribution, with a more textured background, an outline on the font and more contrasted image (in 10 colors) See you, Godjam.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 5:04am
	Hey God (hehehe), that looks great! Except it's wallpaper, not wood. It would also mean a style break with the little girl in the main menu screen. For the problem with the lines, I decided to do the following: 1. Take out the entire drawing on the blueprint 2. Put all text on there that has to be on it 3. Add the drop with the lines in the space I got open I don't have any room left to draw the drop
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 8:34am
	Making the blueprint page wider doesn't solve the problem. It actually makes things cluttered, too.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 8:41am
	Immafriggengenious! I'm afraid I'll still lose the space I gained by putting in more spacing between the blueprint and the blackboard, and at the sides. Or does it actually look OK like this, with the 2px spacing?
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 9:05am
	Now it can "breath" a bit more. Still not sure of the marging to the left. The right side (between the blackboard and the edge of the pic) seems about right. That's 3px. The left still seems a bit too close to the edge to me, but that's 3px as well.
	IP Logged

Numberplay Commander Joined: 28 October 2010 Online Status: Offline Posts: 130	Posted: 21 June 2013 at 9:09am
	You know you can edit your post instead of quadruple post.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 9:12am
	I now I can, but by quadruple posting, it allows people to see the intermediate steps, too. If I go a step too far, it's easier to spot and fix that way. Along with that, it can be used by other beginners who might find this in the future to see what the difference is between minor edits like that. So this quadruple posting is actually for the Greater Good
	IP Logged

shampoop Commander Joined: 12 January 2015 Online Status: Offline Posts: 202	Posted: 21 June 2013 at 10:13am
	I wonder if a drop shadow would make the text pop out a bit more. Not enough contrast between the blue background and the light blue text.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 11:05am
	Me like!
	IP Logged

shampoop Commander Joined: 12 January 2015 Online Status: Offline Posts: 202	Posted: 21 June 2013 at 11:07am
	Yes, the text is much more readable
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 12:34pm
	* Added the drop in the middle * Added the lines between the text and the drop * Centered the level-up bar * Cleaned it up here and there * Made one of the top corners hang (not 100% sure about that one) Total amount of colours: 17
	IP Logged

Numberplay Commander Joined: 28 October 2010 Online Status: Offline Posts: 130	Posted: 21 June 2013 at 12:55pm
	You should add more personality into your work. I mean it looks very simple and boring. I have some suggestions that could maybe make this look interesting. -Make the edges of the blueprint rough (not too much) -enlarge the outline of the chalkboard. -give a wooden texture to the same outline with 2-3 colors that contrasts. -give a 3D perpective on the tools on the chalkboard. -bigger shadow under the chalkboard Maybe some of these suggestions will actually enhance your work. Edited by Numberplay - 21 June 2013 at 12:56pm
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 1:42pm
	* Dunno what you mean with making the edges of the blueprint rough. You mean making cuts into it, so it looks like a weathered treasure map? * Outline has been enlarged, and has been given a texture * The tools are now in glorious 3D * The shadow under the chalkboard has been made bigger
	IP Logged

Numberplay Commander Joined: 28 October 2010 Online Status: Offline Posts: 130	Posted: 21 June 2013 at 3:03pm
	I liked that you followed my suggestions but I couldn't resist editing it even more. Added 2 colors : 1) for the different highlight on the horizontal parts. I also replaced one of the level's color with this one. 2) for one of the shadow that was previously the same as the wallpaper. Both shadow colors contrasts more now. I did a few other changes like the top edge of the blueprint (yes i meant cuts) I leave you do the rest if you like it. I also changed the ledge's texture to blend with the outline you did. I finally changed some colors on the outline to enhance the texture. Edited by Numberplay - 21 June 2013 at 3:03pm
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 21 June 2013 at 4:37pm
	I hope I didn't overdo the cuts Also, for some reason, the amount of colours exploded to 27. Got no idea how that happened.
	IP Logged

Fobwashed Midshipman Joined: 31 January 2012 Online Status: Offline Posts: 59	Posted: 22 June 2013 at 12:12am
	The hanging corner seems wrong. It looks like there is more paper hanging than there should be. I'd also suggest a chalk circle to appear around whichever menu item is selected on the right side. Better if you could add a chalk drawing sound and animate the outline appearing. It's a personal preference, but I'd also move the + and - to the left and right of the number being changed as opposed to the name of what's being changed. As it is, they look a bit cramped and possibly even harder to understand.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 22 June 2013 at 7:34am
	The chalk circle's a good idea. I was wondering how I'd mark whatever someone selects. The sound'll be tricky to put at the same level as the ones currently in there, as the sound guy's finished his work already. I'll see what I can do, though. The + and -... jeez, that I didn't see that! Gonna fix it after this one last errand for today.
	IP Logged

Raf Commander Joined: 18 January 2013 Online Status: Offline Posts: 109	Posted: 23 June 2013 at 7:11am
	Got distracted yesterday, but finished it now. That's it, I think. On to the next part: Dialog windows!
	IP Logged

WIP (Work In Progress)
Pixel Joint Forum : Pixel Art : WIP (Work In Progress)