Select Page

Cognizant Mega Menu Redesign

Cognizant is a multinational information technology services and consultation company. They serve over 15+ industries and help companies modernize technology, reimagine processes and transform experiences so they stay ahead in a fast-changing world. 
 
Cognizant has 5,000 daily users and hundreds of pages, but experiences low visit times and low traffic to their tertiary pages By giving visibility to tertiary links and highlighting key content within the mega menu, we hope to improve the users ability to navigate our variety of services, and find content relevant to them. 
 
This project succeeded under the partnership of Cognizant marketing’s IT, Analytics, Web and Brand team. 

 

Senior User Experience Designer at Cognizant

Tasks Performed:
-UX Design
-Prototyping
-User Research

Programs Used:
-Figma
-Contentsquare
-Adobe Analytics

 

Problem

2 months after the launch of the initial mega menu, we received an analytics report comparing the new menu’s performance to the former. It identified some success:
  • Overall visits to the subpages in services/industries have grown after the launch of the new layout

But have some overwhelming adverse results:

  • Overall visits reaching the destination page from menu clicks have reduced by 20%
  • Overall visits to the main landing pages in services/industries have declined by 10%
This is concerning as it means that users are not leaving the landing page. The mega nav does not provide the user with clear navigation choices. The decrease in visits to the secondary pages such as ‘Banking’ or ‘Data and AI’ is a loss in story-telling opportunities to internal marketers.
  1. Full screen navigation can create user frustration to limited exit options
  2. The contrast of the midnight blue and the white is hard on user’s eyes and divides the content. High contrast should only be used to draw attention and divide, and is not appropriate for this scenario
  3. Secondary links within fly out lacks hierarchy
  4. Vertical, one-column format does not use space efficiently

Design process

While the first approach of the mega nav had success in giving more visibility to tertiary links, the decrease in users reaching destination sites cannot be overlooked. The navigation needs to clearer hierarchy and needs to utilize space more meaningfully. 

  1. Reduced size of menu so it is no longer full screen and lessen user frustration
  2. United the navigation by lowering the contrast of UI elements
  3. Prioritized the secondary link by adding a description and CTA
  4. Organized tertiary links into two columns to better utilize space
  5. Enhance personalization by adding “Featured” section in each flyout