We like infographics. It is a very good way to represent information. We decided to share some interesting info about our company, development process and the product. Enjoy!
Since I started to work for TargetProcess and use the product for my daily working routine, I’ve experienced some problems. One of these problems was navigation. All the links were grouped under sections in primary navigation level or administration level at the top. It took quite long to learn which group of links should I select to find some specific page.
The mind map of old navigation
Later I grew up to an experienced TargetProcess user as I’ve been testing new features or build every day but I still was mistaking the groups almost every time (e.g. trying ‘Tracking’ instead of ‘Planning’ group when looking for Builds list).
Since navigation was the common pain we started to think how we can revamp its look and feel. We wanted it to be flat, customizable, easy to use and quick.
Complaints and requests from other TP users have been considered as we’ve been generating ideas for first wireframes:
We’ve been thinking if we should hide or show the whole group of links as on the screen below:
…and ended up with the concept of customization by links as we enabled users either to pin each single link to primary nav tab or to keep the link in ‘More’ group, create their own groups and rename the links:
All these wireframes emerged after long meetings, hot debates and multiple changes.
As a result, by mid-January ’10 we’ve had two different navigation concepts ready to be shown to some customers, members of TargetProcess UX group. We asked the customers to review two navigation concepts implemented as dynamic and static PDF and give us their feedback on both.
Here’s the first navigation concept:
The second navigation concept:
Most of our customers-UXers voted for the first concept and we went along with this design. Development of dynamic prototype was started simultaneously with the nav coding so we had usability test results available by the end of implementation.
We wanted to run a usability test with our customers as early as we could and the interactive dynamic prototype for navigation was ready in a week (with IxEdit). The prototype replicated TargetProcess tool and was available on the web. Not like in the real web app, there were just screenshots with static pages:
In this proto users were able to navigate from page to page and to customize links selection for their primary nav menu. The only major thing at that time was re-ordering of pinned tabs which didn’t work in the proto.
Test scenarios were rather simple:
We asked our customers from the UX community to take part in the usability testing of new navigation, and four of them agreed. The testing was done via GoTo meeting.
Based on the results of this testing, we’ve become aware of some areas in the navigation where users slowed down.
Most of the users who saw the nav for the first time tried to drag and drop links right away and guessed slowly that tuning and re-ordering tabs works in customization mode only. After customization was done, they forgot to switch customization mode off. Also we noticed that [Reset to default] button appeared uncalled, so it was removed in the final version.
That’s why we went on and tried to emphasize with different styles when navigation is in customization mode and when not.
Now the highlighted menu background under the button [Customize] shows that the button should be pressed to start tuning (customization).
That’s what one can see in the tuning mode (check the screen below):
We believe that it’s hardly possible to mess up with the navigation modes now. The navigation is quick, one-level and simple for personal customization.
And – what’s most important – people like it as well. Out of many feedbacks, here’s just one from Igor France:
I have just installed the latest version of Target Process with the intention to start using it on my own projects (the company I worked for at the time didn’t adopt it) and I am again really enjoying using it! Apart from the positive things already mentioned, the main navigation itself in the meantime not only stopped being confusing but is now fully customizable as well!
