RE: Zenmap GUI redesign task for GSOC2013

[Костадин Хаџибанов <hadzhibanov.kostadin () students finki ukim mk>]

I am sorry for the delayed answer.

For this task, I counted on first doing some short informative surveys of users, friends, colleagues, and get as much 
data on their experience with Zenmap as possible for reference. I figured it would be also helpful, if not even better, 
to discuss this with the mentors/developers, as you are more familiar with the userbase, user categories, most used 
features etc.

I also encourage people to share their experience using Zenmap to my mail or this mailing list if thats ok.

I included this as things to do in week one in my working plan draft for the proposal, but I can do it before the 
project starts as well. I included the working plan in the mail so you could tell me whether I should make some 
adjustments. Notice there are a lot of brainstorming sessions to come up with more ideas along the way and regular 
consulting to stay in contact with the mentors.

Some things to get insight from the mentors for the design plan:
- Is there a desire / how strong is the interest to introduce the program to a new userbase.
- Extensibility, what new features are planned for the future, etc. 
- How drastic changes would the redesign allow.

My first contact with Zenmap was about a year or two ago (I'm not a frequent user though), and from what I can recall 
the interface seemed a bit unwelcoming to new users, and it lacked something to guide them through the features. 
Though, after exploring all of the features and reading the Zenmap manual, I got used to it reasonably well. But I 
thought one way to overcome this unpleasant step might be an introduction of a welcome screen.

Some welcome screen designs I considered:
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm7_zpsc21d324f.png   (I did this one first, with the 
simple inteface in mind)
http://s1274.photobucket.com/user/hadzhibanov-kostadin/media/zenm6_zpse8b17afb.png.html
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm5_zps6176508f.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm3_zps805824f8.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm4_zpsb94c49ef.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm2_zps1f5d16d9.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm1_zps09b2dabb.png

Another possible idea to complement this could be tooltips, or a status bar, showing short info about hovered items, or 
adding in-app help.

My initial thought was to simplify the user interface as much as possible, and a lot of my ideas stemmed from there, 
but this would require at least another Advanced interface which you said was not desirable.

The "Topology" view stands out, looks final and solid, and might benefit from giving it either a more prominent or 
separate position.

I also discovered that tabbed scanning was once a feature, but no longer is. What was the reason it got removed?

Things to be imporoved upon/remarks:
- The Services tab only uses the Ports/Hosts view.
- The Hosts tab only uses the Ports/Hosts and Host Details view.
    Possible solutions:
    - Scans and Output put in new row below the rest of the tabs. (possibly collapsable and/or resizable) 
    - The Host Details could be turned into an info dialog, as done with Scan Details.
    - The Hosts and Services tabs could display Ports/Hosts data in only a single box.

http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm15_zps0a6dd10f.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm14_zps4736dffb.png

    
- The Host Viewer dialog from the Topology tab displays redundant information with other tabs (except for the 
traceroute tab)
    Possible solutions:
    - Topology moved to top level tabs, add Filter Hosts button in Hosts Viewer.
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm13_zps24049f32.png
    - Or, Traceroute to second level, remove Hosts Viewer from Topology.
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm16_zps03326462.png


Ultimately, scanning related elements could be located in a new Scanning tab, and have it all in only three top level 
tabs - Scanning, Ports/Hosts, Topology.
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm11_zps7ddac307.png
http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm10_zpseb04601b.png
I find this the most appealing option, but I did this with no account for upcoming features that might stand in the way.

- Make it more customizable (if gtk allows it):
    - Closable/openable view tabs.
    - Movable elements.

 - The host filtering can get a dialog with rows for its options. (something like the Search Scan Results + maybe 
save/load filters?)

- Make the information that the scan is running more noticable. (The small grey bars icon in the nmap output is neat 
but hard to spot). I read some of the planned features are to estimate the time remaining for a scan, so maybe add a 
progress bar column in the Scans tab.


Some guides for potential grouping to rely on for some alternate design ideas:
    - "Hosts" shows information about a single host.
    - "Services" and "Topology" show collective information/aggregated data about bulk of hosts.


A few things from an aesthetic perspective:
    - I felt there is a lack of empty space for the user to rest his eyes on. (A possible idea is to add a ribbon with 
the logo above the scan fields - another potential area to display Info about the hovered items).
    - The "Filter Hosts" button and input line adds unpleasant visual boundary to the content above which is a list of 
data (Make a Filter Hosts dialog, eventualy give the button a better location).
    - Flow discontinuities: 
        - http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm9_zpse547933a.png
        - http://i1274.photobucket.com/albums/y427/hadzhibanov-kostadin/zenm8_zpse75cf77a.png


A gave the TODO list some extensive view, and I noticed a lot of small Zenmap tasks that I could also do during the 
summer. Should I list these in my proposal too? Maybe you can suggest some more important ones?

I could easily do the ones involving icons if those are still up and considered the parsing of script results, as I see 
NSE is becoming an important feature of Nmap.

I also got a reply to the first mail I sent to this list from a visually impaired user of Nmap who asked for and 
offered to help with adjusting the user interface to work with a screen reader. I have to research how screen readers 
work in detail, but will gladly try to make this part of my project too (The changes in the design could go in line to 
make this more plausible).

I plan to send a preliminary proposal as soon as possible.

Also, is a patch with some small code change to the GUI recommended along with the application?


________________________________________
From: David Fifield [david () bamsoftware com]
Sent: Friday, April 26, 2013 6:09 PM
To: Костадин Хаџибанов
Cc: dev () nmap org
Subject: Re: Zenmap GUI redesign task for GSOC2013

On Fri, Apr 26, 2013 at 11:46:19AM +0000, Костадин Хаџибанов wrote:
> I feel I havent introduced properly the last time, my name is Kostadin
> Hadzhibanov and I'm am a Computer Science undergraduate student and
> some of my areas of interest include graphic design, interactive
> application and user interface design.
>
> I would like to consult a mentor about the level of redesign the
> Zenmap GUI task would entail, as I have quite a few ideas myself and
> some rough drafts about the design.
> I sent a message to this mailing list a few days ago, but it remained
> unanswered by the mentors, unfortunately.
>
> However, I took my time and marked the areas that can be improved
> upon. My main focus was on simplifying the interface, though it would
> be nice to consult the mentor about the Zenmap user base and  other
> general stuff, to decide for example, if splitting it to a
> "Simplified" and "Advanced" user interface is a good idea, etc.

Would you share your list of things to be improved on? We would be
interested in seeing it. A simpler interface is better, all other things
being equal.

Have you made sketches or mockups of what the interface might look like?
If so, those are good to have us comment on, and should definitely be
part of your proposal.

A split simplified/advanced interface is not likely. Zenmap used to have
a novice/expert mode and it was one of the things we removed during GSoC
2009.

> I suppose this a good place to send the rest of my ideas for feedback
> before I submit my application?

This is the right place to get comments on your ideas.

David Fifield


_______________________________________________
Sent through the dev mailing list
http://nmap.org/mailman/listinfo/dev
Archived at http://seclists.org/nmap-dev/