I have invested the past three weeks into the NStatic user interface, polishing it up and considering how it will eventually be used. I didn't feel that the previous user interface was acceptable.
I'll take it to beta when it feels just right; I don't think it make sense to do it when there are still bugs that I am aware of.
I have given thought to the many different areas of the product:
- Interactivity. The performance of the tool is such that it is possible to interactively modify state and execute code in the context of the error. Much of the tool such as the intellisense, the class view, the error window, and file structure view are already synchronized in real time with text editor. The error window actually incorporates syntax errors dynamically as code as being edited.
- Manipulating and viewing the data. I have also captured much more statistics and allowed many different ways of viewing the data within the tool.
- Exporting the data. There are multiple ways to send and export data.
- Fixing the bug. I have also considered the process of visiting and fixing the data, and preventing some types of errors from appearing in future scans. This process is much like how Outlook allows one to manage inbox message.
I suspect that this product will be much more pleasing to the eyes and richer in functionality than people will have been expecting.
That progress bar sure is huge. I know you posted way back about how you'd be doing the scan button. But I have to say that I find the amount of space that could be dedicated to seeing the code or your analysis being wasted on something that could be stuffed into the status bar and a menu to be appalling.
I mean, I'm going to click the SCAN button once, then watch the progress bar. After that single action, I'm going to spend quite a while looking through my code and your output. It seems like the value of the space for other purposes outweighs its value for the brief time it's being used.
Posted by: CWuestefeld | July 18, 2007 at 02:31 PM
I have the same thoughts. I also think that a larger progress bar or any graphical drawings can have an impact on performance of the operation.
Posted by: Wesner Moise | July 18, 2007 at 02:35 PM
Speaking strictly about GUI.
1) There are 2 same big buttons in top left corner. I am sure you can explain it to any person in 40 seconds. But you cannot walk to any person who uses the program and explain the things.
2) Instead of huge progress you should put Actions to ribbon bar.
3) Orange '0 Messages 1 Warning 0 Errors 14 Brekpoints' captions take too much of attention. When I see to interface it is 2nd thing which cries to me (after 2 big buttons in top left corner).
4) Why the text from (3) is doubled in top right corner? It suggests I still underestimate the importance of the number of Warnings.
5) The number of main menu items is way too wast. Put more features to ribbon bar. Bug menu actions are even less visible than Warning count.
The overal advise is as following. Think of Actions. Then think about key scenarios. Then draw some schematic screens for each of those scenario, putting the most important actions to visible place.
And a particular advise. The most important Action Button should naturally be at right or bottom side of screen.
Posted by: Oleg Mihailik | July 18, 2007 at 03:52 PM
@Oleg: I noticed the similarity of the buttons (they're not exact), but after a moment's thought I was OK with it. The system menu icon represents the app itself, and the SCAN button tells the app to do its thing. Since the app has at its heart that one purpose, it all makes sense.
I think the error/warning/break counts could be put into the status bar, along with the progress bar.
Of course, transplanting them may not shrink the space taken by the ribbon; we haven't seen what Wesner has in the other groups.
I disagree that the number of main menu items (7) is too large. First, I don't think they're menu items; they are ribbon bar groups. But even so, on my desktop right now, Firefox also has 7 top-level menus; Outlook has 7, and SQL Server Mgmt Studio has 9. Notepad++ has 13!
Posted by: CWuestefeld | July 19, 2007 at 06:15 AM
I understand there is a reason for those buttons be both large and both similar. But nevertheless it is confusing, so should be avoided when possible.
Also note, that usually 'the main button' tends to be at right or bottom side. OK, Next, Go. If you just put your button to right, it would already break that strange 2-button pattern.
Placing things 'under' menu (or ribbon bar groups) you pulling them away from user. You've put the big progress bar right in the place where most important actions should stay.
It means user would need to click a lot to do the work. Even conventional OfficeXP-like interface would be more productive in that case.
And I think your orange draws a lot of attention wherever you use it. So it would be reasonable to select some more laid back color for 'selected' items. It may be orange, but with much less intensity.
Posted by: Oleg Mihailik | July 19, 2007 at 07:53 AM
Although apart from those usability comments, the whole GUI looks impressive and stylish.
It is just that usability and style are not the same things.
Posted by: Oleg Mihailik | July 19, 2007 at 07:56 AM
The ribbon is shrinkable and the space is shared with all the other tabs. The application remains interactive while the scan is in progress.
The huge progress bar is likely to be shrunk, at the very least that progress displays do have an impact on performance.
Including the progress bar in the status bar is something that I am thinking about.
I am looking at centralize the scan button and making the differences sharper.
The error list is the focal point and that's where most of the action buttons will be (as well as the Data and Bug buttons).
There are no menu items; those are the ribbon tab captions.
Many of these buttons can be hidden.
The status bar will highlight the currently selected error. As well as report other information from Search and Replace and else where.
Posted by: Wesner Moise | July 19, 2007 at 10:50 AM
Looks beautiful, Wes.
The large space allotted to the progress bar and warning & error report is fine, given that the ribbon can shrink simply by double-clicking the ribbon tab.
Looks great Wes. Great job. It's apparent you've put a lot of thought and effort into the UI design.
Posted by: Judah | July 19, 2007 at 07:42 PM