top of page
Screen Shot 2020-03-26 at 1.46.44 PM.png

Financial Health, by Sirono

Designed for: Sirono LLC

Sirono aims to improve the financial experience for medical companies. "The idea is that any Contact Center Agent who speaks with a patient will have the information and tools to be able to have a discussion about the financial obligations. Essentially, any Contact Center agent becomes a collector." As is often the case, time was not on our side. I joined the project two months before we needed an interactive prototype for clients.

Screen Shot 2020-03-26 at 1.46.37 PM.png

Financial Health
With such a short time frame it was important to build on what we already knew. Our users are calling patients and collecting payment info over the line. They didn't have the ability to view a lot of information. It had to be a quick, fluid process from start to finish.

For this project I chose Figma. On a short production timeline it was important to get feedback from shareholders as quickly as possible. We had the user flow already; the design of the app just had to match their experience within Salesforce.
Testing methods
Due to timeline limitations and, in later iterations, the COVID-19 situation, live user testing with each iteration could not be done.

Each version, including seemingly minor design changes, was shared with our team and stakeholders. I valued their opinion of my design decisions. Even if I couldn't test with users I could get valuable feedback from team members with a wide array of experiences of their own. I sought feedback at every stage of the process from as many eyes as I could get; good design is iterative and collaborative.

User flow and wireframes
We had a well defined user flow. A simple version, explained in this diagram:
The user is performing their normal call duties with the patient.

They can see our app to check the patient's financial standing.

If the patient was consistently paying their bills no action was required; if they were not they could access more information and eventually take a payment from the patient.
But for now this app inside the Salesforce page was our MVP. Our focus was getting this app properly built to get info on the patient and begin the longer process of taking payments.

User flow.png
Base state v7.jpg

The devil's in the details
With the overall structure in place we had to focus on those elements that would support it.

The top row features up to seven icons while the top-right corner has a banner that displays the patient's overall financial status. These are designed to quickly alert the call center worker to the patient's status. If I'm scheduling an appointment with a patient, it may also interest me to see a big red badge on my screen, telling me I should go over billing.

The seven icons on the top row give quick bits of easily digestible info. Is the patient a large donor/VIP for the medical center? Do they have outstanding debt? Are we missing info?​

These sprites pushed us to pivot several times. We tried them on the bottom. We tried different iconography. We tried showing the descriptions without an on-hover. In the end we stuck with this version as it best served our users' needs. Keeping it up top lets the user start with the quick bits of important info. Rather than using descriptions in small type we let the color do the talking; green, yellow, and red are a color pattern users recognize for positive, neutral, and negative.​

We poured over these details many times. Arrows or triangles? Hamburger menu or boxes? 'Take Payment' row or button? In such a rapid process teamwork drove us on many decisions; open discussion brought logic, logic guided design decisions. But the caller wouldn't stop here.


Take a payment
Once the medical center worker discussed the billing situation with the patient it was time to get that information. In our Salesforce environment this would be done in a modal. We wanted to design something bigger and bolder. After all, our user is giving their attention both to this experience and to their patient; we need to make that as easy as possible for them.

Working against this philosophy is the reality of medical billing. Some patients have many, many charges on their account. Each charge has 8 pieces of important information. Some want to pay with checks, credit, or a saved payment method. How can we balance this depth of information with the required ease of use for someone having a conversation on the phone?

We went with a 2-column design. When callers select any combination of charges the total will automatically populate. If the patient needs to know how much the total is, the caller can easily see that information.

In this design, we made it as simple and accessible as possible while allowing that wealth of information to display in its entirety. Our users are in a unique balance; let's let them thrive in it.

All good things...
Unfortunately due to the COVID-19 pandemic, Sirono was unable to continue operations. While we were unable to follow our vision through, experts in the field during the demo process were thrilled at our product and were excited to implement it. 

bottom of page