Revolutionizing Reporting

TIMELINE

September 2020 - August 2021

PLATFORM

Web Application

MY ROLE

Senior Product Designer

THE CHALLENGE

Crafting solutions with the user in mind

BetterCloud is a company that specializes in providing a SaaS management platform. Their platform is designed to streamline various IT tasks by automating processes such as onboarding, offboarding, and mid-lifecycle changes.

My objective was to design an intuitive reporting interface that enables users to easily analyze their data, thereby empowering them to take action to simplify and automate all their SaaS software.

The current system at BetterCloud did not have a reporting feature which was a large pain points for users who could not get their data out of the product. As a Senior Product Designer, my goal was to deliver a reporting feature that would ultimately allow users to make informed actions to aid the overall health of their SaaS environment.

Our High Level Goals:
  1. Simplicity to data - Delivering a simplified reporting experience that differed from the problematic and over-saturated data grid approach that was in the current application.
  2. Feature for the people - Mimic our popular legacy reporting feature with an updated, more user-friendly experience.
  3. Evolve for the future - Creating this reporting feature would help us depreciate our old grids, help give our data a secure storage system, and provide users with confidence that the data delivered is quick and accurate.

Users and Audience

The primary users of this feature would be the customer IT administrators and security teams who use BetterCloud. These users will help automate their SaaS environment by building out reports to create alerts and workflows.

My Role

Role - Senior Product Designer, User Researcher, Interaction Designer, and Visual Designer.

Scope of Work

Artifacts Created: Research findings document, personas, user flows, task flows, low and high-fidelity designs, and usability test findings document.

The Process

Trust the Process

At AWS, we adopt a design delivery method that integrates crucial phases: Discovery, Concept, Detail, and Deploy—for all our projects.

In this project we used:

  • Discovery - Understand users' needs and problems they face
  • Concept - Gather insight from the Discovery phase to further define challenges
  • Detail - Detail designs from Define-phase challenges and collaborate with a team of designers and project stakeholders
  • Deploy - Test and improve on solutions
Discovery

Understanding the user helps define the problem

Before I can begin designing, I need to better understand the user's perspective, leveraging two types of research methods, primary research (stakeholder interviews, internal interviews) & secondary research (competitive analysis).

Research Deliverables:
  • Research plan
  • Moderators guide
  • Stakeholder interviews and requirement gathering
  • Competitive analysis

Stakeholder interviews and requirement gathering

Before I can start on my stakeholder interviews I always conduct my own "pre-research work". This work includes studying past interview and statistics created about reports previously that could assist with helping me shape the correct questions during user interviews.

The interview script goal was to understand the following:
  • What various pain points were endured by not having a reporting feature.
  • What a reporting system could do to help remediate current struggles.
  • What our legacy reporting system does well, what the reporting system did not do well, and how we can migrate or remove these to our new system.
My main findings:
  • Pain Points - Users found that using the data grid became unmanageable and some data points were not visible without having to manually click on each item, so if a user had millions of items, this became unsustainable.
  • Pain Points - The BetterCloud application was very limited in ingesting certain data. While users needed specific items, it was near impossible for the current application to get it out of the system. An example would be: which users were forwarding their work email to their personal email.
  • Opportunity - Users wanted a reporting section that provided both canned reports and custom reports, similar to our legacy product.
  • Opportunity - Users wanted a reporting system to help them understand their data and give them insights before they decide on automating it.

Did you know?

Prior to joining the team, BetterCloud's UX department did not have a cohesive design process and team members were scouring the web for various templates that did not mesh well together. I was able to create and share my process, which uses both primary and secondary research techniques, with the design team which was adapted for all BetterCloud projects.

Concept phase

Data informed approach

After presenting my research data to my stakeholders, I am ready to begin concept designs. My concept designs prioritize the main uses cases I discovered through my research.

Concept Deliverables:
  • White boarding sessions
  • Task Flows and User Diagrams

White boarding sessions

I organized multiple working sessions with stakeholders who joined in on collaborating on ideas for the new reporting feature. During these white boarding sessions, I would identify the specific workflows I could tackle for the MVP, allowing my team and me to align on specific flows that I could expand on through designs.

Due to the COVID-19 pandemic, these sessions were different than usual. I used a tool called MIRO that assisted in the collaboration of a large number of users at once.

Task Flows and User Diagrams

During the whiteboarding sessions, I developed and refined key workflows based on the strategies we formulated. This process yielded significant insights, mainly the identification of optimal workflow designs that were not only feasible for our team to build but also capable of delivering an exceptional user experience.

I identified three task flows that I would create designs for our MVP of reporting:
  • A user flow on how to access reports in the application.
  • Users selecting a canned report and being able to run that report.
  • IT administrators giving reporting privileges to other users so they can access and run reports.
Design phase

Data-driven design fueled by extensive research

With requirements set and extensive research completed, I begin designing with the final deliverable being high fidelity wireframes that would be implemented by my development teams.

Design Deliverables:

Sketches

I tend to create my initial designs in my notebook because I find that I can quickly iterate using paper and pencil. This is important because you can quickly redesign the task flows without committing to a final design, reducing stress, time, and avoiding design debt.

Wireframes

Once my designs had not changed drastically I began to wireframe my designs with BetterCloud's design language. I build low-fidelity wireframes to review and approve with my team and then move towards high fidelity wireframes and see if BetterCloud's current components can support the new reporting feature or if there is a need to contribute a new component to achieve the best experience.

For this reporting feature, I contributed a card design (new feature) that would be used in addition to a list view (existing feature) to display the canned reports that a user has available in the BetterCloud application. Card design is now a feature available throughout the entire BetterCloud system.

Deliver phase

Validate and iterate

Once my designs were reviewed and validated, my efforts quickly transitioned to creating concept tests to get customer feedback about my designs to iterate, if needed, before passing off my designs to be built by the development team.

Develop Deliverables:
  • Concept testing and report

Concept testing and report

My concept test consisted of a scenario and two tasks that users would walk through and provide feedback. I would evaluate my designs using UX measurements like time-on-task, ease of use, and user satisfaction. Because this was a new feature without previous benchmarks I used the averages from my internal usability tests to build out benchmarks that I would use when doing customer usability testing to give myself an understanding of how well the designs succeeded.

Concept Test Stats:

Task 1 - Finding email with forwarding report and running the report:

  • Time on Task: Avg: 8.53sec, Fastest: 4.8sec, Slowest: 15.82sec
  • Ease of Use (scaled from 1 not easy - 5 very easy): 8 users considered the task very easy(5) and the remaining 3 considered the task easy(4)
  • User Satisfaction: 95%

Task 2 - Can you update the "Report Level 1" role to grant full Google reporting privileges:

  • Time on Task: Avg: 25.53sec, Fastest: 23.5sec, Slowest: 28.82sec
  • Ease of Use (scaled from 1 not easy - 5 very easy): 8 users considered the task very easy(5) and only 1 considered the task difficult(2)
  • User Satisfaction: 91%
REFLECTION

Outcome

After completing the usability tests and confirming my designs for reporting I was ready to dispatch designs to the development team to begin work for the quarter. Due to the unforeseen departure of key development leaders, I had to make some tough design decisions to work with the available developers. Scoping down and pivoting our designs is not a rare occurrence in our field, so we have learned to do so while still providing value and integrity to our users.

Key Takeaways

  • Create a Strategic Plan to Launch an MVP - Strategizing helps us stay on task and deliver products on time even when new challenges are thrown our way.
  • Validating Designs Through Customer Feedback - We were able to run a usability test that validates the research and designs to prepare for the development of our new reporting feature.
  • Creating Templates Gives More Time - Templates help me organize my efforts and provide more time to work on key elements of the reporting feature.

More to explore

UX/UI
Web app
Mobile app
Team Lead
B2B

Industrial Enterprise Revamp

Elevating User Experience to Meet Industry Standards

View case study
UX/UI
Web app
Team Lead
B2B

Connectivity Unleashed

Connectivity Unleashed: The API Integration Connector Case Study

View case study