OpsPanda Sales Resource Planning Tool
Tintri Redesign
Unified Experience
Standardize UI framework, unify user experience consistently across all Tintri products
Background
Tintri products provides storage solution for data virtualization, designed for enterprise cloud, virtual machines and containers. The core product lines include:
1. Tintri Analytics (Cloud -based predictive analytics application to allow users to have visibility into every application),
2. Tintri Global Center (Console allows user to set policies for quality of service, cloning, snapshots and replication at the application level), and
3. VMstore (a storage system management application that simplify management in data center and cloud environments).
Overview
My Role
Lead UX designer of TGC & VMstore
Target User
Virtualization & Storage Engineers
Product Category
Data Storage Solutions for Enterprise Cloud
Length of the Project
Oct 2016 - Oct 2017
Goals
Standardize navigation system, UI framework, unify interaction design consistently across all Tintri products (Tintri Analytics, Tintri Global Center, VMstore).
Overview
01.
Improve overall framework structure & interaction flows
02.
Design unified input access for invocation
03.
Create interaction patterns inside the layer
Problems
Process + Solution
Based on research studies and the audit of existing products, I came up with a list of design guiding principles to help internal teams focus on the same UX direction, and created a new UI shell that adopted the same design principles that expand the horizontal space and create unity across all products.
1. Simple, Unified & Consistency
Eliminates the complexity of storage management and let users focus on what’s most important. Unify experience across all applications by simplify & streamline navigation flow. Enable clear information hierarchy & identify common interaction patterns to apply best practice experience.
2. Emphasis brand voice in boldness
Strong contrast with a touch of sophistication and high contrast colors to demonstrate the character of Tintri which never shies from tough problems and actively seeks unconventional solutions.
Early Sketch / Low-fid wireframe
1. Which navigation menu works best with configuration wizard flow?
2.. Which navigation menu works best with large data table?
3. Which navigation menu works best with other Tintri product?
New UI Framework
We applied the new horizontal navigation framework and design patterns to “Tintri Global Center” & “Tintri Analytics” to ensure consistency across both products.
Use Case 01
Visual Mocks
Tintri Global Center
Tintri Analytics
Use Case 02
Combined VMstore with Tintri Global Center
With Tintri Global Center, users can see all their storage systems and be able to monitor performance, configure storage capacity & protection policy in a single pane view by selecting any storage system from the list (on the left panel) and view the details (on the right panel).
VMstore health performance in Tintri Global Center
VMs from a single VMstore in Tintri Global Center
New Service Group creation flow for VMs performance monitoring, protection policy and storage capacity policy per Service Group in Tintri Global Center
VMstore Hardware View in Tintri Global Center
Recommended Works
OpsPanda Sales Resource Planning Tool
Tintri Redesign – Unified Experience
OpsPanda Sales Resource Planning Tool
OpsPanda Sales Resource Planning Tool
Google Assistant Mobile Framework