hello@datalabsagency.com
logo
Datalabs Agency
En
  • De
  • Ar
0
logo
  • Data Training
    • Our Six Main Workshops
      • Introduction to Data Visualization: Tools & Techniques Workshop
      • Designing Great Business Dashboards Workshop
      • Infographics & Report Design Workshop
      • Creative Data Presentations with PowerPoint
      • Visual Storytelling for Government Workshop
      • Creative Power BI Dashboard Design
    • Online Courses
      • An Introduction to Data Visualization & Storytelling
      • Designing Great Dashboards
  • Data Design
    • Style Guides
      • Power BI Style Guides
      • Tableau Style Guides
    • Animated Data Videos
    • Maps & Cartography
    • Interactive Infographics
    • Power BI Dashboards Designs
    • Tableau Dashboards Designs
    • Infographic Reports
    • Interactive Data Visualizations
    • Digital Annual Reports & Microsites
  • Case Studies
  • Shop
    • Ecommerce Products
      • Power BI Templates
      • Power BI Theme and Style Guide
      • An Introduction to Data Visualization and Storytelling Course
      • Designing Great Dashboards Course
      • Data Visualization Consultant
  • Login
  • Contact
    • About
      • Otto Ottinger
      • Blog
0
University of Melbourne Map Project – A Case Study
16 July 2018
Vector graphic image showing scalability for illustrations and data visualization 0
Vectors Graphics are Obviously Superior for Illustrated Campaigns
04 December 2018
Articles
Interface Design Case Study
December 4, 2018 by Datalabs in Articles

CRM Dashboard & User Interface Design Case Study

Dashboard Prototype design

How we designed a functional set of dashboards with an infographic style at its core.

Time Frame: 6 weeks

Tools: Illustrator, Photoshop

Final Product: Built by the client’s developers as their CRM

The Project

Our client engaged Datalabs to design a best-in-class dashboard and user interface for their frontline staff’s main workstation. They were in the process of upgrading from an old platform to a new interface for their front-end staff. It would be part customer relationship management (CRM) software, part dashboard, part reporting interface, and task management tool.

We loved the challenge of doing more than what was traditionally available in an out-of-the-box CRM or BI Software. As interface designers, the notion of combining traditionally isolated parts to make a streamlined, actionable interface – that was both beautiful and useful – was an awesome challenge.

The Design 

We wanted to utilize the space available knowing that the user was going to be busy; inundated with daily tasks, inputting new information, and managing their day, week, and month from a single screen.

We needed to create a clear flow of information, actions, and tasks that were available. And we needed to make sure it didn’t overwhelm the user.

The interface design had a task-oriented view for the user to get an overview of their outstanding items, and, a metrics view so the user could see and keep track of their performance. They needed a management-level view to understand the team’s performance from a line manager’s perspective. A level above this, the client also required a regional manager view – a view above the line manager.

Our Approach

We began with a whiteboard session (a cross between a kick-off, discovery session, and workshop) to get an understanding of the needs, intended outcomes, data, and complexity, and to prioritize the order of the dashboards. After a few hours of asking questions and talking data, operations, day-to-day management, and metrics, we were able to exit the session with two distinct styles for our prototype designs.

We then moved to a wireframing and prototyping phase with each iteration getting a little more detailed until there was enough clarity for a full design with all elements and assent.

Dashboard Prototyoe design

The Final Product

We designed two interfaces for the end-user. The first was a top view with an overview of statistics, tasks, areas needing action, and data that needed updating. Second, was a detailed view of all pending tasks that acted as a drill-down from the first interface.

Both views matched data segments to keep the flow and information architecture complimentary. This meant the user would always be looking at the same data layout regardless of the view.

We applied this rationale to the management views, meaning that all the interfaces shared the same information architecture which allows every user level to understand the information as they changed views from the base level up to the aggregated level. This creates a good sense of user intuition when using the interface. Also, it was easier to develop the interface and database. But mainly because of the user.

Outcome

In the end, there were four distinct interfaces designed. Two task-oriented ones and two management.

The purpose of this tool, from the outset, was to develop a clean, data-driven interface that had the ability to show where you were at, what you needed to do when you needed to do it by, and what actions you could take to change anything that needed to be changed along the way. 

The management view had the same inherent actions available: to quickly identify the top and bottom, and take action based on what you saw. For example, if a front-end user had an outstanding task, that item would be identified as critical and would be seen first; as a manager, you could see who had a high workload (and who had a light workload) and reassign accordingly. 

Like what you see? 
Check out our interactive data visualizations page for more details on what we do.

0 Comments
  • Adobe Illustrator
  • Adobe Photoshop
  • business intelligence
  • CRM
  • data dashboards
1 Like!
Share
Datalabs

Data Visualization Training: Workshops & Courses

Shop Online for Data Visualization

  • Image of a man using our Power BI templates to design a report
    Power BI Templates
    Select options
  • Image of our custom Power BI Theme on a computer
    Power BI Theme and Style Guide
    Select options
  • An Introduction to Data Visualization and Storytelling Course
    An Introduction to Data Visualization and Storytelling Course
    Add to cart
  • Photo of a data visualization consultant advising clients and helping solve design issues.
    Data Visualization Consultant
    Buy product
  • Designing Great Dashboards Course
    Designing Great Dashboards Course
    Add to cart

Style Guides for Data?

A photo of our data viz style guide for Microsoft Power BI

Data Visualization & Storytelling Group Workshops

Contact Us

  • This field is for validation purposes and should be left unchanged.

From Our Blog

  • 8 Incredible Examples of Interactive Data Visualization
  • Data Analytics Conferences 2024 & 2025
  • Data Visualization & Design Conferences 2024 & 2025
  • Case-study: Intranet Dashboard Design for Nestlé
  • Dashboard Tips: 3 Alternatives To Using A Data Table
  • Data Visualization Training
  • Brand Guidelines for Data
  • Online Courses & Products
© 2024 Data Arts Pty Ltd
logo

We noticed you're visiting from Australia. We've updated our prices to Australian dollar for your shopping convenience. Use United States (US) dollar instead. Dismiss