Ancillary Management Payments System Redesign: Transforming an Internal Tool for External Use

Executive Summary

Ancillary Services Management needed to transform their real estate amenity internal payment tracking system (to track such things as apartment-provided utilities, parking, and wifi) into a client-facing SaaS product. The existing system, used daily by the property accountant processing payments across multiple properties, suffered from significant usability issues that created inefficiencies and frustration. The accountant often struggled with navigating between scattered interfaces while processing large checks that applied to multiple properties simultaneously.

Through contextual interviews with the accountant, collaborative design sessions with stakeholders, and iterative prototyping, I developed a solution that:

  • Consolidated multiple payment workflows (single, batch, scheduled, unscheduled) into a single, unified interface

  • Solved critical usability issues for batch payment processing by streamlining multi-property payment handling

  • Reduced cognitive load by maintaining visibility of remaining balances

  • Improved data entry efficiency through keyboard-focused interaction design that eliminated constant mouse-keyboard switching

The redesign resulted in a more intuitive interface that addressed the accountants' primary pain points while positioning the tool for its future transition to a customer-facing SaaS product. The key accomplishment was creating a solution that balanced user needs, business requirements, and technical constraints to establish a foundation for the product's evolution.

The Challenge

Original Payment Interface

Ancillary Services Management used an internal tool to track service agreements, payments, providers, properties, and clients. The company wanted to transform this tool into a SaaS product, but first needed to address fundamental usability issues. The primary challenges were:

  1. Inefficient Batch Payment Processing: The accountant frequently needed to process large checks applying to multiple properties, but the interface required constant scrolling between payment entries and the remaining balance information.

  2. Manual Workflow Management: Users had to manually add payment lines rather than the system intelligently handling this based on remaining balances.

  3. Fragmented Payment Types: Different payment types (single, batch, scheduled, unscheduled) required separate interfaces, creating unnecessary complexity for users and an additional maintenance burden for developers.

  4. Poor Keyboard Navigation: The data entry workflow frequently required switching between keyboard and mouse, significantly slowing down processing time.

Methodology

I employed a user-centered design approach combining several methodologies:

User Research

  • Contextual Inquiry: Conducted in-depth interviews with all three users of the tool, with special focus on the accountant who most frequently used the payments feature

  • Workflow Analysis: Documented current processes to identify pain points and inefficiencies

Collaborative Design

  • Cross-Functional Workshops: Facilitated meetings with the product manager and developer using remote collaboration tools (Miro, freeconferencecall)

  • Stakeholder Management: Balanced differing perspectives between the product manager (concerned about maintaining context and avoiding sweeping changes) and the developer (focused on technical feasibility)

Iterative Prototyping

  • Design Critique: Evaluated initial developer prototype against user needs and usability principles

  • Rapid Prototyping: Created real-time Balsamiq mockups to illustrate concepts and address concerns

Developing a Solution

The redesign process involved several key stages:

Initial Exploration Meeting

During our first collaborative session, I presented findings from user interviews, especially highlighting the accountant's pain points as the primary user of the payments system. We discussed the product manager's initial mockups, which still maintained the separation between single and batch payments.

Addressing Competing Concerns

A key challenge was balancing the product manager's concern about making sweeping changes against the need to address fundamental usability issues. By clearly communicating how the accountant's specific pain points reflected broader usability problems, I was able to gain alignment on the need for more substantial changes.

Prototype Evaluation

After the developer created an initial mockup based on our discussion, I identified additional usability concerns:

  • Users would need to click through multiple dropdowns to access functions

  • The batch payment interface still lacked visibility of the remaining balance

Developer mockup after the first meeting

Collaborative Redesign

During our follow-up meeting, I created live mockups in Balsamiq to demonstrate alternative approaches. This real-time collaboration led to several breakthrough realizations:

  • We could consolidate all payment types (single, batch, scheduled, unscheduled) into a single interface

  • The remaining balance information should always be visible at the bottom of the list

  • Tab navigation could be used to efficiently add payment lines 

Final Solution

Mockup created through collaborative redesign

The redesigned payments interface featured:

  1. Unified Payment System: A single interface handling all payment types, reducing complexity and maintenance requirements.

  2. Improved Information Architecture: Persistent display of the remaining balance at the bottom of the payment list, eliminating the need for scrolling.

  3. Efficient Keyboard Navigation: Optimized tabbing sequence allowing users to stay in keyboard mode for faster data entry.

  4. Contextual Controls: Payment type options (regular/supplemental) presented in context where they're needed rather than as separate interfaces.

  5. Streamlined Batch Processing: More intuitive handling of multiple property payments from a single check source.

Outcome and Next Steps

The developer implemented an initial version of the new design based on our collaboration. Future plans include conducting formal usability testing once the team has bandwidth to work with me on it. 

Key Learnings & transferable insights

This redesign represents a critical first step in transforming the internal tool into a customer-facing SaaS product by addressing fundamental usability issues that would have otherwise hindered adoption.

The key accomplishment was creating a solution that not only addressed immediate pain points but also established a foundation for the product's future evolution, demonstrating my ability to balance user needs, business requirements, and technical constraints.

Previous
Previous

Regional Fedora Hubs: Location-Based User Connection