Periscope Redesign 2016
Product
Periscope Data is an end to end BI and analytics solution that lets you quickly connect to your data, then analyze, visualize and share insights.
It is a fast and powerful platform for data experts, where they can use SQL, Python & R language for advanced analytics operations while business professionals use simple drag & drop tool for BI reporting.
History
When I joined the company, the product was a single page application serving about 100 Small-Medium (SMB) customers. We had just raised the first round of funding, and the founders were interested in taking this opportunity to expand the product to fulfill their future vision that included expanding user base from SQL (technical) to non-SQL (non-technical) users.
The product consisted of 3-4 screens serving the essential features. The dashboard page and the editor page where analysts could write the SQL query were the two key screens. The current structure and architecture made it difficult to serve more features. The administrative options were minimal. My responsibility was to take this nascent product and set it up for future capabilities.
Structural representation of the pre-redesign screens
Goals
The goals of the redesign were to
Set up the product for future expansion.
Make sure that all of our core workflows remain intact.
Make way for new task flows in the product.
Lay foundation for the UX Design style guide.
Role
I joined the company as the first UX Designer and led the charge of redefining and redesigning the tool. The team consisted of me, 1 Product Manager, 5 Engineers. My stakeholders were our Head of Data, CTO & CEO. This effort took 6 months (Sept 2016 - Feb 2017) from inception to execution and ship.
Users
I kicked off the project with User Research. Fortunately, we had a good customer base to gather the required information. Product users are highly technical. The research helped draw out the personas that weren’t too dreamy and defined our core user types, i.e. the Data and Business Analysts.
Data Analysts
Our core and the primary user is the Data Analyst. Well versed in data, this role often knows business intelligence and analytics tools that pertain to the position and applies analytics to analyze various aspects of the business.
They are experts in managing and analyzing complex data. They can also perform a range of data blending and data preparation tasks, and create dashboards and data visualizations.
Business Analysts
Our secondary persona for the tool is the citizen analyst. Citizen analysts are primarily subject-matter experts in a specific area of business, e.g., a business analyst focused on risk or fraud, a marketing analyst aiming to build out new offers or someone who works to drive efficiencies into the supply chain.
These users leverage their analytical mindset to build out reports for their teams to make data-driven decisions.
Design Principles
My next step was to lay down some ground rules for the design. Our product values also influenced these principles.
Journey
For four months, I ran two-week design sprints. Monday started with the PM stating the goals to be achieved by Friday. We created a pool of test participants internally and requested some of the customers to act as advisors for the redesign changes. Our data analysts served as an excellent source to ensure a data-informed approach to design. It was a tremendous collaborative effort, taking constant feedback from our engineers and data analysts and a weekly critique session with our CEO & CTO.
Challenges
One thing stood out while speaking to many of the users - they were pleased with the product. The tool allowed them to go their job done without any hurdles, fast and made them powerful. The tool was helping them be successful. This sentiment was extremely satisfying to hear, and at the same time, I realized it would be my biggest challenge.
In any redesign, there is always a chance of ruining it for people who have a strong resistance to change.
redesign Highlights
IA & Core Workflow
The first undertaking while the user research was underway, was to map the user flow, their touchpoints in the product and identify gaps.
Information Architecture definition underwent a similar exercise of multiple rounds of card sorting exercises held internally and externally to ensure that experiences are intact and follow the workflow definition. Once the IA was defined, we used it as a benchmark to plan our roadmap for the design and development execution.
Dashboard
For any Data Analysis tool, a Dashboard and its structure is its identity. Data Analysts visualize their analysis in the form of charts and place it on a Dashboard that becomes a platform for their narrative. These dashboards are widely shared and viewed by executives and stakeholders on an everyday basis.
Our dashboard functionality was satisfying to our users but lacked in flexible and powerful capabilities. I referred to reading materials and learnt about best practices for Dashboard presentation and applied that to the design proposals.
Some of the notable changes made to the Dashboard were:
A flexible and customizable layout that would allow dashboard authors to be in charge of the dashboard flow and narrative.
In addition, we gave our authors the ability to add text on dashboards that would allow a story to be told alongside the data. This helped them make dashboards more usable and shareable.
We made the chart creation, edit and save flow seamless and reduced any friction that might hamper the most common and core workflow.
We built in affordances on the dashboard to encourage engagement and interactivity.
SQL Editor
Our Data Analysts are our superheroes. We want them to be highly successful and engaged in the product. All of our analyst users spend ~80% of their time in the editor environment. This screen is one of the essential pieces of UI. Pre-redesign world, the Editor was a timid and weak screen which lacked in functionalities that were essential to the user’s task. As we thought about the flows, it became evident that we need to enrich the Editor with additional functionality and support that with mindful design.
Some of the notable changes made to the Editor were:
Revised the Editor UI structure into a 3 column layout.
The data specific details were to the left, area to code and view previews went in the center, and object-specific information went to the right.
The restricted single-column, fixed-width pane for SQL querying was redone with flexible width layout do users could custom select their environment.
One of the most significant pain points identified from the user research was the inability to view the query and the result simultaneously. We rectified that by moving the chart preview below the query and configurations to the right.
Overall the screen and the experience was optimized in terms of the reduced number of clicks to fulfill a task, and it also encouraged ad-hoc analysis.
Navigation
The navigation design was sub-optimal and designed for a small subset of objects. As our customer base increased, I wanted to ensure that a navigation structure that supports the increase in quantity. Also, the navigation needed to be accessible from all the pages to provide a frictionless transition between screens.
The Information Architecture was the foundation for the navigation structure. We moved from a top-down to left heavy navigation. This structure also opened avenues for us to equip object titles with supporting details on demand. We wanted our users to be able to gain as much knowledge about the object before committing and navigating to the object page.
Administrative Tools
As part of the redesign project, we identified many product gaps for the administrator user group. After the culmination of the design for significant flows, I shifted my focus to the administrative tools used for monitoring and management purposes. We also revamped our User Permissions feature and added a whole new section “Settings” as a home to all of these pages. The constraints of the design continued to be to ensure that the structural integrity of the pages remains intact.
Outcome
The redesign was rolled out 300+ customers in batches. Each rollout anticipated mixed feedback expected from any change. There was a lot of positive and encouraging feedback from our steady customers. We set up dashboards to monitor usage to measure outcomes.
As a next step in capturing feedback from our customers, we designed and shipped an NPS survey form. To this date, we use NPS as one of our feedback channels and reach out to customers.
Learnings
Re-designing an entire product in a six-month timeline, with a team strength of 7 people required heavy-lifting! We conducted a post-ship project retrospective to talk about our success and failures. My constant feeling throughout the project was that we were rushing things without pausing or taking a breather. A lot had to be done in less time and our fall back was “ We can always improve it later.” In retrospect, I think careful planning would have resulted in a better quality of work with similar velocity.
Change is inevitable when we talk about the re-design. The key is to make the transition as smooth as possible. Onboarding experiences, email content informing about the change, publishing blog posts to communicate about the motivations are some of the strategies that help a long way. We lacked the big announcement and suffered some consequences as a result of that.
Since then, we have learnt two valuable lessons; 1) to ship in phases and 2) to always keep customers involved in the change process.