Grabbi

Grabbi Dashboard

Grabbi

SaaS E-commerce Dashboard
Product Design


Introduction

This case study examines the development and optimization of the Grabbi SaaS dashboard, an e-commerce platform for small to medium-sized businesses. Grabbi streamlines online sales, inventory management, orders, customer interactions, and business analytics. The goal was to enhance user experience, improve efficiency, and drive business growth by addressing issues such as complex navigation, poor information organization, and inefficient workflows.

  • Timeline

  • Three month sprints
  • My Role

  • Product Designer
  • Collaboration

  • 1 PM
  • 1 Team of SWEs
  • Platform

  • Figma
  • Figjam
  • Notion
  • chatGPT
  • Adobe Photoshop
  • Zoom
  • Slack

Problem

Users of Grabbi reported several issues with the existing dashboard, including:
1. Complex Navigation: Difficulty in finding key functionalities.
2. Poor Information Organization: Overwhelming amount of data displayed without clear prioritization.
3. Inefficient Workflow: Steps required to complete tasks are not intuitive or streamlined.

Solution

To address these issues, we proposed a complete redesign of the Grabbi dashboard focusing on intuitive navigation, improved information hierarchy, and streamlined workflows. The new design will incorporate user feedback and best practices in UX design to create a more user-friendly and efficient interface.

Process

End-to-End Double-Diamond process; User Research, Competitive Analysis, Card Sorting, Site map and information Architecture, UI Design, Style Guide, Sketching, Wireframing, Prototyping, User testing, Iterations, Logo design

Research plan and goals

Research Plan:

1. User Interviews: Conduct interviews with a diverse group of current users to gather qualitative insights on their pain points and needs.
2. Surveys: Distribute surveys to a broader audience to quantify the prevalence of identified issues and gather additional feedback.
3. Usability Testing: Perform usability tests on the existing dashboard to observe user behavior and identify specific areas of improvement.
4. Competitor Analysis: Analyze competitor dashboards to understand industry standards and identify potential features to include in Grabbi.

Goals:

1. Improve user satisfaction and reduce the learning curve for new users.
2. Enhance navigation and information organization to facilitate quicker task completion.
3. Increase overall efficiency by reducing the number of steps required to perform common tasks.

Timeline

Week 1-2: Conduct user interviews and distribute surveys.
Week 3-4: Perform usability testing and analyze competitor dashboards.
Week 5-6: Synthesize research findings and develop wireframes.
Week 7-8: Create high-fidelity prototypes and conduct iterative testing.
Week 9-10: Implement design changes and finalize the new dashboard.
Week 11-12: Launch new dashboard and gather initial user feedback for further refinement.

BEHAVIOURAL INTERVIEW CANVAS

The purpose of conducting behavior interviews for the Grabbi E-commerce Dashboard is to gain deep insights into the user experience and identify key pain points that users face while using the platform. These interviews are crucial for understanding the needs, frustrations, and behaviors of our users, which will guide the redesign and optimization of the dashboard. By listening to our users, we aim to create a more intuitive, efficient, and user-friendly interface that enhances navigation, improves information organization, and streamlines workflows, ultimately driving business growth and user satisfaction.

BEHAVIOURAL INTERVIEW

AFFINITY MAPPING WORKSHOP

These themes highlight the key areas for improvement in the Grabbi dashboard, including navigation, information organization, workflow efficiency, data visualization, and the usefulness of features.

AFFINITY MAPPING

USER PERSONA

The user persona for Sarah Johnson provides insight into the daily challenges and motivations of a 34-year-old online boutique owner from New York, NY. Balancing inventory management, order tracking, and customer service, Sarah’s moderate tech skills drive her to seek efficient, user-friendly tools that enhance her business operations. Understanding her needs helps tailor solutions that improve her experience and support her business growth.

USER PERSONA

EMPATHY MAP

This empathy map helps to visualize and understand the experiences, behaviors, and needs of a user, in this case, Sarah Johnson, as she interacts with the Grabbi e-commerce dashboard. By mapping out what Sarah says, feels, does, and sees, we can gain deeper insights into her pain points and motivations, ultimately guiding the design process to better meet her needs. This empathy map sets the scene by exploring Sarah’s environment, tasks, and challenges, and delves into her thoughts and feelings as she navigates her daily responsibilities on the Grabbi dashboard.

EMPATHY MAP

PROBLEM FRAMING

The problem framing for the Grabbi E-commerce Dashboard focuses on identifying and addressing key challenges that hinder the efficiency and usability of the platform for small to medium-sized businesses. By analyzing issues related to navigation, information overload, workflow inefficiencies, and user experience, the goal is to create a more intuitive and streamlined dashboard. This approach will enable users to manage their online sales, inventory, and customer interactions more effectively, ultimately driving business growth and improving overall satisfaction with the platform.

PROBLEM FRAMING

HOW MIGHT WE

The “How Might We” workshop for the Grabbi SaaS e-commerce dashboard is designed to generate innovative solutions that address key challenges users face when managing their online businesses. Through collaborative brainstorming, we’ll explore ways to simplify navigation, enhance data visualization, and streamline workflows to create a more intuitive and efficient dashboard. By focusing on user needs and drawing inspiration from industry leaders, this workshop aims to drive meaningful improvements that align with our product vision and deliver maximum value to our users.

HOW MIGHT WE

FEATURE CANVAS

Our Grabbi SaaS E-commerce Dashboard is being developed to empower small to medium-sized businesses with the tools they need to efficiently manage their online sales, inventory, and customer interactions. This feature canvas outlines the key aspects of the development process, ensuring that the solutions we build are aligned with user needs and business goals.

FEATURE CANVAS

USER JOURNEY

Grabbi SaaS E-commerce Dashboard User Journey Workshop is designed to explore and understand the various stages users go through while interacting with the Grabbi platform. This workshop aims to map out the key tasks, touchpoints, and emotional experiences that users encounter from their first interaction with the dashboard to their ongoing use of its features. By identifying and analyzing these stages, we can gain valuable insights into how to enhance user satisfaction, streamline workflows, and ensure that the dashboard meets the evolving needs of small to medium-sized businesses. Through this collaborative process, we aim to create a more intuitive, efficient, and impactful user experience.

USER JOURNEY

MOMENT MAPPING WORKSHOP

In our Moment Finding Workshop for the Grabbi SaaS E-commerce Dashboard, we’re focusing on identifying and refining the critical “moments” within our platform—those pivotal interactions that shape the user experience. Moments are like the key plot points in a story, the scenes that make the biggest impact on the audience. For our product, these moments are the actions and interactions where Grabbi can truly shine, solving users’ pain points and guiding them through complex tasks with ease.

The goal is to pinpoint the places where our dashboard stands out, where it delivers significant value, and where it turns potential challenges into seamless experiences. Whether it’s processing a first order, managing daily inventory, or navigating through performance analytics, these moments are what define the user journey and determine how successful and satisfied our users will be with our product.

MOMENT MAPPING WORKSHOP

MOMENT FLOW WORKSHOP

The moment flow for the Grabbi SaaS E-commerce Dashboard captures the key interactions a user experiences while navigating the platform. This flow is designed to outline the critical pages and actions that support essential business functions like order management, customer interactions, and inventory tracking. Each page in this flow represents a pivotal touchpoint where users perform vital tasks, ensuring their e-commerce operations run smoothly and efficiently. By mapping out these moments, we can better understand how users interact with the dashboard, identify opportunities for optimization, and enhance the overall user experience.

MOMENT FLOW WORKSHOP

HAPPY PATH

Our Happy Path workshop for Grabbi’s SaaS E-commerce Dashboard is about envisioning the ideal user journey through our product. The happy path represents the best-case scenario where a user moves seamlessly from their initial goal to a successful and satisfying outcome. By organizing our moment flows into key phases, we can create a theoretically perfect sequence of actions that a user would follow.

In this exercise, we focus on removing obstacles and distractions to highlight the key phases and moments that define the optimal experience. This helps us understand the core value of our product and ensures that the most important aspects of the user journey are front and center.

HAPPY PATH

OOUX WORKSHOP

The Object-Oriented UX (OOUX) approach helps us design Grabbi’s SaaS E-commerce Dashboard by focusing on the core objects, the data that defines them, the actions users can perform on them, and how they relate to each other. This method ensures a clear, intuitive user experience by breaking down the system into its fundamental components without enforcing a strict hierarchy or sequence. By understanding and defining these objects and their interactions, we can build a dashboard that meets user needs efficiently and flexibly.

OOUX WORKSHOP

INFORMATION ARCHITECTURE BOARD

The Information Architecture (IA) board is key to structuring our Grabbi E-commerce SaaS Dashboard. It involves organizing elements like orders, customers, inventory, and conversations into a logical, intuitive structure. The goal is to determine where each object should reside and which objects naturally belong together.

This process is crucial to the success of our product, as it directly affects user navigation and interaction. We must approach it carefully, focusing on creating a structure that makes sense from the user’s perspective to ensure a smooth and efficient experience.

INFORMATION ARCHITECTURE BOARD

Style Guide & Logo Design

The style guide for Grabbi’s SaaS E-commerce Dashboard is designed to ensure a consistent, professional, and user-friendly interface across the platform. It emphasizes clean, modern aesthetics with a focus on readability and simplicity. The guide includes standardized typography, a cohesive color palette, intuitive iconography, and consistent spacing guidelines, all of which contribute to a seamless user experience. These design elements are carefully chosen to enhance usability, making it easy for users to navigate the dashboard and manage their business operations effectively.

Style Guide & Logo Design

Accessibility Check

Ensuring WCAG (Web Content Accessibility Guidelines) compliance is a key priority for the Grabbi SaaS E-commerce Dashboard. Our commitment to accessibility means that the platform is designed to be usable by all individuals, including those with disabilities. By adhering to WCAG standards, we aim to create an inclusive digital experience that provides equal access to all users, regardless of their abilities. This includes implementing features such as keyboard navigation, screen reader compatibility, and sufficient color contrast, all of which contribute to a more accessible and user-friendly dashboard.

Accessibility Check

Mid-Fidelity Wireframes

The mid-fidelity wireframes for Grabbi’s SaaS E-commerce Dashboard represent a crucial stage in the development of our platform, which is designed to streamline online sales and inventory management for small to medium-sized businesses. These wireframes offer a detailed visual representation of the dashboard’s layout and functionality, focusing on key elements such as order management, customer interactions, inventory tracking, and business analytics. This step in the design process allows us to refine the user experience, ensuring that the interface is both intuitive and efficient, ultimately driving business growth and user satisfaction.

Mid-Fidelity Wireframes

High Fidelity Wireframes

The high-fidelity wireframes for Grabbi’s SaaS E-commerce Dashboard mark a significant milestone in the platform’s design journey. As an all-in-one solution for small to medium-sized businesses, Grabbi is tailored to streamline online sales, manage inventory, and handle customer interactions efficiently. These high-fidelity wireframes offer a polished, detailed representation of the final product, showcasing the visual design and interactive elements that will enhance user experience. This phase focuses on perfecting the dashboard’s usability and aesthetics to ensure it effectively supports business growth and operational efficiency.

High Fidelity Wireframes

Project summary

Grabbi’s SaaS E-commerce Dashboard was developed as a comprehensive solution to streamline online sales, inventory management, and customer interactions for small to medium-sized businesses. The platform focuses on delivering an intuitive, user-friendly interface that centralizes key business operations, making it easier for users to manage their daily tasks efficiently.

Key features include a dashboard overview that offers a quick glance at vital metrics, detailed order management tools, customer interaction histories, and robust inventory tracking. The design process emphasized user-centricity, ensuring that every element of the dashboard contributes to a seamless, productive workflow that supports business growth.

As we conclude this phase of the project, the focus on continuous improvement remains strong. Moving forward, efforts will be directed toward gathering user feedback to refine usability, expanding the feature set with advanced tools like enhanced analytics and CRM capabilities, and optimizing the dashboard for responsiveness across all devices. This commitment to ongoing innovation ensures that Grabbi will continue to meet the evolving needs of its users, providing a powerful, efficient platform for managing their e-commerce businesses.