Eliminating Friction in People Search

Denton's Navigator (Law firm internal portal)
Denton's Navigator (Law firm internal portal)

Redesigned the search experience to help users find the right person faster through a more intuitive and efficient workflow.

Redesigned the search experience to help users find the right person faster through a more intuitive and efficient workflow.

ROLE

Product Designer

Product Designer

TIMELINE

4 Weeks

4 Weeks

PLATFORM

Desktop

Desktop

Introduction

Introduction

The Dentons Navigator project enhanced the website's user experience through a heuristic evaluation, identifying usability issues and implementing design improvements to create a more intuitive and efficient experience.

The Dentons Navigator project enhanced the website's user experience through a heuristic evaluation, identifying usability issues and implementing design improvements to create a more intuitive and efficient experience.

Project background

Project background

Dentons is one of the world's largest law firms. Its Navigator platform helps clients and internal teams access legal resources and services. User feedback revealed several usability challenges, leading to a UX audit and redesign to improve navigation, usability, and the overall experience.

Dentons is one of the world's largest law firms. Its Navigator platform helps clients and internal teams access legal resources and services. User feedback revealed several usability challenges, leading to a UX audit and redesign to improve navigation, usability, and the overall experience.

Requirement

Requirement

The goal of this project was to enhance the user experience (UX) of the Dentons Navigator Portal, ensuring it aligns with Dentons' brand and essence while making it simpler and more intuitive for Dentons employees to use.

The goal of this project was to enhance the user experience (UX) of the Dentons Navigator Portal, ensuring it aligns with Dentons' brand and essence while making it simpler and more intuitive for Dentons employees to use.

My Role

My Role

As the UX Designer for the Dentons Navigator Project, I was responsible for leading the audit, heuristic evaluation, user research, and redesign process.

My role involved conducting comprehensive usability evaluations, gathering user insights, and ensuring the redesign aligned with Dentons' brand identity. I developed wireframes, prototypes, and high-fidelity designs, conducted usability testing.

As the UX Designer for the Dentons Navigator Project, I was responsible for leading the audit, heuristic evaluation, user research, and redesign process.

My role involved conducting comprehensive usability evaluations, gathering user insights, and ensuring the redesign aligned with Dentons' brand identity. I developed wireframes, prototypes, and high-fidelity designs, conducted usability testing.

Objectives

Objectives

  1. Conduct a thorough heuristic evaluation to identify usability issues.

  2. Redesign the website with a focus on user experience (UX) enhancement.

  3. Implement changes to create a more intuitive, accessible, and efficient interface.

  4. Ensure the redesign aligns with Dentons' brand identity and business goals.

  1. Conduct a thorough heuristic evaluation to identify usability issues.

  2. Redesign the website with a focus on user experience (UX) enhancement.

  3. Implement changes to create a more intuitive, accessible, and efficient interface.

  4. Ensure the redesign aligns with Dentons' brand identity and business goals.

Target Audience

Target Audience

The primary target audience for the Dentons Navigator Portal includes Dentons employees such as legal professionals, administrative staff etc.

My Goal

My Goal

The goal is to enhance the overall user experience by pinpointing areas for improvement and providing actionable recommendations.

Audit

Audit

Auditing is a thorough review and evaluation of a website or application to identify usability issues, assess design consistency, and ensure the interface aligns with user needs and business goals.

I have gone through the overall flow of the website and made pointers based on the experience I had while going through it, going through the site and understanding what users need really helped me finding what I really need to do to make it better.

Audit file link

Audit file link

Heuristic Evaluation

Heuristic Evaluation

By Analysis and Documentation:

I documented all findings, highlighting key issues like confusing icons, lack of proper navigation options, and cluttered interfaces. I have prioritized the issues based on its impact on the user experience.

I documented all findings, highlighting key issues like confusing icons, lack of proper navigation options, and cluttered interfaces. I have prioritized the issues based on its impact on the user experience.

With Recommendations:

Based on the audit findings, I provided detailed recommendations to enhance the portal and improve the user experience.

Based on the audit findings, I provided detailed recommendations to enhance the portal and improve the user experience.

Insights on Design Improvements:

I suggested specific design improvements such as implementing breadcrumbs for easy navigation, using lazy loading for profiles, and ensuring proper contrast and spacing. The goal was to create a cleaner, more intuitive interface that aligns with Dentons' brand and is easy for employees to use.

I suggested specific design improvements such as implementing breadcrumbs for easy navigation, using lazy loading for profiles, and ensuring proper contrast and spacing. The goal was to create a cleaner, more intuitive interface that aligns with Dentons' brand and is easy for employees to use.

How I Conducted the Audit before going to Heuristics Evaluation:

How I Conducted the Audit before going to Heuristics Evaluation:

I began with a heuristic evaluation, using Jakob Nielsen's 10 Usability Heuristics as the framework. To make things more crisp and clear in terms of understanding.

Which helped me systematically show all the issues and suggestions based on the issues which were inconsistencies, navigational problems, and accessibility concerns.

Arranging the finding from the audit with the principles has helped me making the stakeholders understand my design approach and the UX path I am taking.

I began with a heuristic evaluation, using Jakob Nielsen's 10 Usability Heuristics as the framework. To make things more crisp and clear in terms of understanding.

Which helped me systematically show all the issues and suggestions based on the issues which were inconsistencies, navigational problems, and accessibility concerns.

Arranging the finding from the audit with the principles has helped me making the stakeholders understand my design approach and the UX path I am taking.

Heuristics file link

Heuristics file link

List of Questions (How Might We)

List of Questions (How Might We)

Based on the evaluation and Auditing I have pin pointed some major areas which really needed improvement so I tried framing some HMW questions for better user experience.

Before started designing I have asked few questions to myself for a clear idea on what exactly I am going to do and how is that going to help the users.

Based on the evaluation and Auditing I have pin pointed some major areas which really needed improvement so I tried framing some HMW questions for better user experience.

Before started designing I have asked few questions to myself for a clear idea on what exactly I am going to do and how is that going to help the users.

How might we improve the search functionality to make it faster and more intuitive for users to find specific profiles?

This question focuses on enhancing the efficiency and user-friendliness of the search feature.

How might we improve the search functionality to make it faster and more intuitive for users to find specific profiles?

This question focuses on enhancing the efficiency and user-friendliness of the search feature.

How might we simplify the navigation and layout to ensure users can easily access the information they need without feeling overwhelmed?

This question aims to address issues related to clutter and complexity, striving for a cleaner and more streamlined user experience.

How might we simplify the navigation and layout to ensure users can easily access the information they need without feeling overwhelmed?

This question aims to address issues related to clutter and complexity, striving for a cleaner and more streamlined user experience.

How might we ensure that the design remains consistent with Dentons' brand identity while providing a modern and accessible user interface?

This question targets the balance between maintaining brand consistency and incorporating contemporary design elements that enhance usability.

How might we ensure that the design remains consistent with Dentons' brand identity while providing a modern and accessible user interface?

This question targets the balance between maintaining brand consistency and incorporating contemporary design elements that enhance usability.

Brainstorming

Brainstorming

Other questions
Other questions
  1. Who is the target audience for this design?

  2. What is the primary purpose of this design?

  3. Why is this design necessary?

  1. Who is the target audience for this design?

  2. What is the primary purpose of this design?

  3. Why is this design necessary?

My Understanding
My Understanding

To answer the questions above, about the target audience, primary purpose, and necessity of the design, I have thoroughly reviewed the Dentons website flow and identified key areas for improvement.

I have started with the wireframe to give my understandings a visual representation for feedback and suggestions.

To answer the questions above, about the target audience, primary purpose, and necessity of the design, I have thoroughly reviewed the Dentons website flow and identified key areas for improvement.

I have started with the wireframe to give my understandings a visual representation for feedback and suggestions.

Wireframes

Wireframes

I have started with the wireframe to give my understandings a visual representation for feedback and suggestions.

I have started with the wireframe to give my understandings a visual representation for feedback and suggestions.

Feedback and Suggestions:
Feedback and Suggestions:

I collaborated with the development team to discuss the findings and recommendations. Taken feedback from the development team understood their points.

Continuous feedback and iterative design adjustments were made to ensure the final implementation met the desired UX standards.

I collaborated with the development team to discuss the findings and recommendations. Taken feedback from the development team understood their points.

Continuous feedback and iterative design adjustments were made to ensure the final implementation met the desired UX standards.

Wireframe file link

Wireframe file link

Visual Design

Visual Design

After identifying the areas for enhancement, I began the visual design process. This included creating an intuitive interface, improving navigation, and ensuring brand consistency.

The focus was on making the profile search, viewing, and management more efficient and user-friendly, while aligning the design with Dentons' brand identity.

After identifying the areas for enhancement, I began the visual design process. This included creating an intuitive interface, improving navigation, and ensuring brand consistency.

The focus was on making the profile search, viewing, and management more efficient and user-friendly, while aligning the design with Dentons' brand identity.

Visual design file link

Visual design file link

Landing Page & Search Field

Landing Page & Search Field

Old Design

Old Design
  1. This How the search field and landing page looked where there is no suggestions showing the search bar is not popping out which is the main thing in this whole portal “people search’.

  2. No profile section present in the landing page.

  3. No history or suggestions given.

  1. This How the search field and landing page looked where there is no suggestions showing the search bar is not popping out which is the main thing in this whole portal “people search’.

  2. No profile section present in the landing page.

  3. No history or suggestions given.

New Design

New Design
  1. I have tried making the search bar pop out as this is the main functionality here in Dentons Navigator Portal.

  2. To make the search more easy i have given the filter in the search bar itself so that user can search what they actually want to search quickly.

  3. Given profile option the landing page for users tio access own profile easily.

  4. Suggested profiles that matches the similar domain same as the user.

  1. I have tried making the search bar pop out as this is the main functionality here in Dentons Navigator Portal.

  2. To make the search more easy i have given the filter in the search bar itself so that user can search what they actually want to search quickly.

  3. Given profile option the landing page for users tio access own profile easily.

  4. Suggested profiles that matches the similar domain same as the user.

Search Results & Profile Review

Search Results & Profile Review

Old Design

Old Design
  1. The interface itself does not look very clean. The clear all button is there even there in no filter selected.

  2. To preview the profile it opens a drawer downwards with all the information in the top bottom where user will have problem focusing what they really want to see.

  3. There is this functionality available call send mail to all which allows users to send connection requests to all tje search result but it does not give the choice to select the profiles and send.

  1. The interface itself does not look very clean. The clear all button is there even there in no filter selected.

  2. To preview the profile it opens a drawer downwards with all the information in the top bottom where user will have problem focusing what they really want to see.

  3. There is this functionality available call send mail to all which allows users to send connection requests to all tje search result but it does not give the choice to select the profiles and send.

New Design

New Design
  1. Implemented and intuitive and clear design with a popup for the profile preview.

  2. Implemented the select and send mail feature for more accessibility for the user.

  3. Cleared up the design with some simple UI changes and proper filters.

  1. Implemented and intuitive and clear design with a popup for the profile preview.

  2. Implemented the select and send mail feature for more accessibility for the user.

  3. Cleared up the design with some simple UI changes and proper filters.

User Profile

User Profile

Old Design

Old Design

This How the user profile looks when you click on the view ull profile with the left information cards which again works as filter to filter out the profile which can take you to another search list with out any coming back to the profile option.

This How the user profile looks when you click on the view ull profile with the left information cards which again works as filter to filter out the profile which can take you to another search list with out any coming back to the profile option.

New Design

New Design
  1. This is how I have shown the profiles of the other users which is divided in small sections .

  2. I have implemented this one download v card button to download the connection information to connect later .

  3. With all the UI & ux changes I tried makin the interface and experience simple.

  1. This is how I have shown the profiles of the other users which is divided in small sections .

  2. I have implemented this one download v card button to download the connection information to connect later .

  3. With all the UI & ux changes I tried makin the interface and experience simple.

My Profile

My Profile

Old Design

Old Design

Users Can only edit their profiles by searching for their own name in the people search function, as there is no direct access to their account, which is not a standard practice as it makes the profile editing inconsistent.

Users Can only edit their profiles by searching for their own name in the people search function, as there is no direct access to their account, which is not a standard practice as it makes the profile editing inconsistent.

New Design

New Design
  1. For the users own profile they can edit their details which I have made easy by dividing the sections.

  2. made the UI clean and simple for the users .

  1. For the users own profile they can edit their details which I have made easy by dividing the sections.

  2. made the UI clean and simple for the users .

Iteration Based on Feedbacks

Iteration Based on Feedbacks

Designing is an iterative process; ideas and improvements can emerge at any time, and continuous refinement is key to achieving the best user experience.

After completing the visual design, I gathered feedback and made adjustments accordingly which looked necessary in terms of usability and accessibility

Designing is an iterative process; ideas and improvements can emerge at any time, and continuous refinement is key to achieving the best user experience.

After completing the visual design, I gathered feedback and made adjustments accordingly which looked necessary in terms of usability and accessibility

Feedback 1

Feedback 1

Users appreciated the ability to narrow down their search criteria upfront, which made finding relevant profiles quicker and more efficient.

Users appreciated the ability to narrow down their search criteria upfront, which made finding relevant profiles quicker and more efficient.

Feedback 2

Feedback 2

Users found the icons for add, delete, and edit underneath the table to be confusing and difficult to locate Especially add one . The lack of clear labeling made it hard leading to a less intuitive user experience.

Users found the icons for add, delete, and edit underneath the table to be confusing and difficult to locate Especially add one . The lack of clear labeling made it hard leading to a less intuitive user experience.

Iteration

Iteration

The first iteration involved adding filters for department, people, and region inside the search bar. This allows users to refine their search even before initiating it, enhancing the efficiency and accuracy of the search functionality.

The first iteration involved adding filters for department, people, and region inside the search bar. This allows users to refine their search even before initiating it, enhancing the efficiency and accuracy of the search functionality.

Initial Design

Initial Design

After Iteration

After Iteration

The benefit is a more streamlined search process, saving time and reducing the effort required to find specific profiles.

The benefit is a more streamlined search process, saving time and reducing the effort required to find specific profiles.

Iteration

Iteration

Moving the "Add" button from underneath the table to above it. This change aimed to make the interface more intuitive and highlight the key action of adding new data to the profile.

Moving the "Add" button from underneath the table to above it. This change aimed to make the interface more intuitive and highlight the key action of adding new data to the profile.

Initial Design

Initial Design

After Iteration

After Iteration

Users found the new placement of the "Add" button above the table much more intuitive. The benefit of moving the button is that it improves visibility and accessibility, making it easier for users to add new data to their profiles and enhancing overall usability.

Users found the new placement of the "Add" button above the table much more intuitive. The benefit of moving the button is that it improves visibility and accessibility, making it easier for users to add new data to their profiles and enhancing overall usability.

Key Learnings

Key Learnings

  1. Brand Consistency: Ensured every screen aligned with the client's branding guidelines, reinforcing a cohesive and recognizable user experience.

  2. Iterative Design: Regular stakeholder feedback helped refine layouts and interactions throughout the design process.

  3. Clear Information Hierarchy: Organizing content effectively improved readability and reduced cognitive load.

  4. Design Within Constraints: Learned to balance business requirements, technical limitations, and user needs while maintaining usability.

  1. Brand Consistency: Ensured every screen aligned with the client's branding guidelines, reinforcing a cohesive and recognizable user experience.

  2. Iterative Design: Regular stakeholder feedback helped refine layouts and interactions throughout the design process.

  3. Clear Information Hierarchy: Organizing content effectively improved readability and reduced cognitive load.

  4. Design Within Constraints: Learned to balance business requirements, technical limitations, and user needs while maintaining usability.

Challenges & Trade-offs

How might we improve the search functionality to make it faster and more intuitive for users to find specific profiles?

This question focuses on enhancing the efficiency and user-friendliness of the search feature.

Reflection

This project reinforced that successful UX design isn't always about creating something entirely new—it's about making thoughtful decisions within real-world constraints. By balancing user needs, business goals, and branding requirements, I was able to deliver a solution that was both functional and aligned with the client's vision.

Prototype link

Prototype link

Next Project

Next Project

B2C

Transit

Making Invisible Money Visible

Helping users understand the difference between Online Balance and Card Balance in Bharat Yatra.

B2C

Transit

Making Invisible Money Visible

Helping users understand the difference between Online Balance and Card Balance in Bharat Yatra.

CONTACT

Let’s have a word?

Email

hanufaislamdesign@gmail.com

View my profile

View my profile

CONTACT

Let’s have a word?

Email

hanufaislamdesign@gmail.com

View my profile

View my profile

CONTACT

Let’s have a word?

Email

hanufaislamdesign@gmail.com

View my profile

View my profile

Create a free website with Framer, the website builder loved by startups, designers and agencies.