DashProphet
The “Reader View”
Overview
DashProphet is a data management platform provided by Cruz Street, a new startup seeking to bring the non-technical business leader in as a collaborator in a cloud-based data science SaaS solution.
Comparable data visualization products are Tableau, Qlik, and PowerBI.
DashProphet, however, simplifies existing pricing models to accommodate for small to mid-sized businesses.
My Roles
UX/UI Designer | UX Researcher
Challenge
DashProphet is a powerful tool with an all-inclusive “Author View” but lacks the ability to adapt to different user types.
How might we expand its scope to stakeholders who need a simplified, high-level overview of the company’s data sets?
Solution
Project Timeline
Research
Client Briefing
Initial Uncertainties
User Interviews (2)
Research Synthesis
Ideate
Comparative Analysis
Initial User Stories
User Persona
User Flow
Create
Wireframes
Client Walkthrough
Second Iteration
Second Client Walkthrough
Third Iteration
Constraints
Final Deliverables
Evaluate
Measuring Success
Reflection
Future Steps
Research
Client Briefing
The Existing Product
Author View
Homepage with interactive links to tabs
Extensive navigation panel
Desktop view only
Initial Goals for Expanding Product
Introduce a Reader View
Simplified landing page
Streamlined navigation panel
Develop responsive mobile design
Initial Uncertainties
Multiple versions of their beta prototype—which product are we building off of?
How does the product work? What are its unique features?
What is the “Reader View” experience?
What options are available to us for user research?
Who are we collaborating with on this project?
User Interviews
Conducted two user interviews to learn more about our four key goals
User Quotes:
“I want to land on a dashboard directly as an Exec”
“I want to manipulate data and choose what subsets to display”
“I don’t know where to begin when I land on the homepage”
Ideate
Competitive Analysis
Pros:
• Page organization: tiles and menu navigation
• Recently viewed displayed on landing page
Cons:
• Workspaces feel too niche for DashProphet
Pros:
• Ability to save/favorite dashboards
• Owner transparency and accountability
Cons:
• Steep learning curve
• Overly complicated data sets
Pros:
• Collapsible menu to maximize screen space
• Ability to view data in real-time
Cons:
• Steep learning curve
• Extensive navigation
Initial User Stories
As a user, I want to...
Create dashboards
Edit dashboards
View dashboards
Input data
Manipulate data/data connections
Request analysts
View analysts hours (future state)
Customize reader view dashboards
Send dashboards to readers
Message analysts, other authors, clients, maybe exec
As a user, I want to...
View dashboards
Message analysts and other execs
Message the author (parent client)
User Persona
“Dashboards need to be the focal point. I don’t want to be distracted by any other noise.”
User Flow
Create
Initial Wireframes
Re-imagining the Homepage: Three Different Layouts
To find a solution that would satisfy the needs of the client, three different landing pages were developed based on the initial understanding of the product from the client brief.
Option A
• Adhere to existing product style via tiles
• Show the essentials: Recently Viewed and Favorites
• Anticipate most common user actions
Option B
• Shows relationship between projects & dashboards
• Provides snapchat of recently updated works
• Ability to maximize dashboards
Option C
• Dashboards nestled within Projects
• Condenses Messages, Analysts, and Tips & Tricks into one tab
Diving Deeper into Dashboards: User Journey
To satisfy the needs of a Reader View, an initial user journey into dashboards was designed with pinning, commenting, and maximizing features.
Dashboard Tab
• Tile view of all dashboards
• Default sort: most recently updated
• Search bar and advanced filtering options
Expanded View
• Main view for user to see full details
• Three functions: pin, share, comment
Expanded View with Comments
• Pop-out sidebar for comments, ordered by date
• User can add a new comment at the bottom
• Options to edit or delete comments
Client Walkthrough 1
Second Iteration
Synthesis of the Initial Home Screens + Feedback
The best aspects of the original three homepage designs were synthesized to create a ultimately better product. Client feedback was also incorporated into this second iteration.
Synthesis of Expanded Dashboard View + Feedback
The Dashboard viewing screen was iterated and expanded upon to allow users to quickly exit the dashboard, bookmark if desired, and leave pinpointed comments.
Client Walkthrough 2
Third Iteration
Expanding on Tagging Concept
The client envisioned a personalized tagging experience that accounted for edge cases, so we designed a flow that satisfied this product vision.
Constraints
After meeting with the client and developers, there were additional constraints we ran into:
Certain components were already developed and could not be changed
Header, Footer, Icons
Lack of consensus from client’s executive team on what features were absolutely necessary for the MVP
Current Concepts: Messages, Different states of components, Flow to maximized view
New Concepts: Comments, Tagging, Mobile designsElements of existing product still were not defined
Projects, Messages, Additional links, Profile
Final Deliverables
Final Deliverables of Landing Page
Two final versions of the Reader View landing page were presented to the client. The left shows a designated home page and the right streamlines the product even further, removing navigation to allow users direct entry into their dashboards.
Final Deliverables of Dashboard Tab: Tile View v. List View
To increase user efficiency, we provided a tile view and list view of the Dashboards tab.
Final Deliverables of Dashboard Page
Two versions of the dashboard panel were presented to the client. The overarching goal was to maximize the screen for dashboard viewing.
Introducing Responsive Mobile Designs
The client requested for the web designs to be adapted to a mobile screen. Based on previous feedback from the web designs, we adapted them to fit a mobile screen.
Final Deliverables of Responsive Mobile Design
Evaluate
Measuring Success
Reflections
Future Steps
Though the project was limited to the MVP of the Reader View, we left Cruz Street with the following recommendations:
More usability testing on added features
Design and test mobile/tablet view
Extensive competitor analysis
Accessibility audit on both architecture and visuals
Establish means to analyze product performance
(collection, reporting, and analysis of product data)
