Software feature article tabs
- Jazz Navigation Design- selected tab,
- The team
Taking on the navigational challenge for integrated web applications
The Collaborative Lifecycle Management (CLM) project is focused on coordinating the software development activities across requirements, development, build, and test. The IBM products that manifest these disciplines are Rational Requirements Composer – a requirements management application, Rational Team Concert – a change and configuration management application, and Rational Quality Management – a quality management application. Jazz Foundation is the centralizing hub for the integration and functional services of these applications.
One of the goals of Jazz Foundation is to use and provide a single consistent UI framework for supporting tasks across applications. A significant piece of this is the main web banner and navigation system. Without these unifying navigational elements in place, the only way to navigate between applications, and the projects within them, is to point your browser to a particular URL. This works for ad hoc visits to different applications, or if all your time is spent in a single application. But it doesn't work so well when you need to move between different types of artifacts within the software development lifecycle, such as between a requirement and its related test case, or between a development plan and its related test plan.
Our challenge was to design a 'container' and functional elements to support this type of fluid movement.
Meeting the challenge for a unified navigation system
To meet the challenge, four key elements were enhanced from their previous form or introduced to meet the navigational need:
-
(Click the image to enlarge it.)Home menu for explicitly setting the project context across applications: Previous to the Rational Team Concert 3.0 release – the first of the CLM products to go out with the new navigation system – the project switcher was a secondary element on the far right of the banner's navigation bar and was limited to the current application. Because a project is the main working area in which a person focuses their tasks, it was critical that we provide a prominent location and treatment for the element that allowed access to other projects within other applications. To meet this need, the project switcher was replaced with a prominent cross-application home menu located on the left side of the main banner bar. This menu is organized by application and provides scaling mechanisms, including overflow to multiple columns as a 'mega menu' and the ability to control what projects are shown.
-
(Click the image to enlarge it.)Capability menus on the project navigation bar for accessing and managing work within a project: Once the project context is set in the home menu, the next level of navigation provides access to a pre-defined set of capabilities within the project's navigation bar. Earlier versions of the navigation bar included a mix of tabs and menus across different applications. Tabs confined the user to the artifact type they were working with, prevented easy access to other capabilities and their associated artifacts and required many extra clicks to get from one type of artifact to another. With the new system, users can now access saved searches, create new artifacts, and switch between recently viewed and unsaved artifacts for any capability within the project. These menus are also 'mega menus' that provide static content in the left column and dynamic content in the right column. -
(Click the image to enlarge it.)
Quick search with scope settings: The quick search is now consistently located, across all of the CLM applications, on the far right of the navigation bar and it is scopable to the artifact type. -
(Click the image to enlarge it.)Mini dashboard for accessing feeds and other favorite widgets: The mini dashboard is a new mechanism for supporting an individual's cross-application work. It is a personal dashboard that goes with the user wherever they go within a set of associated CLM applications. It can be tailored to include any favorite dashboard widgets but it is particularly useful for feeds because the user sees notifications from any of the projects they work with.
Working within a feature team
Because CLM is a cross-component cross-discipline undertaking, it required a cross-component cross-discipline team approach. The navigation feature team was one of the feature teams established for CLM. This team was composed of a diversity of roles including user experience design and development team members from Jazz Foundation and the CLM applications. The design thinking and socializing was done in advance of the navigation team's formation. Once formed, the design team worked closely with the core development team at the Jazz Foundation level to iterate on the first implementations. The Foundation team in turn provided implementation guidance to the application team members.
Self-hosting and customer input
In the very early stages of design for the 3.0 release, we hosted a customer session at the Voice of the Customer Event (VoiCE) of the Customer Event. This early input formed the basis of some of the key decisions, particularly for the home menu. We later used the CLM Design Partner Program to get feedback on the early implementation, and we hosted a series of 1-on-1 usability sessions. These sessions, in combination with the development team's self-hosting on each of the applications as they are being developed, is bringing us a generous amount of feedback and validation of the design direction. We are fortunate to be using an open system on Jazz.net to be able gather feedback at any time through work items and the forums.
Future improvements based on recent feedback include showing associations in the home menu, and further refinements to the interaction in the quick search.
To learn more about Jazz and the products that build or integrate with Jazz, or to join the community, visit Jazz.net.