Designing ways to zoom in and out of research data
UX DESIGN - UX RESEARCH - USABILITY TESTING
Let's start with the problem
During research, we realized people zoom-in and out of the research data available to them. They go back and
forth between call notes, the call recordings, the transcripts, and project highlights. But the product's information heirarchy didn't reflect that.
This case study only talks about the highlights page redesign with some references made to the product wide information revamp.
Old Highlight Page Design
The original highlights view in Looppanel required an overhaul after the introduction of projects and question script in the
product.
Old Design
First Release
Phase-I release of the new highlights page
New Additions
- Ability to add a call to a project directly from the highlights screen.
- Search and filter by tag & calls.
- Icons to signify a video snippet & a note.
Integrating project structure
Design Direction I: Questions in a side panel
I tried a variation where the question script of the project was in a side panel, and notes inside it on
the right, segrated based on calls.
What didn't work
- The mental model of projects > calls > notes/video snippets wasn't reflected in the design.
- Hard to see a lot of notes within a given question.
Questions on the left with notes on the right
Side menu for questions
Design Direction II: Questions at the top
To reflect the mental model of model of projects > calls > notes/video snippets, I designed the
following two screens to represent that.
What didn't work
- It was hard to visualize the entire question script or focus on a particular question.
- The new heirarchy of product didn't come out very well.
Call name at top with question inside
Questions on the left, with call name on top with note inside
Final Design based on testing
This version worked to a large extend since it reflected people's existing ways of zooming in and out of
their work.
New Additions
- Added questions from question script at top to reflect new flow of information in the product.
- Created a collapsible view for questions to help researchers focus on one question at a time.
- Ways to go into an individual call and view transcript text.
New analysis screen prototype
Summary view
To wrap up the entire experience, we made a summary view that could be shared with the team.
The first step is to start grouping notes, then selecting what insight to put it under. All of this can
be shared using a link.
Summary view
Changes across other parts of the product