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:
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.
Manual Workflow Management: Users had to manually add payment lines rather than the system intelligently handling this based on remaining balances.
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.
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:
Unified Payment System: A single interface handling all payment types, reducing complexity and maintenance requirements.
Improved Information Architecture: Persistent display of the remaining balance at the bottom of the payment list, eliminating the need for scrolling.
Efficient Keyboard Navigation: Optimized tabbing sequence allowing users to stay in keyboard mode for faster data entry.
Contextual Controls: Payment type options (regular/supplemental) presented in context where they're needed rather than as separate interfaces.
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.