Overview
Year
2017-2018
Role:
UX Researcher & UI Designer
Project Type:
Research Project
Tool:
Sketch, D3.js, Sketchup

Project Description:
We collaborated with IBM Research, and managed to develop new interfaces as one part of the Situation Room Infrastructure, which provides better environment for investors to make business decisions during the meeting.
Research Background
Situations Room Infrastructure (SRI) is the core of the technical innovations developed for cognitive and immersive rooms. This infrastructure enables multi-modal group-computers dialog, learning and understanding of group activities, reasoning, planning and facilitation of collaborative decision-making. The first use case enabled by the SRI is in the area of mergers and acquisitions. The technologies from the project have laid the foundation for all other CISL use cases."
Project Goals
Our team was asked to redesign the old Merger and Acquisition System from IBM. The new design will be easier to use and information would be more clear to understand in order to help business board members to make decisions.
Design Process
We applied design thinking to help us navigate the project and provide user-center design.
After initial reviews about the original interface with my peers, we identify a few problems as the starting point of the research,
Lacks of visual hierarchy. 
Information overwhelmed.
 User scenarios is not clear
 User flow is not clear.
Original UI Provided by IBM Research
User Interface - Immersive Room
The interface I worked on was what made this project is so special. Instead of the traditional mobile and web interface, I need to redesign the interface for this 360 panoramic display, which is the size of a large conference room. Additionally, users need to power this system using IBM Watson Assistant through a voice command. Therefore, I also need to consider conversation design to improve user experience for our users.

Quick view of the immersive Room

Original Demo of Immersive Room

interior View of the Immersive Room

Birds Eye View of the Immersive Room
Interview
We interviewed 8 potential users who are from business, finance background. Before the interview, we made various hypothesis about our users, set goals to uncover after the interview, and established the guideline to help use to make this interview effective.

Interview Hypothesis

What are we looking for?

Some prepared questions to ask during the interview

Some screenshots of interview documentations

Interview Takes Away
1. The new visualization should help people to collaborate as a team. 
2. Users should be able to extract useful and important information from the visualizations.
3. The visualization should be legible and readable, so users can read it from the screen. 
Sketch
In my sketch, the new visualization represents three more layers of information:
1) The size of circles is relation to the companies' revenues
2) The visualization will transform into a X/Y graph. The x-axis represents founded year. The y-axis represents the number of employees.
3) Users can highlight each nodes to select companies they are interested in. 
4) Users can also see detailed information of different companies. 
Wireframe
Initial Screen: Nodes are same size
Initial Screen: Nodes are same size
Nodes size changes based on revenues
Nodes size changes based on revenues
Tooltip for companies details
Tooltip for companies details
node graph transform to X/Y graph
node graph transform to X/Y graph
X/Y graph, X is founded year, Y is number of employees
X/Y graph, X is founded year, Y is number of employees
Highlight companies
Highlight companies
Add companies to decision table
Add companies to decision table
Let watson make a decision
Let watson make a decision
Interactive Prototype
Using d3.js, I created this prototype to demonstrate how the visualization in the immersive room changes from a node graph to a line graph.
Project Outcomes
1. This project is one of the most important demo to present at CISL every year. 
2. User testing showed the new added function help business investors to better understand the visualization. 
3. Many companies showed strong interests asking CISL to build Situation Room Infrastructure in the office.  
What I learned?
1. How to make a successful project in a collaborated environment. It is crucial to keep aligning with research and development team. Making playback is for good team work. 
2. Continues learning help me to understand research domain and manage to create real data visualization. 
3. User research is the key to identify users need and pain points. This help research results will be useful in the real world scenarios. 

You may also like

Back to Top