1010data - DSCVR Platform
August 2017 - October 2019 (Shipped)
Web App, UI/UX Design, User research
A cloud-based big data analytics platform for the everyday data analyst: live site ↗
In 2017, 1010data launched a new project to create a self-service platform called DSCVR that would utilize the powerful analytical backend that 1010data was known for. The goal was to create a tool for the everyday data analyst that would allow them to analyze big data at ease. I was part of the original team that designed the product from conception to the functioning platform today.
DSCVR was launched to market in July 2019.
To comply with my non-disclosure agreement, I have omitted and obfuscated confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of 1010data.
“My personal anecdotes and thoughts will be in quotes and in blue”
Tools
Sketch
Figma
Atlassian JIRA
Atlassian Confluence
Adobe Creative Suite
Javascript
Skills
User research
User interface design
User experience design
Enterprise software design
Written and verbal communication
Design Critique
Team
Som Liengtiraphan (Design)
Ing Shaun Siek (Design)
Shawn Curran (Product Manager)
Brad Orego (Design Researcher)
Sarah Sutto-Plunz (Software Engineer)
And many others
Above: This is the current analytics page for DSCVR. It consists of 2 main components: a timeline that records your analytic steps and a grid that showcases how your query is changing the data
Impact and Contributions
Contributed to the design of DSCVR at every step: research, design, development, launch
I conducted user research, created personas and user flows, designed wireframes, coded prototypes, tested designs for usability, and ensured design quality during the development phase.
“On the side, I was also a member of the social committee at 1010data. I was able to help organize trivia nights, scavenger hunts, and happy hours. I also made tons of advertisement posters that flexed my visual design skills. It really helped me realize my love for organizing events.“
Projects Owned
The following is a shortlist of projects that I owned and shipped during my time on the DSCVR project.
DSCVR Support Portal
A portal to facilitate self-education and questions about DSCVR Platform. You can read my case study about the DSCVR Support Portal here.
Chart Style Editor
A feature for the charting operation for all worksheets. Users are able to customize their charts by adding titles, data labels, color, and etc to the charts. Each chart type will have customization options.
Column Statistics
This feature helps users to have a fuller understanding of the data in their columns. Statistical information differs depending on the type of column it is.
Worksheet Interactions
These interactions aid a user during their analytical process. Columns can be formatted quickly to a user’s specific criteria without code. Shortcuts to common data analytic actions are embedded into right-click menus.
Import Manager
This manager controls all incoming information into a user’s DSCVR profile. Users can import data locally or by connecting to a cloud source. Data can then be pre-formatted and cleaned so analysts can start analysis immediately after the data has been fully uploaded into the system.
Above: This is the homepage page for DSCVR. It consists of 3 main components: a data uploader, a recent objects panel, and an object manager of your data and queries.
Problem Space
How might we create a self-service big data analytics tool for the everyday data analyst?
In recent years Big Data has become an increasingly popular field, fostering a crowded marketplace of tools to support it. However, for most tools, the only way to interact or analyze your Big Data is to write scripts in query languages.
Our high-level goals were to:
Break down the barrier to entry for getting started in Big Data analytics.
Design an application that puts the needs of analysts at the forefront.
Create an application that combines 1010data’s powerful analytical backend with modern web technologies.
“Though the project scope may have a few times over the years that I worked at the company, these high-level goals for the project never changed.”
User
“The following is an example of a user group we designed for. Specific use cases and goals have been obfuscated per my non-disclosure agreement“
Data analysts
Data analysts want to be able to find answers to their questions quickly and correctly and share them with managers and stakeholders with ease. They are most at ease using Microsoft Excel, Google Sheets, or other non-coding data analytics tools. However, with many data sets siloed in large cloud-based databases, trying to get access to them can be difficult and complicated. Learning a programming language is time-consuming, and can lead to mistakes in calculations if improperly used. Data Analysts, thus want a tool that will allow them to continue to do analytics in the way they are comfortable with, but at the scale and integration that Big Data allows.
Design Process
Research
What is the problem? What do we need to do to solve it?
Methodology
Our process always began with a presentation of a problem. Product and design would debate the problem scope, which would determine what kind or if user research was needed.
If research was needed, methods we used to collect information included interviews, surveys, card sorting, competitive analysis, and user observations. Outside direct research, we regularly talked to customer success and sales team regularly about problems the user had and discuss how we iterate on those designs.
Testing and Review
If a workflow or interaction is particularly complex, the team would conduct usability tests on them to determine if our designs are moving in the correct decision. We try to conduct these tests early on, on either low-fidelity prototypes or paper wireframes as we find that high-fidelity wireframes sometime distract the user from the actual workflow.
Above: Examples of different research practices that we have employed. Pictured here are user personas, user journey mapping, and competitive research.
Information Architecture
The foundational step of all my designs.
Most will start on paper or whiteboard to reduce any preciousness and allow for lots of feedback and iterations. Once validated, it will be produced digitally so it can be attached to the documentation package for the development phase.
Above: Examples of different workflows I have created.
Sketches and low fidelity prototypes
Generating ideas and coming up with multiple solutions that are easily discarded
Once the workflow is approved, I would start sketching on paper. This initial sketching phase tends to be very collaborative. I like to work with the other designer on my team to come up with as many ideas as possible.
After sketches are approved, I would create the wireframes digitally. Initially, we created all our wireframes on Sketch. However, we moved all our designs up onto a cloud-based platform, Figma, in early 2019. This platform made sharing, iterating, viewing design history, and commenting much easier for us.
P.S: Figma is amazing! I highly recommend it to anyone.
Above: Our decision to move to the cloud greatly benefitted our team. Not only did the platform perform better on large files, but the sharing and comment feature is also crucial to the daily workings of the team as most of our engineers are remote.
Interactive, high-fidelity prototypes.
Polished and ready for development
The final prototype will contain all the information needed to start development. Sometimes, prototypes will be interactive to highlight a specific behavior or animation.
Documentation
Clear communication and my favorite part
At the end of every design project, I would create very detailed documentation for all my designs. These documentations will include design goals, measurements, color, typography, interaction, animation, etc. It is also important for me to do detailed documentation as most of our engineers were not in the same office, or timezone, as we were.
I find the documentation process very calming and a cathartic end to any design project. I actually enjoy doing them very much.
Above: An example of how I document and annotate finished features for both future design reviews and engineering development.
Development
Ensuring design quality
While there was definitely a line that marked the start of engineering and end of design, I refrained from a complete engineering handover. I instead worked with the engineers throughout the entire development process, answering their questions ad-hoc or even helping them to debug front-end code.
Above: The evolution of DSCVR from 2017 (left), 2018 (middle), and 2019(right). Click to view a larger image.
Final thoughts
My time at 1010data gave me invaluable experience in user research, experience design, visual design, and project management. I learned to work on a cross-functional team and designed a product from concept to launch.
I developed a robust T-shaped design skillset while I worked at 1010data, with my depth skill being product design. I am honored and grateful to one of two lead designers for the entire cycle of DSCVR, from ideation to public release. At 1010data, I was able to work with an incredibly diverse team of designers, product managers, engineers, analysts, customer experience experts, and marketing. Not only was I able to learn how to address each of their concerns in my designs, but I was also able to learn how to communicate effectively to make sure everyone was on the same page. As most of our engineering team was remote, I learned to write precise and clear documentation to ensure my designs were developed to the quality that the product needed. During my time at 1010data, I got to work with many engineers, managers, analysts, and sales representatives across multiple departments. Those experiences have made me a more well-rounded designer and have greatly humbled me.