Redesigning the Customer Portal

Role: Sr. Product Designer

Date: 2021 - Present

Overview

As a Product Designer at Clicklease, my goal is to create intuitive solutions that address customer needs. Our customers, whom we affectionately refer to as “Rose,” are small business owners seeking financing for essential equipment to run their businesses.

When usability challenges surfaced with our existing customer portal—internally known as the Rose Portal—it became clear that improvements were necessary to enhance engagement, reduce customer service calls, and better serve small business owners like Rose.

This case study outlines our journey in redesigning the Rose Portal, from gathering insights to delivering a transformative solution that empowers our customers.

Problem Statement

The original portal presented several challenges for our customers:

  • Confusion during the early stages of the lease process: Uncertainty about signing agreements, setting up payments, and equipment delivery led to unclear lease payment start dates.

  • The current portal offers limited functionality for managing leases effectively.

  • Every customer action triggers a support ticket, causing unnecessary delays for Rose to get her inquiries resolved.

  • High call volumes to customer service about issues arising during the lease initiation and payment processes.

  • The existing portal lacks the flexibility and scalability to integrate with Sunburst, our new backend system.

These challenges not only impacted customer satisfaction but also strained internal resources.

Customer Portal Before Redesign

Desktop View

Mobile View

Customer Portal Ideation to Final Iteration

Second Iteration

First Iteration

Final Iteration

Research and Insights

Customer Interviews

To better understand Rose’s challenges with the portal, we conducted a thorough research process, starting with customer interviews and integrating insights from our customer service team.

  • The Rose Portal team extracted a list from Salesforce of customers who had recently contacted support to update account information. We filtered the data from the last three months and divided the customers into two groups based on their customer grade:

    • High-grade customers: Those identified as having higher scores.

    • Low-grade customers: Those with lower scores.

    Next, we refined these groups further by industry type, ensuring diversity in representation. For example:

    • Industrial

    • Automotive

    This segmentation allowed us to explore industry-specific challenges and understand how different types of Roses interact with the portal. Once the groups were finalized, we developed a survey tailored to uncover key pain points, such as navigating the portal, managing multiple leases, and setting up payment processes.

  • We also incorporated feedback from vendors who interact with Roses daily. Vendors shared recurring complaints they heard from Roses about the Clicklease experience, particularly around:

    • Frustrations with managing leases or payments.

    • Issues that created unnecessary delays or confusion in the equipment purchasing process.

    These insights were invaluable in understanding the broader ecosystem of interactions between Roses, vendors, and Clicklease, ensuring our redesign addressed not just customer needs but also vendor expectations.

  • In parallel, we spoke with our customer service representatives to gain a deeper understanding of their interactions with Roses. These conversations focused on:

    • The main reasons Roses call Clicklease.

    • Average call durations.

    • The time required to resolve common issues.

    By aligning CSR insights with our customer interviews, we could identify overlapping trends and validate the challenges faced by Roses.

  • This combined research process revealed a clear path to what customers truly need from the Rose Portal. It highlighted specific opportunities to reduce confusion, improve usability, and empower Roses to solve issues independently.

    These insights also drove my initiative to save time for both customers and customer service. By making the portal more intuitive and self-service-friendly, we could reduce the volume and duration of calls, ultimately saving Clicklease money on customer support operations.

Insights Leading to Our MVP List

Our research revealed critical pain points that shaped the foundation of our Minimum Viable Product (MVP) for the Rose Portal redesign. These insights highlighted the need for a more accessible, user-friendly, and functional portal:

Difficulty Finding the Portal

  • Many Roses struggled to locate the lease management portal (customer portal).

  • The lack of clear guidance on accessing this critical tool created a significant barrier to engagement.

Limited Functionality Upon Entry

  • Upon first accessing the portal, Roses were met with mostly informational content that didn’t enable them to complete their intended tasks.

  • This lack of actionable tools left users frustrated and more likely to call customer service.

Challenges with Account Sign-Up and Login

  • Once Roses found the login link, they were often unsure how to navigate the sign-up process.

  • Confusion around account creation delayed their ability to use the portal effectively.

Critical Tools Missing for Key Tasks

  • Roses needed tools for essential actions, such as:

    • Changing their bank account information.

    • Viewing past and upcoming payments.

    • Updating the equipment address.

  • The absence of these features made managing leases cumbersome and inefficient.

These insights formed the backbone of our MVP, focusing on improving accessibility, streamlining the onboarding process, and equipping Roses with the tools they need to manage their leases independently.

Design is not just what it looks like and feels like.

Design is how it works.

Design is not just what it looks like and feels like. Design is how it works.

Ideation and Planning

After establishing the product’s MVPs, a developer and design sync was essential to align on what could realistically be achieved within the project timeline. This sync helped determine the time needed for designing, testing, and iterating, as well as the time required for development and the full implementation process.

Key Features

The redesigned Rose Portal introduced several impactful features:

  • Simplified Portal Access: Ensured easy access to the portal after a lease agreement is signed, with plans for Phase 2 to enable immediate access following approval.

  • Enhanced Dashboard: Provided a comprehensive view of all leases, whether active, past, or pending, to support Roses managing multiple financing agreements.

  • Streamlined Onboarding: Delivered clearer, step-by-step instructions for signing agreements and setting up payment methods.

  • Expanded Customer Actions: Empowered users to manage account details independently, including updating bank accounts, business and personal information, and equipment locations.

  • Document Management: Enabled customers to download statements and lease agreements directly from the portal.

  • Improved Navigation: Redesigned menus for intuitive access to core features, ensuring a seamless user experience.

Handoff to Development and QA

To ensure a smooth implementation, I followed a structured handoff process:

  • Design Tools: I created all designs in Figma, organizing them with clear styles, variants, and components.

  • Task Management: I documented task tickets in Jira and included detailed notes in Confluence, Atlassian’s knowledge-sharing tool.

  • Handoff: I help developers through Figma’s DevMode, showing them how to access front-end code, navigate components, and understand design variants. This ensured alignment and minimized guesswork during development.

  • QA Collaboration: I also helped QA teams on using Figma effectively to streamline their workflows. This helped them access assets and verify functionality quickly, speeding up the quality assurance process.

By establishing these workflows, we achieved a seamless transition from design to development and QA.

Challenges

The Rose Portal redesign presented several unique challenges, particularly around the platform’s technical limitations and the learning curve associated with the tools:

Platform Constraints

Initially, the project was scoped to redesign the portal within the Salesforce Community platform. This platform posed significant limitations on what we could achieve in terms of design flexibility, functionality, and release cadence.

These constraints restricted our ability to implement innovative solutions and deliver the optimal user experience we envisioned for Rose.

Learning Curve with Salesforce Community

As the project required working within Salesforce Community, I faced the additional challenge of needing to learn the intricacies of this platform while simultaneously navigating the design process.

Balancing the time required to familiarize myself with Salesforce Community with the demands of the redesign timeline added complexity to the project.

The Pivot

Midway through the project, the Salesforce team was unable to complete the backend development for the Rose Portal, creating a significant challenge in delivering the portal’s full functionality.

After consulting with the front-end team, we decided to pivot and utilize the available front-end developers to build the Rose Portal outside of Salesforce Community. This marked the beginning of a new initiative to create the Rose Portal from scratch, allowing for greater flexibility and innovation in design and functionality.

Overcoming Blocks

To keep the project moving, we decided to focus on completing as much of the front-end development as possible. This allowed us to progress with user-facing features while deferring backend integration until team members became available.

When front-end developers encountered challenges, I actively stepped in to assist. I also leveraged AI tools to generate code for the UI, helping to resolve issues efficiently and ensure the project stayed on track.

Balancing User Needs and Business Goals

A constant challenge in the Rose Portal project was balancing user needs with business goals. Even with an established MVP, the scope often shifted based on stakeholder input and evolving business priorities. During research, we frequently uncovered user needs that the business might deprioritize due to broader strategic considerations.

This was particularly challenging for me, as I naturally strive to prioritize the user experience. To address this, I focused on finding creative solutions that subtly incorporated user needs while aligning with business constraints. This approach allowed me to advocate for the customer without compromising the project's larger goals.

The login process for a new Rose

One major improvement was making it easier for Rose to access the portal. After completing the lease agreement signing process, Rose now receives a confirmation email containing a direct link to the customer portal. From there, she can create her login credentials, enabling access to the portal at any time.

To enhance security, the login process includes a one-time password (OTP) configuration, providing an additional layer of protection for Rose's account.

Rose Portal Login

Viewing the payment history and upcoming payments

A significant improvement in the Rose Portal is the ability for Rose to view her upcoming payments for her lease. Each payment is clearly listed with specific due dates and amounts, ensuring Rose is never confused about when payments are due or how much they will be.

This enhancement addresses one of the most frequently asked questions received by customer service representatives. Rose can now easily access detailed information about her fees and payments—past, present, and future—directly in the portal.

Ability to edit payment information

Another major improvement is giving Rose the ability to update her payment information directly within the portal, eliminating the need to call Clicklease for simple tasks.

In addition, we integrated a program called PayNearMe, allowing Rose to use a variety of payment methods—not just ACH—to make her lease payments. This added flexibility makes managing payments more convenient and tailored to Rose’s preferences.

Rose Portal Edit Account

🏆 Maximizing Lease Approval Balances

A key achievement introduced toward the end of the project was the ability for Rose to utilize the remaining balance of her lease approval. If Rose does not use the full amount of her approval, it will remain active for 30 days.

This feature not only benefits Rose by providing additional flexibility but also creates an opportunity for Clicklease to present her with options to utilize the remaining balance. This opens the door for potential additional leases, ultimately driving more revenue for the business.

Outcomes

74% increase in customer logins

Showcasing enhanced platform engagement: Previously, over 80% of customers were unaware of the lease management portal. Now, all customers have been informed about the new portal and its capabilities, ensuring they know it's available to support their needs.

Large reduction in customer service calls

Customers like Rose now encounter fewer issues during lease initiation and payment setup, significantly reducing the volume of calls to customer service. With each customer call costing approximately $0.35 per minute, this reduction translates to substantial cost savings for Clicklease.

By minimizing time spent on routine calls, the support team can focus on resolving more complex inquiries, increasing efficiency and improving overall customer satisfaction. Additionally, the cost savings contribute to a higher return on each lease.

Reduce delinquencies through improved payment management

The redesigned Rose Portal streamlines payment management, reducing delinquencies by making it easier for customers to view payment schedules, update payment methods, and access payment history independently. These improvements enhance payment timeliness and reduce reliance on customer service, benefiting both customers and the business.