FinTech Platform for Securities
Improving how securities are analyzed
As the Principal Designer working on a cross-functional team of distributed software engineering and service designers, I had the opportunity to shape the end-user experience of traders for a global financial firm.
Problem Statement
The global financial firm was looking to evolve its single security platform and introduce highly requested features that would convince financial institutions and traders to upgrade their annual licenses, to the tune of nearly $10,000/year/person, representing unrealized shareholder value.
TEAM COMPOSITION
2 Product Owners
1 Product Designer
2 Service Designers
4+ Software Engineers
My Impact
Refined design system for extensibility
Introduced ability to compare securities’ parameters
Increased shareholder value of platform
Quality controlled new feature development
Creating Value on a Financial Platform
Stakeholder Collaboration
To design the new feature sets, there had to be a strong connection to product leadership who understood the nuances of the asks from executives, and a collaboration between that team, the designers and the engineers.
In the ever-evolving world of finance, creating an efficient and user-friendly platform is a challenge that requires not just innovation, but also a deep understanding of user needs and domain. The team that was brought together for this project consisted of subject-matter experts, a detailed project manager, and a distributed team from the vendor company, including product designers and software engineers who were tasked with working on the front-end implementation and middleware.
The collective team was tasked with creating value for existing and new traders across the web-based platform, but not to extend the platform too far outside the realm of what traders came to expect. This project involved the creation of components for an existing design system, extending that system to encompass new elements and ideas, and forging new interaction patterns that would not only enhance user engagement but also entice traders to buy-in to the platform. Upon providing the environment for a viable feedback loop via interactive prototypes, to be demoed to stakeholders and sales, the design team conducted a handoff.
In conjunction with the subject matter experts, the team designed custom components for data visualization across disparate sources. We were tasked with a consideration of how many data sources could be laid out in a visually pleasing way, without overwhelming the end-user. In working with the data sources, we noticed how percentages could be displayed in various ranges, depending on their max values. Diving into how to represent geographic distribution led us towards a grid approach for displaying states, and a legend to determine percentages.
Extending the Design System
At the heart of our mission was the refinement and expansion of the existing design system that was inherited from a recent acquisition. This system was the foundation upon which we would build a seamless and cohesive experience, in line with expectations that traders had come to expect across the suite of products. We began by analyzing the system, identifying areas that needed enhancement, and crafting custom components that would align with our vision. These components were extended to incorporate variants, building on their usability.
Design Systems & Standards
To ensure consistency, the team and I adhered to the existing system's look and feel through visual design, interaction patterns, and typography to maintain a integrity across components.
In a handful of instances, the system could only provide so much flexibility, so we had to create our implementations to align with the needs of SMEs. We created components ranging from intricate data visualization tools to user-friendly input forms, ensuring that each piece is seamlessly integrated with the overarching design language. This approach facilitated consistency and allowed for scalability for future implementations.
Lesson Learned
We did not have full access to the component library due to permissions and security; we ended up having to design components in a new file. Ideally, one can work in the same file as the design system to keep things accessible and consistent.
We designed prototypical interactions that were tested with users to identify pain points, gather feedback, and validate design decisions. Spending cycles on iterations in the design phase helps reduce cost and de-risk ideas. Continuous feedback was conducted through a system of collecting comments, facilitating communications with stakeholders and subject matter experts, and integrating changes back into components.
Build
Measure
Learn
—
Build Measure Learn —
Convincing Traders to Upgrade
To entice traders to upgrade to the premium package on a per-seat basis, we strategically teased upcoming features. We explored different ways to allow Basic Tier users to view the features or capabilities they were missing out on; through blurring features or data sets, showcasing abilities that premium users had in terms of manipulating data sets, and including pages that were unavailable to basic users in the navigational hierarchy. The introduction of calls-to-actions and corresponding modals to entice them to upgrade were features that we had the opportunity to design and strategize on.
Research and Innovation
We explored new design solutions that challenged the status quo, within the context of the platform so as to align the feature sets with the expectations of the traders, to embrace trust.
The primary goal of SaaS applications is to convert users on a free tier to premium subscribers; our goal was to provide the platform for inching users towards this conversion. Trust is the currency of choice, and the user experience needed to reflect that. Through the thoughtful design and implementation of these advanced feature sets and teasers of the premium package, we created a seamless path for traders to upgrade.
One of the core features of the platform’s introduction of new features was the ability to cross-compare multiple pricing scenarios across several parameters at a time, in a given view. Traders primarily use desktop computers, so our focus was on creating a delightful experience that took advantage of the viewport and leveraged the design system at hand. We ended up creating a custom column-based experience for entering and adjusting datapoints and viewing their output upon calculation. A user can add or subtract up to 10 scenarios.
Ensuring a Smooth Transition
End-to-End Design
Through QA/QC and UAT we ensured that engineering had answers to questions around component implementation and interactions, and previewed our work in test and staging environments for accuracy.
The ‘definition of success‘ of this project was rooted in a few factors, including visionary design and a smooth developer handoff process. With our high-fidelity designs and prepared developer specs in hand, we transitioned the project to our talented front-end software engineers and communicated directly with the project manager to ensure the team had what it needed to implement the features.
Designers on the team played a pivotal role as Quality Assurance (QA) and User Acceptance Testers (UAT) during this phase. We were there to ensure that the nuances of the designed pages and components were faithfully translated into code. By actively engaging with the front-end developers and addressing their questions promptly, we not only ensured the accuracy of the implementation but also fostered a collaborative atmosphere where both design and engineering teams were aligned in. The result was a seamless flow that mirrored our design, and a platform that not only met but exceeded the expectations of traders.
An Evolved Platform
The collaborative effort of a cross-functional team, the enhancement of an existing design system, and the creation of enticing interaction patterns have helped move the product vision forward for the client. We were aligned that our designs met the needs of traders and elevated their experience, ensuring that they are well-equipped to navigate the complexities of the global financial landscape when it comes to single securities.
Outcomes and Results
To capture value for shareholders, I worked closely with a cross-functional team and PO to introduce new functionality that provided the sales team with the ability to convince institutions and traders to leverage the platform in their daily workflows. I also acted as QA/UAT to ensure features were implemented correctly via Engineering.
Disclaimer: Work shown was created while employed at Nearby Creative, delivered on behalf of an agency partner, and displayed with permission. Header image from Unsplash.
