top of page
Shape.png
Knowledge Navigator.png
1.png

Knowledge Navigator is a BCG internal search engine for BCGers to obtain knowledge to drive case/proposal success.

Challenges & Goals

The project is to refine and further enhance the Smart Search experience launched in 2018, in order to increase user utilization and satisfaction. We aim to design a search experience that provides users with ‘Best Answer’ for searches in the new Knowledge Navigator. To get there, we need to achieve the following two goals.

1

Enhance the Smart Search Experience 

by enabling increased content coverage, improved relevance, persona coverage, and tech delivery

2

Enable a coherent product experience 

by ensuring a seamless and easy-to-use experience for all target users to navigate, consume, and share rich BCG knowledge 

My Role
Mar. 2020- Jun. 2020
(3 months)

I played a key role in redesigning the Smart Search experience and delivered further intuitive and smarter interfaces. Specifically, I conducted two rounds of interviews and testing, visualized improved and validated interactions, and delivered high fidelity outcomes ready for launch by working in rigorous research and agile design process.

​

Key Deliverables: User Interview Conduction, User Journey Mapping, User Testing, UX Audit, Exemplar Analysis, ​Wireframe, UI and UX, Animated Prototype for Micro-Interaction

Problem | Low Usage of Existing Design
Problems.png
Delivered New Experience

_____

Improved Interfaces in Key User Flow

I have delivered interfaces across the four key user steps of the searching experience and those steps cover all the features and interactions we need to redesign to enhance the Smart Search experience. For highlight, there are more than 20 micro-interaction designs that include in those interfaces to serve a coherent search and results consumption experience. The following section demonstrates some of the demos and animated interactions.

Flow_1.png
New Design, Enhanced Experience

I delivered animated prototypes in Principle for each of the new features. It's critical to provide explicit documentation to accurately communicate the interactive models with other team members, especially with the engineering team, to ensure the right implementation and reach the ultimate goal of reducing search frictions and improving user usage.

* In the following session, the improvements are highlighted with the pink boxes alongside the old design 

1. Search Initiation - Search Bar With Auto Suggestions

Idea

​

Auto-suggest search experience accommodates multiple content types, while dynamically displaying number of results, within each suggested search term suggestion

​

Benefits

​

• Provides instant feedback on the relevance/accuracy of search terms

​

• Reduces the need to refine a search result, after the initial search of a keyword/term

New Design Demo with Micro-Interactions

Before and After Comparison

Improvement

PORTA - IS2 .png
U1.png

Before

After

2. Search Initiation - Advanced Search

Idea

​

Quicker access on the homepage, for power users to start searching with advanced parameters

​

Benefits

​

• One search experience combining the specific search parameters, as well as providing additional filters to refine for more accurate search results

​

• More visible hierarchy to switch between initiating search for a specific content type

​

New Design Demo with Micro-Interactions

Before and After Comparison

PORTA - IS2 .png

Before

Improvement

11.png

After

3. Search Result Presentation - Result Presentation/Expand View

shadow.png

Idea

​

Refined design approach to organize the content in both expanded and collapsed views that resonate with the overall Smart Search result page experience

​

​

Benefits

 

• Users have more visibility on documents within each material result module

​

• Micro-interactions allow for users to have primary, secondary and tertiary actions to work with one another rather than compete for space and layout

New Design Demo with Micro-Interactions

Before and After Comparison

2Presentation.png
12345.png

Before

After

Improvement

4. Search Refinement

Idea

​

Simplified filters and display parameters to allow for more search results to be displayed. The new layout maximizes filters and display parameters that are currently most used

​

Benefits

​

Users can refine their search with less visual clutter on the top section of the results page


Filters displayed will be the top filters used by users on Smart Search

​

• Exposed overlay of advanced filters allows users to filter and see results automatically updating in the background

New Design Demo with Micro-Interactions

Before and After Comparison

2Presentation.png

Before

Improvement

123456.png

After

5. Result Consumption

Idea

​

Pinning documents can now be stored in folders for users to save documents that they’ve searched

​

Benefits

​

Users value a pin experience that can save documents that they’ve already downloaded

 

Enabling folder creation will provide more engagement of the pin feature, as users want to be able to organize how they’re consuming results that they want to save for later

New Design Demo with Micro-Interactions

Before and After Comparison

4Consumption.png
1234567.png

Before

After

Improvement

Achievements

Utilization rate “weekly searches” from ~25k to ~80k

Satisfaction rate from 74% to 80+% 

Documentation of the Launched Product 
PROCESS

_____

User Needs Identification

 

Problem Mapping

Design Audit

Workshop & Synthesis

User Interview

Ideation

​

Exemplar Analysis

Feature Ideation

​

Design Process

​

Wireframe

User Testing

Quant Servey

Interface Design

Delivery

​

Screens for Desktop & Mobile

Animated Prototypes

​

IDENTIFY USER NEEDS

_____

User Problems and Mapping
Screen Shot 2021-02-14 at 1.42.50 AM.png
Design Audit
Identify User Flaws

I conducted UX audit to understand the current flows thoroughly and pinpoint less-than-perfect user steps. Later on the learning share-out, we discussed and highlighted the parts of the flow that are causing headaches for users and stymieing conversions. Those audit learnings are included in the later interviews to be further investigated.

Teardown.png
Workshop and Synthesis

After the design audit, we collaborated and ran workshops with KN experts to synthesize all previous research and learning by clustering themes into things “we know”, “we assume” and “needed to explore”. Later, I brainstormed and worked together with the team to reorganize the synthesis outcomes and build our interview plan upon it. 

Product Audit Brainstorm_Page_2 1.png

What we know

What we assume

​What we don't know & need to learn

User Interviews
Pinpoint User Problems

With the synthesis learning in mind, we applied a rigorous process to identify user frictions and test new ideas during the first round of interviews. We ran 60-min interview with 57 BCGers - our target audience - in the following three practices:

​​

  • General discussion to understand & evaluate intent on KN platforms 

  • Shadowing walk-through to investigate search pathways by use case

  • Card-sorting activity to understand the importance of proposed/existing features and to co-create enhancement ideas

Research - Frame 1.jpg

100+

Frictions & Opportunities

50+

Ideas/Concepts

Identified Top 3 User Barriers

We walked out of interviews with 100+ frictions and opportunities and 50+ ideas/concepts to start our ideation phase, and all those learnings were the main factors driving our design directions.

80%

users

Resorting to manual workarounds/ triangulation through personal knowledge and network if no useful result returned 

75%

users

Poor discoverability with hidden tools/ taxonomy that can help enhance search effectiveness

60%

users

Lack of confidence in the quality of the search results and system inconsistencies that limit users from leveraging existing expertise

After Design Audit, Syntheses and Interviews, 4 User Steps and 10 Feature Areas Have Been Defined
After interview syntheses, we broke down the search experience into four primary user steps with ten feature areas. To conduct each the building process inclusively and effectively, we set our interview guideline and testing practices against those four user steps and ten features to test, validate, ideate, and redesign. The four steps and ten features as defined below.
icons.png
icons.png

Search Initiation

  • Search intention

  • Search alternatives

Search Result Presentation

  • Content types

  • Scanning options

  • User types

icons.png

Search Result Refinement

  • Filtering systems

  • Filter suggestions

icons.png

Search Result Consumption

  • Result previews

  • Saved search

  • Feedback loop

IDEATION & DESIGN PROCESS

_____

Exemplar Analysis

I have benchmarked best-in-class exemplars to establish north-star visions and used them as inspirations to sketch out ideas for previously defined feature areas.

Screen Shot 2021-02-14 at 8.17.25 PM.png
Wireframe

I ideated and designed wireframes for each of the features that we need to improve and use them to drive user testing.

Click the Arrow Button to explore all wireframes
User Testing | Qual Research

I used the wireframes to facilitate multiple user testing interviews over Zoom to get feedback on the UX solutions. Firstly, I showed the wireframes and gathered initial reactions during the beginning of the testings. Then, I conducted card sorting and solution ranking practices to ask users to prioritize the wireframe solutions that might replaceable or serve similar search intentions. Hence I can narrow down the solutions and hold a clear UX direction towards the final design.

Popup.png
Interview zoom.png

A screenshot of through Zoom screen sharing to walk through wireframes and gather direct feedback in detailed level from users

A view of the feature ranking board I applied for user desirability testing. I ask users to rank the presented ideas based on their searching needs in order to refine design based on what is desired.

Quant Survey | Quant Research

Besides the moderated Zoom user testing, we also ran surveys on Adobe Analytics for the wireframes and ideas to get a quantitative feature resonance to validate value props and prioritize our features. With over 500 quantitative testing results, we extensively tested our feature solutions. Combining with the results from qual testing, I complied a set of features with a clear execution plan towards the final experience. The image below shows the ranking of the top five features out of the quant survey.

​

* Feature ranking in the scale of 1 to5, 1 as being most helpful and 5 as being least helpful.

Servey2.png
Survey1.png
Servey3.png
New KN Began to Be Launched in Phases Starts From  Nov. 2020
Get a sneak peak of the delivered experience via the launch video
bottom of page