This project is a B2B fund administration SaaS, that provides modern technology and reduces costs for investment managers. Due to confidentiality, a product name won’t be disclosed.
I was hired as the first and only designer on the team to work closely with developers and finance experts. My work consisted of research, designing and prototyping for the main product as well as working on support materials, such as building a website and designing features for possible platform expansion that was not on the main roadmap.
We had lots of assumptions that we not always were able to test and validate due to industry constraints. The lack of innovation in investments combined with all sorts of regulations and compliance created a number of obstacles we had to constantly try to overcome. We also had a couple of major pivots in the strategy, which led us to rethink and adjust our product on the go, adding up to the development time and cost.
Financial web app
September 2018 - June 2019
Fund managers, investors (USA)
6 people
Research, Information Architecture, User Experience, Visual Design
We started with a team discussion to better understand business requirements, gather existing stakeholder knowledge, expectations and create consensus on plans and priorities for a product, its direction and key milestones.
There are over 10,000 mutual funds in the U.S. that are distributed to investors through multiple intermediaries. Most of these intermediaries operate on legacy, expensive on-premise technologies that still employ manual processes and impose multiple layers of operating and distribution costs on investment funds. The industry structure also creates significant operational friction and intermediaries often impose information barriers between fund managers and their customer data.
Simply put, if you need to create a fund, you have to go through the "fund supply chain", which is no other than a bunch of toll booths. Just one thing as registering a fund average between $25k to $150k plus other operational fees. And for that price and headache, you might not even get analytics on your investors: who they are, where are they from, what are their net worth, investment goals, and so on.
About 40% of costs lie in transfer agent, accounting and custody alone
In terms of users, our platform is similar to Shopify model, where the company connects 2 types of audiences, providing the technology for them to operate. We identified who our relevant customers are and prioritize their goals, needs and motivations. This helped to shift perspective from a features-first to a users-first mindset.
Primary users - fund managers
A fund manager is not your average user Joe. It can be anyone or anything who manage the holdings within an investment portfolio and trade them to achieve a specific investment objective. It can be an individual, a corporation, a bank or another entity.
As an example, here are some of the largest investment managers by AUM (Assets Under Management) you may have heard of:
$6.5 trillion in AUM
$5.6 trillion in AUM
$3.3 trillion in AUM
$3.2 trillion in AUM
$2.8 trillion in AUM
$2.7 trillion in AUM
Based on stakeholder analysis and project goals, for phase 1 we decided to concentrate on fund managers who issue and manage securities offered by their corporation. To summarize, their:
Goal: To ensure that assets are managed in the most cost-efficient and profitable way possible
Needs: To have full visibility into the distribution of ownership of their securities and related transactions, capture voting, tax reporting and corporate actions
Must: Comply with industry regulations
Value: Security and accuracy of their data
Secondary users - investors
These are our customers’ customers and they are also quite fragmented. It can be individual investors, like yourself, or institutional investors such as pension funds, retirement plans, governments, educational institutions, insurance companies, and more. We wanted to start with a broader use case for our product thus picked an individual investor to pair them with fund managers. To summarize, their:
Goal: To make money with low-risk high-return investments
Needs: Data transparency, low fees, freedom of choice
Must: Report on taxes
Value: Accuracy and efficiency of their actions
We analyzed and found several reasons why active funds facing pressure and losing customers, but I want to point out 3 of them:
Legacy software: The existing technology for fund administration is outdated, and most managers have historically not invested in software development for their businesses. Instead, managers have chosen to focus on the “investing” side, but in today’s world, it is extremely hard to separate the capabilities of any business from the technology that powers it.
Value leakage: The data and communication between the manager and investors are hidden and indirect. In a world where direct to customer platforms have created enormous value, for fund managers, data is often hidden by intermediaries and there are multiple points of value leakage.
Rising competition: The increase of robo-advisors (digital platforms that provide automated, algorithm-driven investment strategies and asset allocation) and the availability of exchange-traded funds (ETFs, whose portfolios mirror a benchmark index) making them more appealing to consumers to invest. They both can charge far lower fees than human fund managers often charge.
We also determined that large funds and fund families are less likely to adopt new solutions due to institutional biases, whereas a lot of smaller funds with more acute pressure and higher willingness to innovate, will more likely to adapt to new tech.
After thoughtful considerations taking all available data into account, we identified and set 3 high-level product goals that meet user and business requirements:
Digitize paper and PDFs in customer onboarding and security creation
Automate processes like reconciliation, payments and compliance
Enable real-time access to customer’s data for managers
In other words, we wanted to create a cloud technology that provides automation, removes significant costs, eases barriers to entry for new funds and provides direct linkages between the funds and their investors.
Designing for a data-heavy platform resembles the work of a sculptor – you start with a massive block and then slice it away until you reach just the right thing. Data-driven applications are different in a way, that less data often means a less practical and useful solution. Keeping all the data you can, however, yields an unworkable app. It’s all about finding a balance, prioritizing and organizing features according to the main use case.
One of the problems we tried to solve is fund creation process. Today, apart from being expensive to register a fund, it’s a complex process that takes days to set up and may require legal help to make it right.
I started working on transferring the setup process to the digital dimension. From the beginning, we knew we would want to have more security types in the future, so the ease of scalability was one of the main requirements.
With a goal of making this process no more difficult than creating a group on Facebook, I designed a simple flow that guides the manager through the setup process, gathering all the required information related to a fund, taking roughly 5 minutes to complete.
As easy as setting up a Facebook group
Initially, I wanted to make it straightforward, where the manager fills the information step by step. However, setting up a fund is a critical task for managers who may want to spend more time and consideration before making it live. After a few tests, we decided to make it more flexible, allowing managers to skip steps and fill data as they want with easy drop-off/return cycle and automatic data savings.
With today’s tech, the investor onboarding can be exhausting. Sometimes, it even requires a physical presence at the manager’s location. It also involves reading through dozens of pages of contracts and forms, filling in the same information again and again.
To comply with financial regulations, we had to build a crucial part of any investment software — KYC (Know Your Customer). It is a standard due diligence process of identifying the customer, their residence, investment objectives and suitability. On a grander scale, it prevents money-laundering and protects both parties in a business transaction and relationship.
After multiple discussions, tests and iterations we decided to create a full onboarding experience from start to finish where the user not only creates an account but also completes the main objective — investing in a fund.
Sign up + the main objective in a single flow
I made it in a modular way to:
Give us the flexibility in adjusting the flow based on account types
Give the manager an option to set up investor verifications as deep as they need
It may feel like a long onboarding, but as tested, the whole process from registration to buying a fund takes under 10 minutes at a normal pace. It’s an optimal sacrifice for security and industry compliance.
To compensate for this, once the investor has been verified with at least one manager, they can reuse their KYC data to sign up to a different fund manager with a single button, like you sign up to different apps with a Facebook account.
The Transfer Agent (TA) is usually a third party institution that plays the role of a record keeper and transaction processor. In simple words, it provides a database of who are the shareholders and what shares of what fund they own. It is a hub that connects the fund with its investors and handles the process anytime there is a transaction between the two.
Surprisingly, despite the importance of TA, there is not much progress done industry-wise:
It’s still common for records and transactions to be kept offline and maintained manually, which leads to a higher chance of failures on the TA side and serious business consequences
Most TAs are extremely expensive and can charge an issuer any amount of money they want for absurd things like paper clips
There are no meaningful entry standards. Unlike other financial service providers, like brokers, TAs don’t have to be licensed or certified
Aside from word of mouth, there is virtually no way to assess their competency and get insights from existing customers or shareholders about their quality of service
What makes it more difficult, TAs are often constructing binding agreements and high termination fees in case the issuer wants to leave
I spent weeks researching and analyzing the existing solutions, trading platforms and other experiences that have elements or qualities we wanted to achieve. The hardest part was the lack of available data because a lot of proprietary investment solutions are extremely hard to get. Our CEO made a huge contribution to research by meeting up with top execs of large firms to gather feedback on products they use and their ultimate goals.
CEO’s product vision, a brainstorming session
Every feature we worked on was evaluated and prioritized through the lens of a specific user group. For phase 1, we set a goal to enable the TA to:
Process money going in and out for subscriptions and redemptions
Process the payment of dividends from the fund to shareholders
Generate tax reporting for income that is passed through the fund to the shareholders
Conduct and manages votes
Distribute various forms of communications
Provide an up-to-date fund and investor data repository with real-time analytics
We had multiple design iterations and many ideas didn’t make it to the cut. For example, I wanted the investor to have a handy dashboard to see their equity at a glance. As we found out, most investors will have 1-2 funds and there was no value for an added feature. It’s important to always ask yourself who are you designing for and push back on unnecessary elements to avoid feature overload.
Due to project confidentiality, I won't cover branding here but will walk you through a few design decisions I made.
Having too many colours may confuse the user or bring their attention to less important areas. I always start my designs in b&w as it’s easier to concentrate on layout, element spacing, usability, readability and accessibility. I mostly apply colours if I want to highlight something or show the added value that can’t be shown in b&w.
For the main colour, I decided to go with a shade of blue as it’s proven to project an image that is calm, trustworthy, reliable and secure — something that aligns well with an investment product we were working on. And since we built a white-labelled experience, the main blue can be replaced with any other colour that matches the manager’s corporate style.
I also wanted to highlight some elements that either provide an important message or directly influence the user’s account. For that matter:
• Green is used for investment gains or success messages
• Red for investment loss or failures
• Orange for warnings and status labels
We identified that the majority of managers will be accessing the platform through their desktop devices, whereas investors are more fragmented between mobile and desktop. We assessed different frameworks and UI libraries to find the most fitting solution in terms of speed and suitability for our project and picked Vuetify component library.
It’s built on Google’s Material Design (MD), which is great, but I find a simple following their guidelines can bring a few problems:
The usability of some MD components is questionable and may hurt the experience
The product loses its personality by being too similar to any other app made with MD, which may lead to trust bias. I didn’t want to risk that when building an investment application, so I made some visual changes
Some of the updated components
When working on components, I wanted them to be:
Robust, look fresh and modern representing the high standards we set for our product design
Accessible to work for all of our users, regardless of how they navigate and interact with the app
Flexible to support easy scalability and the variety of use cases within our product
I started working on a few key screens in low-fidelity to find the best solution in terms of usability and scalability. After testing and refining, the overall layout started to shape into the unified structure that can be applied for different types of users and their use cases.
The main layout with random data
Top bar, where users control their profile settings, search for things and can access recent profile activity
Sidebar with nested navigation throughout the platform
The main area for the main content
Without getting deep into 200+ page design, here are 3 samples and design choices I made.
Manager's view on balances
1. Adding breadcrumbs
Breadcrumbs are important to have as a navigation element to support wayfinding, making users aware of their current location within the hierarchical structure of the app.
To save some space, I also made them more prominent and used as page titles. All steps except the last on the path are links to parent screens.
Investor's view on fund details
2. Grouping content into cards.
Cards allow the user to browse content like surveying a store shelf. They are quick to scan and easy to attain an overview of the information they contain.
They also work well for responsive design because of their flexibility. The content can be reordered to fit any screen which enables a visual language and unifies the experience across various devise types.
Investor's ID verification
3. Buttons styles
As previously mentioned, I worked over Material Design elements and buttons were one of those areas I wanted to change.
In particular, I got rid of:
Text buttons without a visual container, like links. Due to its smaller target on touch screens, it feels awkward for users when they press it without having feedback that their touch is registered. It is also unclear where the button’s boundaries are and forces users to move their finger or cursor with precision and more effort to hit the target.
All-caps text buttons. Google promotes this uppercase style, and in some ways, it tries to combat the problem of a small target by visually increasing it. On the other hand, sometimes it makes it harder to read, specifically for dyslexic users. People rely on the shape of letters to identify words. Uppercase letters don’t have contrasting ascenders and descenders, making words harder to read at a glance.
In total, I made 4 styles for various purposes:
• Primary buttons — for major actions, always in the main accent colour
• Secondary buttons — for the secondary actions, same style as primary, but grey
• Outlined buttons — to select multiple options where available, usually on forms
• Icon buttons — for some rare actions like table column settings or delete a document
There is a strong trend of reducing complexities in design. This works in consumer apps with single and simpler goals, but when you design for enterprise products, not always you can (and should) do it. We built a product for a specific audience that values functionality over the look and feel, has certain expectations and goals.
Having a small agile team allowed us to move faster without noticeable compromises either on the design or tech side. We managed to introduce a significant amount of improvements compared to what the industry operates with today. At times, there were hundreds of challenges building certain elements that fall under industry regulations in such a short time.
