Thursday November 14th, 2013 by Björn Balazs
From the Forge Sprint 2011 in Madrid on, as part of my engagement for the OpenUsability.org initiative, I have been in constant contact with the KDE Solid people and esp. with Lamarque and Jan who are responsible for development of the networkmanager integration in KDE. Back then we developed some – at that time – quite futuristic ideas of where we want to go with the UI for managing your connections. With the current release of 0.9.3 we made a huge step forward towards this future.
Jan sent me a video showing the current state of the UI and asked me about possible improvements for the next iteration. As it is World Usability Day today, I thought we should crowd source this task.
Here are the rules:
- Watch the video about the current state of the UI.
- Read and vote for possible improvements based on my expert review of the video.
- Add your own ideas in the comments below.
So jump in and do your little piece of Usability to honor the World Usability Day 2013 (and make your KDE even more awesome)!
It starts with the relaxing part. Stage free for the UI!
First I would like to present just a few findings we derived from an expert analysis. For any expert analysis it is important to use a usability testing strategy. They are called cognitive walk-through, heuristic analysis and the like.
Personally I like to combine different of these strategies, as all of them are able to uncover different rooms for improvement. In the end it is my task to derive the most important findings for the next iteration.
Hence, next I present my personal Top 3 improvement ideas for the current state. I will then ask you to vote how you like these ideas. And please use the comments to improve my suggestions and add your own ideas.
And as always, there are constrains: Most importantly, this dialog should work in desktop and touch environments.
Finding #1: Address the right mental model
The connection state ‘Active’, ‘Previous’ and ‘Unknown’ is very dominant on the screen. But it is essentially not that important for a user whether he knows the password for a connection he is supposed to use or not. The user simply wants and is allowed to connect to this special connection, so he will be able to figure the password out. The ‘Known’ / ‘Unknown’ information is simply for convenience: Will I need to have the password at hand?
Go for two sections only. Call one ‘Currently connected to’ instead of ‘Active connections’ and the other ‘Connect to’ instead of the two, ‘Previous’ and ‘Unknown’ sections (place the “connect to non-visible WiFi” there as well – this option seems to be missing at the moment). Some more details:
Known connections are presented first. Then the other connections should be ordered by signal strength. This makes it likely that the user will find the relevant connection in the upper part of the list.
Show buttons to access the most likely action on hoovering the mouse over a single row in the list. This will be Disconnect if state is connected, Connect for ‘Known’ and Configure for ‘Unknown’ connections.
- Single Click:
In order to support touch users, a click on a row brings up the action button. If necessary it expands the area (e.g. to enter the password).
Finding #2: Do not mix interface metaphors
The interface makes use of the accordion metaphor when presenting the connections. The general settings (e.g. wireless on/off) also ‘pop-in’, so behave like an accordion tab, but are are done somewhat differently. This mix of metaphors is confusing and ugly.
Do not use the accordion. Introduce a big headline ‘Network Management’ to the whole panel (compare visualization in the post from Sebas today) and show two Tabs ‘Connections’ and ‘Configuration’ right below it:
- In the ‘Connections’ tab show the list of all connections and do not allow to collapse it. Use the separator labels as headlines to structure the list of connections.
- The ‘Configuration’ tab shows, well – wow – configurations options.
Finding #3: Do not create custom widgets
In the ‘Active Connections’ as small configuration icon is used to switch views between a speed-graph and some detail text information. This also changes the possible action for this connection (‘Disconnect’ vs. ‘Edit Connection’). This is not the normal or expected behavior of a button.
I suggest to present both views in one, like it is done in the old applet, including a button ‘Edit connection’. This is reasonable, because when users expand an active connection, they want to investigate it in greater detail. This might well take the whole space of the applet if needed, as other connections are not of interest at that moment.
Now you are invited to join the discussion:
- How can we improve network management further?
- How do like our ideas?
- Are there other aspects you think are more important for the next iteration of the interface?