Redesigning the Ethane Production Dashboard for better actionability

This case study details my approach to redesigning Ingenero’s Ethane Production Dashboard—an industrial SaaS platform. What began as a straightforward UI/UX overhaul evolved into a deep dive into complex user needs, system workflows, and actionable data visualization.

79%

1.25 min

reduced Time on Task

Task Success Rate

Problem Overview

As I delved deeper, the complexity began to unravel. By focusing on the project's core objectives and the platform's functionalities, I started making sense of the chaos. Conducting a UX audit, I unearthed critical issues that demanded attention.

Visual and
Cognitive Load

Excessive and scattered information led to user fatigue and decreased efficiency.

Poor Information Grouping
Related elements were not visually proximate, hampering usability

Insufficient Affordance
& Feedback

Users found it hard to interpret system responses to their actions

Contextual Clarity
Issues

Users lacked the necessary context for confident decision-making.

Key Challenges Identified
Solution Process

I led a comprehensive UX audit and mapped the user journey through stakeholder interviews and workflow analysis. Wireframes and low-fidelity prototypes were created to validate design hypotheses and gather feedback. The iterative design process focused on:

  • Reducing Redundancy: Streamlined content to eliminate repeated information.

  • Improving Information Hierarchy: Used white space, color theory, and F-pattern layouts for easier navigation.

  • Prioritizing Actionable Items: Grouped key data and highlighted critical KPIs for quick access.

  • Enhancing Affordance & Signifiers: Made interactive elements easily distinguishable.

Option 1: Similar with Adjustments

  • Reduction in Repeated Information: Streamlined content to eliminate redundancy.

  • Clear Information Using White Space and Color Theory: Enhanced visual clarity.

  • Maintained Original Concept: Preserved core design while making necessary adjustments.

  • Distinct Separation of Information: Improved content separation with visual cues.

Option 2: Focusing on Equipments

  • Highlighting Most Actionable Items: Prioritized actionable items.

  • Grouping and Clubbing Information: Organized related information coherently.

  • Clear Direction for User: Provided a guided user path.

  • Singular Information Focus: Focused on delivering relevant information.

Option 3: Focus on Overall
and Equipment Level

  • Utilized User Journey: Leveraged insights to improve usability.

  • Limited Information to Reduce Load: Presented essential information.

  • Action-Oriented Approach: Encouraged user actions.

  • Improved Navigation Ease: Simplified the user interface.

Final Design Solutions
  • Consistent Indicator System: Developed universal KPI indicators to support rapid decision-making.

  • Clear Navigation Patterns: Established mental models and F-pattern visual paths to guide users.

  • Dark Mode Integration: Added dark mode for improved accessibility and alignment with user preferences.

  • Bird’s Eye View: Ensured essential dashboard elements remained prominent for holistic monitoring.

an abstract photo of a curved building with a blue sky in the background
User Testing & Outcomes
Internal teams and customer satisfaction groups tested the prototype. Feedback highlighted:
  • Reduced cognitive load through improved content separation.

  • Enhanced reachability of KPIs via notification-like indicators.

  • Increased usability in varied lighting with dark mode.

Impact & Learnings
  • Trust in Iterative UX Process: Continuous refinement led to actionable insights and a user-centered solution.
  • SaaS Accessibility: Complex workflows became intuitive through targeted design system improvements.
  • Benchmark for UX Standards: The redesigned dashboard set new standards for usability and information architecture within the organization.
  • Scalable Design Principles: Affordance, signifiers, and feedback practices were adopted across other company projects.