Criticize my UI design

[dee-u]

Designing the UI is not my strongest skill so I am not sure if my UI looks professional or childish so I wish to get your criticisms on attached screenshot.

[NeedSomeAnswers]

While i am not a UI designer, i quite like your design. Although a couple of thing you could look at...

you have dark blue buttons on a dark blue background at the bottom left of your screen which mean they don't stand out as much as the blue button on the lighter background on the right hand side. I would change them

Secondly the bar across the top titled WORK TEXT (and i mean the blue bar under the form title bar) is a bit uninspiring and could be improved with maybe a different design instead of just a block of colour or even an image.

[szlamany]

It's always good to consider mouse-movement that you make required by having buttons in various places.

The user should be able to make the shortest mouse movements to achieve the desired results and still stay within focus of where ever you are making them enter text.

I have no problem with buttons on the bottom of the screen - just makes me wonder how often they need to click those tabs up top. And how far the mouse has to move to get between some of those regions...

[dee-u]

Thanks guys, been experimenting with it and thus here are my changes to the color scheme, making it closer to an 'outlook' design. Still working out what scheme to use for the buttons.

@sz: I am considering changing it to a toolbar so all the buttons will be on top, will that be better when considering mouse movements?

[Niya]

That looks much better. The only thing is that font where you have "WORKTEXT". If that app is for "SRS BIZZNIZZ" like an accounting program or something, I'd consider a more professional font. When I look at that font, I think of pool parties and getting wasted, you know, a fun, casual, laid back feeling. Its a good font for a chat application, a casual game or something blog related.

[dee-u]

Well, that is just random Photoshop font I tried, I am actually contemplating on removing that panel altogether since it is just a space occupier but without much value. Will also try to tweak my listboxes just separate them with a dashed line, will post another screenie later on.

[Bonnie West]

You may find the UX Guide useful.

[dee-u]

You may find the UX Guide useful.

Thanks, it is a good read!

[dee-u]

Here's an update, I hope you guys can criticize it.

[Niya]

That looks boss....I can't see anything that I can criticize.....well maybe you can try lining up the rightmost three buttons with the ones in the left pane. It's a minor issue though.

[szlamany]

I'm not sure if this is what Niya was referring to...

I would put the SAVE and CLOSE / DISCARD buttons on the left - as to mimic Add / Edit / Delete...

And put OPEN WORD on the far right - as MARK ACTIVE TOPIC appears to be visually aligned below the TOPICS list.

Otherwise - really nice looking.

I'm about to code my first WPF screen - probably starting tomorrow. I am a couple of chapters into "PRO WPF 4.5 in C#" from "apress publishers". Just installed VS 2012 the other day...

[Niya]

I'm not sure if this is what Niya was referring to...

Oh I was talking about lining up "Add Example", "Edit Example", "Delete Example" with the topic buttons at the bottom of the topics pane.

[szlamany]

Oh - ok...

I thought those were in the TAB itself and needed to be within it's borders...

I guess the question would be - why is the TAB panel up a half an inch??

[dee-u]

Thanks guys, will look into your suggestions!

[dee-u]

Got bored and overhauld the design further so it now uses a toolbar and a menu bar instead of buttons. For the edit, the user just have to double-click the item just like in outlook. I've added a delete button (x) in the items and it is only enabled when an item is selected.

[Niya]

That's definitely an improvement. It looks much less cluttered, not to say that it was too cluttered before but its better non-the-less.