Designing for Efficient B2B Data Visualization
Five business use cases for your next analytical dashboard designs
Imagine a sales manager about to walk into the weekly team meeting, with only 20 seconds to spare. What’s the best way to get a read on the team’s sales performance?
For the Salesforce Analytics UX team, which builds out-of-the-box analytical dashboards for industries including financial services, healthcare, and B2B marketing, such scenarios are more than thought experiments. Designing data visualization is all about representing data in ways that help users avoid risk and make good business decisions, whether they have 20 seconds or two hours to review the numbers.
Our mission is to transform even highly complex data into insights that help solve business problems for a wide range of industries and users. And to do that, we need scalable, flexible patterns that are both actionable (driving insight) and efficient (enabling immediate action).
We’ve summarized three best practices that support these goals:
1. Understand the user’s information needs
2. Design with fundamental use cases
3. Scale design best practices
Team leaderboard dashboards in current analytics apps. Similar use cases require a unified pattern to bridge the gap between style guide and use case gallery for dashboard designers.
1. Understand the user’s information needs
Empathy is the bedrock of good design. To understand user needs, we start by developing personas and gathering information needs through brainstorming questions to be answered, then proceed to ideation exercises and user testing. (For a detailed look at our process, see Transforming Data to Insights.)
2. Design with fundamental use cases
To align analytical needs with designs, we categorized five functional patterns that are applied with best practices and commonly used in our analytics apps. With the chart designs, we followed SLDS Charts design guidelines to develop five main functional dashboard patterns — benchmarking, performance trending, segmenting, focus, and status distribution. Think of these as quick structures for creating visual communications:
Benchmarking
“How is my team doing with closing deals?”
“Which clients need my attention right now? Who do I need to follow up with?”
“Show me my top and bottom accounts by revenue.”
Benchmarking compares performance across entities using consistent measures. For example, a leaderboard could help sales managers identify top and bottom performers, and account managers to identify most successful accounts and opportunities.
Performance trending
“Show me my progress towards quota for this sales cycle.”
“Which time slot has the most appointments?”
“How has my campaign performed over the last 24 hours?”
Many use cases require monitoring performance over time, measuring performance against goals, and identifying weakness and growth opportunities. A financial advisor, for example, might track clients’ progress toward investment goals, while a marketing specialist could track ad campaign performance.
Segmenting
“Show me a list of customers to target with this marketing campaign, based on these six criteria.”
“Which industries contributed most to revenue in the last 90 days?”
“Which accounts do I need to follow up with?”
Segmenting lets users explore correlations or group data based on selected characteristics. A branch manager might use segmenting to flag at-risk clients, while a sales manager could assess team performance and identify individual salespeople who need coaching.
Focus
“Which loan applications need my attention?”
“What products can I upsell to this account?”
“Which leads should I prioritize?”
Focus pattern can help users identify targets for further action. A sales operations manager or regional manager might use these features to prioritize leads prioritization, identify top referrers, or analyze product and region whitespace.
Status distribution
“Show me the status of my open pipeline.”
“How many deals were moved out of the current sales cycle?”
Status distribution can help users visualize opportunity stages, pipeline changes, status distribution, or backlog movement. A sales team leader might look at status distribution to understand pipeline health, or a service agent manager to allocate agents based on case volumes.
Building dashboards with interactive patterns
Starting with these five use case cards, the team created interactive layout patterns for better data storytelling. Each could be used as a dashboard home page, or a hero visualization section in a larger dashboard.
KPI drill-in pattern
This pattern foregrounds clickable graphics such as bar and donut charts. It uses one chart to drive a KPI panel; clicking on it reveals detailed metrics.
Explanation pattern
This pattern uses KPI panels to drive the dashboard, with data visualizations to provide context for the metrics. Performance Trending and Segmenting are common supporting visualizations.
Multiple use case composition
Here one use case pattern drives another. A user might click on a region (Focus) to see top branches (Benchmarking), select a top account (Benchmarking) to see product whitespace (Focus), or highlight a client segment (Segmenting) to see trending wallet share (Performance Trending).
3. Scale design best practices
Once we’d established the design patterns, it was time to align. Through interactions with customers and internal design teams, the team discovered needs around alignment of style guides and dashboard layouts, and making components reusable.
In this stage, we built a live ready-to-use library with Analytics Dashboard Builder, which is interactive and populated by sample data. The library serves as a common set of reusable styles and layouts that help design teams work more efficiently. It also serves as inspiration for customers to build dashboards with consistent visual and interaction design, and provides a familiar user experience that promotes faster insights and decision making.
Recommendations and next steps
Keep purpose in mind
Think of these use cases and patterns as a starting place for compelling dashboard experiences. For every project, you also need to understand users and develop personas. Don’t move on to metrics until you’ve identified a clear purpose and critical business questions for each dashboard.
Communicate with stakeholders
These use cases can help you communicate design concepts to product and engineering partners. Focusing on what users can do after consuming the data supports the conversation around building meaningful data visualization products.
Build your library
Starting with the use cases and patterns here, build your own data visualization gallery. To support scalability and consistency, make it available to not only design teams, but also engineering partners, and even customers looking to design their own dashboards.
We hope this piece will inspire you to design more meaningful data-driven experiences. We’ll continue to collect feedback, iterate on existing patterns, and create new patterns for new use cases.
Special thanks to Edouard Picot for guidance on this article, my colleagues Elena Migunova and Michelle Veneracion for contributing to this article and sharing their perspectives, Analytics UX team and Lisa Gluskin Stonestreet for the feedback, and Jason Winters for creating space for projects like this.
Follow us at @SalesforceUX
Learn more about Salesforce Design at design.salesforce.com
Check out the Salesforce Lightning Design System
