CRAFT A LOVABLE ACCOUNT MANAGEMENT PORTAL
Fundsflo Account Management Portal for Large Dollar Purchases
As recently as three years ago, there was no easy way to minimize the risk of a high-value transactions. Payment processing models either completely ignored or did a very poor job at helping to protect buyers and sellers of large-dollar goods and services. How could a consumer know adeal is legitimate? Savvy buyers and sellers needed a more tangible way to safely transact business. FundsFlo’s aim is to change this paradigm. FundsFlo essentially acts as an intermediary between the buyer and seller during a high dollar transaction. In its simplest iteration – a purchaser buys some goods and, upon approving the purchase, the funds go to FundsFlo – where they are held. Once the buyer receives the purchase and affirms it is to their satisfaction, they approve the payment and the funds flow to the seller.
I was the lead designer for Fundsflo’s account management portal, where individual and company users manage their bank accounts and assigning permissions to other business users. I took ownership of FundsFlo's first design system in early 2015 and worked with one other UX designer and an engineering teams to create and incrementally roll out the system. I was also responsible for developing its branding and visual language.
I have omitted confidential information in this case study to comply with my non-disclosure agreement. All information reflects my own opinion and does not necessarily indicate the views of the employer.
The initial competitive analysis of existing user and account management portals on the market revealed a grim picture. Most of them were strictly utilitarian in their design and often came across as dated. What’s worse, some of these systems are so cumbersome to use that their users often dreaded performing account management related tasks.
How could we craft a portal that makes user and accounts management feel easy, while also giving users confidence in the security of the system?
My goal was to give administrators the ability to seamlessly manage and track users and business accounts for transactions.The newly designed portal would not only enable buyers and sellers to setup their accounts all through self-service, it would also minimizes payment risk through an integrated verification system.
Identify User Groups and Main Tasks
To solve the problem right, we had to first identify the major tasks that users needed to conduct through our portal. After several conversations with the FundsFlo team, we narrowed down the list to two main user groups of the portal: individual users and business administrators. Both groups had some identical needs for tasks; such as maintaining profiles and managing bank accounts. However, the business administrators also needed to manage company information and other users.
Considering that FundsFlo users are goal oriented when coming to the portal, I decided to use these distinctions to structure the navigation of the site. As individual users didn’t have requirements surrounding managing user roles and other users, a choice between creating a personal account and or a business account is provided up front when visiting the portal. This allowed us to separate the experience and let our users stay focused and efficient.
Ad-Hoc User Roles
In interviews with company admins it became clear that one main challenge for them was managing different user roles. Many systems were not flexible and pre-dictated the permissions under each predefined role. However, I knew that each business is different and there may not be a single model that could fit them all.
I decided to leave the user role creation in the hands of the admins. Who else would know their needs better than themselves?
Another question was whether to keep user role management within user profiles. Ultimately, there were two reasons that made me separate the two sections navigationally.
User role would apply to more than one user so to have the editing capability within the user profile would potentially cause user errors and confusion. The admin may not realize that all people sharing the same role now get new permissions while operating under one particular user.
After I listed out all the potential role permissions, which was more than a dozen, I decided that a separate space dedicated to creating and editing roles would make it more intuitive to the user and easier to maintain a clear interface.
For each role customization, I deployed a simple list builder pattern. In the navigation I created two lists side-by-side. The list on the left was all the possible permission options. The list on the right was the selected options. A plus button allowed users to move the selected items on the left side to the right side box. There was also a minus button that removed the selected items on the right. Once the permission are moved from the left, the option stays disabled so no duplicate items can be added to the right hand side.
After discussions with our engineering team and the client, we decided to go with micro payments for bank account verification. In this method two small test deposits are sent to the users bank account to verify that the system has the correct bank account information. The micro deposits usually arrive in a business day or two and users can see them in the bank account transaction history. The user must then log back into FundsFlo and enter these amounts to finish setting up the account. Any small deposits sent to the bank account for verification purposes were withdrawn from that bank account within 10 business days.
Although this method is widely used in the industry, I tried to provide enough guidance in the portal help to users who are not familiar with the process. Additional context was given in a info bubble that’s expanded when users clicked on the dropdown arrow.A red error message was displayed in the case of a micro transaction failure. However, I knew that sometimes it may not be enough to inform user that something has gone wrong without helping them to find a solution. With that in mind, I also offered specific instructional information within the interface so the user knew what to do as a next step to resolve an issue.
Modernize The Brand
FundsFlo’s identity needed to convey a modern, friendly and trustworthy brand. I chose a combination of navy and bright green to achieve a balance of these attributes. After a few trial roundsl, I eventually went for a clean and simple font, Open Sans, for the logo. Open Sans is a sans serif typeface with great legibility and a neutral, yet friendly appearance. What’s more, the font is optimized for print, web, and mobile interfaces so it would be very sustainable across different platforms. I leveraged a mixture of light and bold styles to the two parts of the word to elevate its appearance. A relatively flat design style was used across the app to maintain the simplicity of the interface. The reason for this minimalistic approach is also to make the interface more streamlined and efficient and help users stay focused on their tasks.
In hindsight, I wonder if we could have further simplified the user management by completely getting rid of user roles. In other words, making it so admins could check all permissions that apply to the user as the profile is created without specifying any particular “role" Of course, the trade-off would be there is more work required to review all the permissions as each user profile is added. But, even in this other prospective model, the admin would still need to think through what roles are needed and thus, essentially, what permissions need to be included. One could argue that the mental model would remain the same. To skip the abstract “role” concept and deal directly with permissions might require less demands in terms of cognitive load.
Another downside is that without user roles, if multiple users share the same permissions, the admin would have to go change each one individually rather than to editing one and cascading permission changes at the role level. So, it may turn out to be more challenging for large corporation admins who need to deal with thousands of users. We were under a tight deadline during this project, but given enough resources, running usability tests on both approaches and fully examining the needs of FundsFlo admin users could have yielded useful results.
"Fundsflo facilitated my sale. So helpful, loved it. Made my life a lot easier in sales.”
"The site was really great and made my life a lot easier!"
The in-app ease of use rating was 8.9 out of 10 only 3 months after the launch of the portal. We’ve also saw many positive user comments with people raving about the system.