top of page

Rockhopper Solutions

PRODUCT DESIGN FOR SAAS STARTUP

OVERVIEW

Rockhopper is a start-up producing a SAAS collaborative annotation platform, helping finance and non-finance users streamline the completion of financial activities, and achieve alignment faster.

Our solution consisted of a prototype demonstrating the MVP, bridging the sender/recipient communication gap, and helping senders communicate asynchronously using walkthroughs, reducing the number of tedious meetings and allowing employees to reinvest their time.

MY ROLE

UX Researcher, UI/UX Designer

DURATION

Two week sprint

TEAM

Rebecca Lothan, Archana Penumudi, Nathan Hui

TOOLS

Figma, Trello, Slack, Zoom

Understanding our Users

RESEARCH GOALS

  • To understand the user journey of those working collaboratively on spreadsheets

  • To better understand spreadsheet sharing and communication pain points for sender and receiver

METHODS

First, we wrote our interview guide.Then we recruited 6 daily spreadsheet users who often work collaboratively. ​

 

We wanted to better understand both sender and receiver experiences and pain points, so we interviewed users with finance and non-finance backgrounds, working in different industries, and on different sized teams.

INSIGHTS

From our interviews, we identified four major categories that emerged across use cases, industry, and sender/receiver experiences, below. See our detailed affinity map.

4 of 6 interviewees use spreadsheets to achieve alignment between themselves and the recipient - they want to ensure their process is clear and transparent.

3 of 6 users prefer not to escalate to a call to achieve understanding if it can be avoided.

Communication is key

2

4 of 6 users feel document hygiene is really important, especially for coordinating the use of the document, and ensuring the recipients are using the document correctly.

Document hygiene

3

Concern with avoiding errors

When sharing, 6 of 6 senders worry something might happen to the document, so they'll either edit permissions, lock cells or even save an extra version to the desktop before sending; often leading to versioning concerns. 

4

Verifying data

4 of 6 interviewees want to know exactly what has changed in new versions, some expressed frustration with their software’s audit log feature.

 

4 of 6 interviewees felt frustrated they have to open up multiple programs to validate spreadsheet data.

Empathizing with Users

Next, we had to empathize with both the sender and recipient users. We created two personas, the spreadsheet sender, Grant, and the spreadsheet recipient, Remy. Afterward, we created two user journeys, tracing both Grant and Remy's distinct experiences of collaboratively working on the Q1 2023 Operating Budget.

Sender Persona Grant
grant.png

BEHAVIORS

  • Coordinates with other small teams of 2-4 people


  • Thoroughly reviews collaborative spreadsheet docs for changes and errors


  • Uses multiple platforms simultaneously to complete tasks and verify information

NEEDS

  • Clear data organization and communication 

  • A way to track changes 

  • To consolidate inputs across the organization

FRUSTRATIONS

  • Difficult to see changes made on the spreadsheet

  • Long meetings going over spreadsheets

  • Disorganized with team members

Sender Journey Grant Creates a Budget
Journey Map_ Grant.png

Grant feels frustrated when he has to flip back and forth between many platforms to aggregate and input data.​

Grant sends the doc to Remy, who is confused, and after DMing back and forth, he has to hop on a call to walk her through the spreadsheet, it ends up taking 30 minutes.

Recipient Persona Remy, the Marketing Manager
remy.png

BEHAVIORS

  • Recently promoted, and is being involved with financial planning for the first time at work

  • Rarely uses Excel

  • When she does use Excel, she feels a little confused

NEEDS

  • To understand financial assumptions

  • To make bigger decisions and plan in new role

  • FP+A support for resource approval 

FRUSTRATIONS

  • Disconnect between her and the finance team

  • Dislikes long meetings going over spreadsheets

  • Difficulty understanding income statement reports

Recipient Journey Remy Inputs Marketing Projections
Remy journey map.png

Market Positioning

Market Differentiation Research

Because one of our product goals was to ensure market differentiation, first, I’ll walk through a deeper dive into the most direct competitor, Smartsheet. We noted things we liked (pluses, the top of each box) and things we didn't, or felt were missing (deltas, bottom).

ACTIVITY LOG

Screen Shot 2022-12-10 at 11.50.09 AM.png
plus smartshet.png

Robust filtering options

delta smartshet.png

Pop-up on greyed-out sheet

Doesn't visually indicate areas of change

TASKING

Screen Shot 2022-12-10 at 12.29.40 PM.png
plus smartshet.png

Users can assign tasks, in-sheet, per row or group of rows

delta smartshet.png

Inflexible, user cannot  assign specific cells

Tasker cannot visually direct recipient's attention

COMMENTING IN CONTEXT

Screen Shot 2022-12-10 at 11.44.51 AM.png
plus smartshet.png

The organization and emphasis on providing context

delta smartshet.png

Doesn't offer the cell-level of granularity for annotations

SHEET SUMMARY

Screen Shot 2022-12-10 at 11.50.51 AM.png
plus smartshet.png

Admin user can input high level information in custom fields;

Helps orient recipient and provide context

delta smartshet.png

Cannot indicate specific cells in high level information

SHARING

Screen Shot 2022-12-10 at 12.21.01 PM.png

Sender can choose visual format for recipient

Limited to PM ecosystem

delta smartshet.png
plus smartshet.png
Feature Research

After getting to know our direct competition to ensure our product will stand out in the marketplace, we conducted a thorough feature analysis of indirect competitors with features we wanted to emulate. For this case study, I'll present a snapshot of two competitors we looked at: DocuSign to study their UI for user-guided walkthroughs, and TurboTax for their accessibility features for non-accountants.

DOCUSIGN

DOCUSIGN SENDER EXPERIENCE.png

Sender UI, creating the user-guided walkthrough.

  • Drag and drop tools for various fields

  • Option to create a tooltip

  • Sender can indicate recipient's attention within the doc, visually

turbotax 1.png
turbotax 2.png

TURBOTAX

Accessibility components we noted:

  • Business Glossary

  • Easily understood, branded language used throughout the site

  • Progress tracking, large goals are broken up into smaller tasks

Market Positioning Insights

Applying what we learned from our competitor's deep dive and feature analysis, we selected features to include to ensure Rockhopper occupies a unique place in the market.

Features

Smartsheet

DocuSign

TurboTax

Rockhopper

Notes / Insights

User-guided Walkthrough

Tasking

Activity Log

Internal Glossary

State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png
State=Checked.png

Identifying the Problem

USERS FRUSTRATIONS

Teams within organizations of all sizes use spreadsheets to communicate important information and achieve alignment. Current collaborative spreadsheet platforms are not designed to prioritize asynchronous communication, which can make working within a team confusing and time-intensive. 

 

Consequently, users are forced to suffer through tedious meetings that fuel low-value, high-volume back and forth. 

 

Because users are having difficulty achieving a mutual understanding across various teams and stakeholder groups, they need a tool that will promote accessibility, seamless communication, and standardized use of shared documents.

BUSINESS NEEDS

Rockhopper aims to design a more pleasant experience for these users by prioritizing collaborative features that only exist as an afterthought in competitor platforms.

 

To prompt users to transition from their familiar, but frustrating, workflows. Rockhopper needs a sufficiently engaging and robust UI to differentiate itself in the marketplace.

HOW MIGHT WE?

In our solution, we would need to negotiate both the user's needs and Rockhopper's business needs, we returned to our user journey maps and personas and came up with two questions to direct our decisions in the upcoming design phase. 

How might we allow teams to communicate clearly, facilitating offline collaboration and streamlining their workflow?

How might we build confidence that the document is being viewed, understood, used, and updated correctly?

Design and Test

PROCESS OVERVIEW + METHODS

In this section I'll walk through re-designing our first iteration of user flows for both Grant and Remy, collaboratively working through a financial report using Rockhopper. We based our user tasks and flows on Grant and Remy's user journeys, working together to complete a budget. We designed two sender user flows (Grant) and one recipient user flow (Remy). 

I'll present tasks, wireframes, and usability testing findings. We conducted moderated usability tests, using different interview guides and tasks, as well as 4-5 participants for each flow. Snapshots of findings will be split up into three sections for the three user flows we designed.

Sender Flow Grant assigns tasks to Remy to complete the Q1 2023 Operating Budget
Flow 1Spreadsheet tasking page.png

WHAT WE FOUND

  • 2 of 3 were confused about where to go at first

  • 1 of 3 tried to click black document to create task

WHAT WE DID

  • Clarified right and lefthand toolbar icons

  • Redesigned lefthand toolbar, changed black document so it stands out less

WHAT WE FOUND

  • 3 of 3 users went straight to the insight name instead of highlighting cells

  • 1 of 3 went to the left navigation bar instead of higlighting the task

WHAT WE DID

  • Made tasking more sequential

  • Created better text hierarchy

  • Made directions clearer, added tool tip

Recipient Flow Remy inputs Grant's requested information.
Flow 2Spreadsheet Task Incomplete.png

WHAT WE FOUND

  • 3 of 3 were confused by "Select Cells", weren't sure what clicking there would do

WHAT WE DID

  • Changed the wording to "Select Cells to Annotate"

WHAT WE FOUND

  • 3 of 3 users tried to click "Reviewed?" checkbox

WHAT WE DID

  • Changed "Reviewed" interface, removed the checkbox altogether, and indicated the review status on the following screen, with italicized text, which does not suggest/prompt user action

Sender Flow Grant reviews the report and hands it off to the CFO.
flow 3Audit Log filters.png

WHAT WE FOUND

  • 2 of 4 noted there was no exit filters, or clear filters option

WHAT WE DID

  • Added "X" to clear filters option, both on audit log panel and filters panel

WHAT WE FOUND

  • 4 of 4 were confused about the link icon

  • 3 of 4 weren't sure the difference between the "Share" button at the top and the link icon

  • 2 of 4 did not find audit log icon at first

WHAT WE DID

  • Got rid of the "Share" button

  • Added mouse-over text description for the righthand menu bar

flow 3 Sharing - Sent.png

WHAT WE FOUND

  • 4/4 felt the lock sheet and sharing should be separate features.

  • 3/4 were confused by the difference between “Lock sheet for future shares” and “can edit/view” permissions drop-down menu.

WHAT WE DID

  • Created "Document settings" righthand menu item, for document health and high-level overview information, where sheet locking features could be accessed.

Design and Test Insights

We took our usability testing insights and implemented the changes outlined above. We clarified the menu items on the right and lefthand menu, and also refined our UI overall, with a focus on cohesion.

We spoke with our client and walked them through our mid-fi prototype. Rockhopper wanted a demonstration of a Tags feature, a different way of organizing cell information, and a way to filter for different narratives, particularly useful for our Sender Flow for verifying information before hand-off. 

Hi-fi Design

RH Dashboard_ Remy.png

Moving Forward

After critically reviewing what we were able to produce, our user research and our business goals, my teammates and I outlined the steps to prioritize moving forward.

NOTIFICATIONS

  • Build out notifications page, re home page.

  • Admin users and recipient's view and capabilities.

ANNOTATIONS

  • Users can toggle on/off annotations

  • Admin user vs recipient view and capabilities.

MORE USABILITY TESTING

  • Validate first-round changes with additional moderated usability tests.

    • Ensure navigation is intuitive.

PROJECT MANAGEMENT

  • Build out robust project management tools and templates in order to compete with Smartsheet.

DOCUMENT SETTINGS

  • Build out the Document Settings panel.

  • Include high-level document use information.

    • Status and health of the document info.

    • Lock/unlock the document for all collaborators.

SEARCH FUNCTION

  • Build out the search for the internal glossary. 

  • Consult with developers about streamlining a cross-platform search function, to eliminate users' frustrations opening multiple platforms.

bottom of page