Granny's Programming Pearls
"inside of every large program is a small program struggling to get out"
JavaRanch.com/granny.jsp
The moose likes Developer Certification (SCJD/OCMJD) and the fly likes Rate My GUI Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login


JavaRanch » Java Forums » Certification » Developer Certification (SCJD/OCMJD)
Bookmark "Rate My GUI" Watch "Rate My GUI" New topic
Author

Rate My GUI

Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Can I get some feedback on my GUI? I would greatly appreciate comments, suggestions, etc. Thanks!

Here are the links:

Preview Shot 1
Preview Shot 2


SCJP 1.4<br />SCJD 1.4
peter wooster
Ranch Hand

Joined: Jun 13, 2004
Posts: 1033
Originally posted by Daniel Simpson:
Can I get some feedback on my GUI? I would greatly appreciate comments, suggestions, etc. Thanks!


I've got a couple of comments:

1) putting the search and booking panels on the left side is not a good choice. It uses up a vast amount of screen real estate for very little function. I'd put them on the top or bottom.

2) you should include the standard menus File, Edit, and Help.
[ January 08, 2005: Message edited by: peter wooster ]
Beny Na
Ranch Hand

Joined: May 26, 2004
Posts: 159
hi Daniel,

do you used the combobox for subcontractor name?
does the subcontractor name is fixed?


thks
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by peter wooster:


I've got a couple of comments:

1) putting the search and booking panels on the left side is not a good choice. It uses up a vast amount of screen real estate for very little function. I'd put them on the top or bottom.

2) you should include the standard menus File, Edit, and Help.

[ January 08, 2005: Message edited by: peter wooster ]

I'll have to comment out some code and see what it looks like on top. Also, what would I even put in the edit or help menus?
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Beny Na:
hi Daniel,

do you used the combobox for subcontractor name?
does the subcontractor name is fixed?


thks

Yes, one combobox for contractor name and another for contractor location. contractor name fixed? I'm not sure what you are asking, I might need you to explain better. Do you possibly mean hardcoded in the GUI? No, they are loaded dynamically at runtime from my cached records.
Beny Na
Ranch Hand

Joined: May 26, 2004
Posts: 159
i get it now, thks..
Paula Decker
Ranch Hand

Joined: Dec 17, 2004
Posts: 36
I think the GUI is perfect! I was bringing up a dialog for the contractor id. I think your way is more clear. I may change mine. Good work!

-Paula
Peter Rooke
Ranch Hand

Joined: Oct 21, 2004
Posts: 803

Been a long time since I did any of this stuff (and I did not do it that well, being a [unix] programmer type :roll: . Anyway have a look here: Usability Evaluation with the Cognitive Walkthrough.

There are others, so do a web search for "User Interface Evaluation Techniques".

I'll make one quick comment: maybe it would be more intuitive to seqment the window. Have the top for the search task, display the results in the middle, then have the booking section next. This follows the order in which
the tasks are to be completed. Lastly place a status bar on the bottom (like your browser).
[ January 09, 2005: Message edited by: Peter Rooke ]

Regards Pete
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Peter Rooke:
Been a long time since I did any of this stuff (and I did not do it that well, being a [unix] programmer type :roll: . Anyway have a look here: Usability Evaluation with the Cognitive Walkthrough.

There are others, so do a web search for "User Interface Evaluation Techniques".

I'll make one quick comment: maybe it would be more intuitive to seqment the window. Have the top for the search task, display the results in the middle, then have the booking section next. This follows the order in which
the tasks are to be completed. Lastly place a status bar on the bottom (like your browser).

[ January 09, 2005: Message edited by: Peter Rooke ]

Yeah, I'm going to try that idea out. However, GUI layouts are read left to right, top-bottom. So it could be acceptable with the current layout since right at the left is search (first step), table is next (select contractor) and the bottom is book (last step).
Paul Bourdeaux
Ranch Hand

Joined: May 24, 2004
Posts: 783
Also, what would I even put in the edit or help menus?
I would put a Search and Book menu item in the edit menu that replicate the functions of the buttons. In the Help menu, at a minimum put an About item that identifies the Author and Version number. If you used HTML for your user manual, this is also a good item to put in the Help menu.

It may seem tedious to replicate functions in the menubar, but industry standard is to have every function available from the menu bar, as well as use a mnemonic. Remember, not every computer uses a mouse... And it is pretty easy to do in Swing, so there really isn't an excuse not to.

As far as your layout, I see no problem with leaving the search functions on the side. As you pointed out, it does follow a conventional left-right, top-bottom flow pattern. It is OK that it wastes a little bit of space, because it makes the search functions easily identifiable, and keeps the GUI from appearing cluttered. In fact, you might want to pad a little more space between the table and the Booking area, to set it off as well.

Overall, I think it is a pretty good GUI.


“Programming today is a race between software engineers striving to build bigger and better idiot-proof programs, and the Universe trying to produce bigger and better idiots. So far, the Universe is winning.” - Rich Cook
Vincent Hernandez
Ranch Hand

Joined: Oct 17, 2004
Posts: 43

It may seem tedious to replicate functions in the menubar, but industry standard is to have every function available from the menu bar, as well as use a mnemonic. Remember, not every computer uses a mouse... And it is pretty easy to do in Swing, so there really isn't an excuse not to.


I'm sort of confused on this point. Daniel already has the Search box on the left. If he includes such toolbar-based functionality, wouldn't that mean he'd have to create a window form with the same exact buttons and fields as he has in his search section?
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Vincent Hernandez:


I'm sort of confused on this point. Daniel already has the Search box on the left. If he includes such toolbar-based functionality, wouldn't that mean he'd have to create a window form with the same exact buttons and fields as he has in his search section?


Yeah, what would I do? Would I just have a menu item, that when you clicked it, it would open up a new JDialog with the search stuff in it? Or would I make some sort of complex menu with submenus. If I were to do the latter, is that even possible? The question would be, which item has the actionlistener? How would a user select a contractor and a location? So I'm not sure if the second idea is even possible. I will go ahead and do the first if the second idea won't work.
Vincent Hernandez
Ranch Hand

Joined: Oct 17, 2004
Posts: 43
Daniel, once you get something up and running, can you come back and post what worked?
Vincent Hernandez
Ranch Hand

Joined: Oct 17, 2004
Posts: 43
I hate to reply again, but I found this quote which may prove helpful for you Daniel. It is from the Habibi et all book:


A basic Swing implementation is all that Sun requires for the SCJD exam, but you can choose to go above and beyond what is required and add more features than required. A , for example, could be provided for additional ease of use, even though it is not specifically required to pass the exam. If you are new to Swing or user interface implementation, developing the application GUI is (a) difficult task already. Making it more difficult by providing additional functionality is not recommended.

- Habibi et all. The Sun Certified Java Developer Exam with J2SE 1.4, Chapter 6.

Looking at the example project, there is only a File menu, as Daniel shows. I'm kinda thinking you don't want to add menus, as that will add complexity.

Again, I'm only taking the exam right now as you are, so I'd be interested to hear what others say.
Jeff Bosch
Ranch Hand

Joined: Jul 30, 2003
Posts: 805
I think you'd want to have the Help menu too, as a means for launching the help system and the About dialog...


Give a man a fish, he'll eat for one day. Teach a man to fish, he'll drink all your beer.
Cheers, Jeff (SCJP 1.4, SCJD in progress, if you can call that progress...)
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Vincent Hernandez:
I hate to reply again, but I found this quote which may prove helpful for you Daniel. It is from the Habibi et all book:

, for example, could be provided for additional ease of use, even though it is not specifically required to pass the exam. If you are new to Swing or user interface implementation, developing the application GUI is (a) difficult task already. Making it more difficult by providing additional functionality is not recommended.
<hr></blockquote>
- Habibi et all. The Sun Certified Java Developer Exam with J2SE 1.4, Chapter 6.

Looking at the example project, there is only a File menu, as Daniel shows. I'm kinda thinking you don't want to add menus, as that will add complexity.

Again, I'm only taking the exam right now as you are, so I'd be interested to hear what others say.


Yeah, I lean towards what Vincent was saying, because as the software app in Max's book, he only uses file-->exit. I've read previous posts about gui and people saying that the exam assessors like the simple file exit instead of going into complex menus, although I am looking into adding an edit and help, however, i don't really feel that "edit" even though it is a standard menu item, should be used. Maybe "actions"? What do you guys think?
Vincent Hernandez
Ranch Hand

Joined: Oct 17, 2004
Posts: 43
I recall the Sierra & Bates book have some mention about this...something to the order of "what if the user doesn't have a mouse?" or something like that. I think that's one reason why people may be suggesting to add an action/search menu. I'm not so sure about this because you (Daniel) have the search box fixed to the left.

Perhaps you could have an Action Menu and just have a "Search" action occur. That is, it'll search for the values that are in the already-existing search fields. Just a suggestion.

As for the edit menu, it only seems like it would be extra bells and whistles. I'm not sure how you allow the user to change his app settings, but perhaps you can have Edit -> options, and allow the user to edit there?

Just some ideas.
Mark Spritzler
ranger
Sheriff

Joined: Feb 05, 2001
Posts: 17250
    
    6

I think it looks very pretty. There might be a case for putting the Comboxes on top, but I don't feel that it is a big deal.

Mark


Perfect World Programming, LLC - Two Laptop Bag - Tube Organizer
How to Ask Questions the Smart Way FAQ
Paul Bourdeaux
Ranch Hand

Joined: May 24, 2004
Posts: 783
i don't really feel that "edit" even though it is a standard menu item, should be used. Maybe "actions"? What do you guys think?
Actions would probably be fine. It is a more descriptive title than edit, and that enhances usability.
Perhaps you could have an Action Menu and just have a "Search" action occur. That is, it'll search for the values that are in the already-existing search fields. Just a suggestion.
I think it is an excellent suggestion. This is almost exactly what I am doing in my application. Even though you most likely won�t lose any points by only having a File menu, using the standard menus is still a good practice to get into. On an older thread (I think 4 months ago or so), a few of us went into detail about the advantages of using industry standards, and the use of "user modes" in Human Computer Interaction. If you are interested, do a search for it...
Oricio Ocle
Ranch Hand

Joined: Nov 30, 2004
Posts: 284

Hello i think it would be a good idea right-align numeric values in the table!
Greetings


SCJP, OCMJD, OCMJEA
Andrew Monkhouse
author and jackaroo
Marshal Commander

Joined: Mar 28, 2003
Posts: 11465
    
  94

Hi Daniel,

Very nice.

You might want to consider disabling the "Book" button if no row has been selected, or if the row has already been booked.

My personal preference would be to have the search items at the top instead of on the left, but I don't consider it a big deal.

Regards, Andrew


The Sun Certified Java Developer Exam with J2SE 5: paper version from Amazon, PDF from Apress, Online reference: Books 24x7 Personal blog
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Andrew Monkhouse:
Hi Daniel,

Very nice.

You might want to consider disabling the "Book" button if no row has been selected, or if the row has already been booked.

My personal preference would be to have the search items at the top instead of on the left, but I don't consider it a big deal.

Regards, Andrew

Hey Andrew, thanks for the advice. I added a MouseMotionListener that listens to a mousePressed on a table row. I then check to make sure that it is valid and set the button to enabled. Here is another question relating to it, should I also check and make sure that the customer id is valid? It seems wrong to test this in my mouselistener inner class because the flow of my gui goes from search, select, enter id and book. So it would never be enabled because i doubt the user would select a row, enter the id, and reselect the row in order for it to work. Maybe add a keylistener on the textfield instead? That sounds like a better idea. What do you think? I like the idea about not enabling the book button for a record that is already taken. Thanks, Andrew!
Andrew Monkhouse
author and jackaroo
Marshal Commander

Joined: Mar 28, 2003
Posts: 11465
    
  94

Hi Daniel,
should I also check and make sure that the customer id is valid?


I would (and did ). The instructions are fairly clear that the customer ID should be an 8 digit numeric field, so I believe we should cater for this business rule.

Be aware, though, that Sun have commented that less than 8 digits is acceptable.

It seems wrong to test this in my mouselistener inner class because the flow of my gui goes from search, select, enter id and book. So it would never be enabled because i doubt the user would select a row, enter the id, and reselect the row in order for it to work. Maybe add a keylistener on the textfield instead? That sounds like a better idea. What do you think?


I suspect that the keylistener won't work the way you want it to, but it would be interesting for you to try it and let us know the results .

Alternatives might include using a MaskFormatter on the JTextField (probably the simplest of all solutions) or creating your own Document and using it in an extension of JTextField (extremely powerful). Both are discussed in this thread.

Regards, Andrew
Frans Janssen
Ranch Hand

Joined: Dec 29, 2004
Posts: 357


The listener method is called any time the selection in the table is changed. I use this to enable/disable my Book button.

Frans.
[ January 12, 2005: Message edited by: Frans Janssen ]

SCJP 1.4, SCJD
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Originally posted by Andrew Monkhouse:
Hi Daniel,


I suspect that the keylistener won't work the way you want it to, but it would be interesting for you to try it and let us know the results .

Alternatives might include using a MaskFormatter on the JTextField (probably the simplest of all solutions) or creating your own Document and using it in an extension of JTextField (extremely powerful). Both are discussed in this thread.

Regards, Andrew

I'll experiment with the keylistener today for fun. I am aware of that topic of a customer id being shorter than 8 digits. However, I feel that if I state it in my choices.txt and my justifications for it, it'll be acceptable. Afterall, it only mentions 8 digit, never does it say less than that. That'll be my arguments even though a Sun rep said it could be <= 8 digits.
Daniel Simpson
Ranch Hand

Joined: Sep 02, 2004
Posts: 181
Haha! It worked! I added a simple keylistener to my textfield. My assumptions were correct.


I also added a mouse and key listener to the actual table as well to use for enabling and disabling. Here is the sequence. Search-->Select valid contractor (not currently booked)-->Customer ID textfield becomes enabled-->valid id-->book button enabled. I also looked at "what-if" scenarios, too. Customer selects valid contractor, enters valid id, deselects contractor row (causing book buttons to become disabled), and reselects it. It works perfectly! Thanks, Andrew, for the suggestion of enabling and disabling.
[ January 12, 2005: Message edited by: Daniel Simpson ]
Josh Allen
Ranch Hand

Joined: Jan 15, 2005
Posts: 37
A note about adding menus: dialog boxes should NOT have menu's, and it pretty much looks like a dialog box (which is a good thing--nice and simple).
 
Consider Paul's rocket mass heater.
 
subject: Rate My GUI