20 Feb 2007

Coming back to Tonic's ui.

Some time ago I posted this screenshot.
I saw this dialog (it is modal) often and it really doesn't scare me ;). So let's count: 4 buttons, 3 combo boxes, 2 text fields, 1 password field, 1 check box. 5 areas.

1. Do I have any pros for it? Well, some components are align, somewhat. But suriously. I like that 'Server:' and 'Account:' are aligned. And so are 'Login as guest', 'Register' buttons aligned with text field for handle and password. So are the panels 'Guests' and 'Advanced options' .
2. 'Connect' is the default button - the one user wants to click as quick as possible.

1. Labels after the components. With left-to-right reading it is hard to read what is control for.
2. Horizontally misaligned components through panels. Look at the buttons in 'Guest' panel and controls in 'Advanced options' for example.
3. The vertical space between components is different through the dialog. Ideally it should be consistent through the whole application.
4. Karsten Lentzsch noted that using titled borders is risky - they take the space, take the attention and produce noise. I know they are wildly use, but it doesn't mean they are the way to go in this dialog.
5. Once again I am presented with information that I cannot access - the menus in the back.
6. The fonts are out-of-any OS default. This is Java cross platform Metal look and feel issue though. I hope next iteration of default Java look and feel would look great. It seems strange to me that I liked (and I still do) old and new Metal lafs. I admit it is totally irrational.
7. 'Connect' and 'Cancel' buttons are on the opposite sides of the dialog. Just note that you could easily treat 'Connect' as 'OK' and now you know why this is contra.

Do user really needs this awful lots of options to choose? I think one could easily hide the 'Advanced options'. And omit the register button as well. To not to just whine I'll do my best to create an alternative for this dialog in which I visualize my propositions :). I would have to do it anyway since after this post I cannot put off a redesign of this dialog too long :).

Anyway, if you have thoughts on this dialog or my post comment please. I will update this small analysis if I come to some new observations.

I love Blogger spellchecking.


  1. I agree with most of your points. The funny thing is that I've been having very similar thoughts, and most of these things are already on my TODO list.

    Alexander (aka Sasha) Maryanovsky.

  2. New login dialog: normal and with advanced options.

    Done with GroupLayout (the layout manager behind Matisse).

    Alexander (aka Sasha) Maryanovsky.

  3. Nice. Clean and Simple. Very nicely designed. I have to propose something too ;)!

  4. Even simpler: normal and with advanced options.

    Merged the "account" popup box and "username" textbox into a ComboBox and got rid of the separator.