Home

Work

About

Resume

CallRail

SuperAdmin

Plans & Billing

Redesign of the Plans & Billing sections of the SaaS company's internal software.

Summary

Platform

Problem

CallRail's internal system, SuperAdmin, didn’t help their users much, showing irrelevant info and lacking details on new product lines.

Solution

Provide a simple dashboard interface that quickly displays essential information and allows easy access to additional details when needed.

Impact

Both the Sales and Support Teams found the designs favorable, noting they made upselling, changing client plans, and addressing billing issues much easier.

Background

CallRail is a SaaS marketing software used by businesses to track visitor interactions, particularly through their call-tracking product.

In response to demand, CallRail planned to release Form and Chat Tracking. With these additions, each product (Calls, Forms, and Chat) would have its own plan.

Customer information, including usage, plans, and billing details, can be accessed through SuperAdmin, CallRail's internal platform used by the Support and Sales teams to interact with customers.

The Problem

My original task was to redesign the Plan and Billing Cards on the Customer Homepage in the SuperAdmin platform, integrating the new products and their plans.

Through discussions with the Sales and Support teams, I found additional issues that needed addressing:

• Users struggled to identify which plan a customer had for each product
  

• Users had to scroll to see a customer's plan, causing confusion about billing differences
  

• Accessing details about a specific plan required navigating to another page
  

• Users found it difficult to extend, pause, or unpause a trial for a client
  

• Trial client data wasn't easily accessible to determine the right plan for them
  

The Solution

I made a simple dashboard to highlight key information quickly, with the ability for the user to dig in to find additional information. After testing with users, we chose the following design based on their feedback.

For the Plans Card specifically...

• Reorganized the layout to place the Plans card above the Billing card

• Separated each product on the card, emphasizing the plan and monthly total due

• Enabled easy management of trials with icons for pausing, canceling, or extending trial periods

Upon tapping the plan card, the page transitions into editable mode.

Users are provided with additional information about each plan and granted the ability to alter the plan and add or remove add-ons.

For the Billing Card ...

• Improved information hierarchy by rearranging columns

• Combined columns to show used versus total
  

• Made the Invoice column clickable for easy access
  

Impact

The redesigns received positive feedback, with both departments finding it much easier to upsell on accounts, change client plans, and address billing issues.

Prototype

More Work

Complete Work Order

Improving the flow and design of Completing a Work Order on mobile