— CHUX Long Form Case Study —
I was the lead designer, engaged in all product design tasks from research to design QA after handoff. The MVP project was in 2019. The post-MVP project was in 2023. The Investor Portal was a B2C SaaS platform connected to the other products in BondLink's suite.
Check out the transformation from the first, pre-design team version (before 2019), to the redesign MVP, to the post-MVP enhancements. Clicking the link above the images below will open a lightbox with the relevant version's mockups.
Then read the case studies for MVP and Post-MVP by choosing the relevant tab.
How might we build an active community of investors for muni bond issuers to share valuable financial insights in an accessible, user-friendly way?
This most recent update for the Investor Portal is AMAZING!!!!!
Love this product!!!!!
BondLink's main customer is Issuers, with a mission to lower their cost of issuance through the value proposition “more Investor traffic to your bond sales.” To do this, we must cultivate an active and diverse ecosystem of municipal bond Investors on our platform that issuer-users have direct access to.
BondLink already had an Investor Portal with only two features. The redesign aimed to improve the experience for buy-side professionals and grow an engaged community by building on recent updates to BondLink’s brand, design system, and Issuer Sites.
Investment research for muni bonds is tedious and expensive. There are many platforms for investors. However, most are not very user-friendly, overloaded with quantitative data of numbers and statistics in compact tables, and/or cost up to $24k/yearly. To truly deliver on our “more Investor traffic to your bond sales” value proposition to Issuers, BondLink must cultivate an active and diverse ecosystem of municipal bond Investors.
We will cultivate a greater and more consistent share of Investor attention by giving Investors:
As a result, our issuer-users will benefit from a larger pool of investors with BondLink accounts.
As a user, I need to be able to...
Surveillance: As a credit analyst at a major bank, I'm a regular Investor for a handful of Issuers. I need to surveil the Issuers behind my investments on a frequent basis in a way that is not time-consuming and cumbersome, so that I can make informed decisions when investing.
Discovery: As a research analyst at a wealth management and financial planning firm, I work with portfolio managers to give clients customized planning and investment solutions. I need to quickly discover the most active Issuers with up-to-date information, so that we can identify new credits we've never evaluated.
Daily Overview: As a portfolio manager at an investment bank and financial services company, I have multiple analysts on my team to do the thorough research. However, I still need to monitor my credits' activities at a high level, so I can keep tabs on my investments without the need to wade through all the other financial platforms to piece together a general overview.
The first Investor Portal was extremely bare bones, and if you looked at the user metrics, you could even describe it as useless or abandoned. Our product director came up with the above feature requirements and told me to run wild. I began my research with a comparative analysis.
Trading platforms are all different, and yet all the same. They all have an overview of current holdings and tools for surveillance of current assets and discovery of potential investments That made them a good place to start for research.
The Investor Portal is a standalone product that talks to and interacts with our other products. The vision for BondLink is an ecosystem–active with original issuer content, authentic communication, and market updates. For research and inspiration, I looked at the most bustling, active--albeit chaotic–ecosystem the world has ever seen: social media.
Finally, I looked at other big muni platforms: MSRB EMMA, Diver, IPREO/IHS, BondclIQ, and now-defunct Neighborly.
The old investor portal’s value was saving documents and managing subscriptions to issuers. After looking at the usage for those two features, we saw that investor-users were not saving documents, but they were subscribing to issuers. We removed the document saving. We then had to deal with subscriptions.
Before the issuer sites redesign, subscriptions were mainly email notifications. As we built features for investor-users to interact with issuers directly in the BondLink platform, we introduced bookmarks to allow investors to visually track issuers they cared about within their accounts. Now, when visiting an issuer’s site, investors could bookmark the issuer or just specific bonds to receive relevant updates both by email and within the platform.
Current: The Investor Portal had a very simple structure. A user logged in and landed on My BondLink and could do four things: view saved documents, see notifications, manage their subscriptions, and manage their account settings.
New: We quickly realized one page would be congested, so we created pages for the different content types and use cases. After a few rounds of feedback with internal and external stakeholders, we tweaked the portal's structure and made some sacrifices for the MVP. As a compromise, we took a progressive enhancement approach, implementing the low priority pages post-MVP, and in the meantime, link to their existing pages.
The white boxes are the pages we planned to launch for this phase. The lighter green boxes are pages either in progress or still part of the old portal to be moved over after launch. The darker green boxes are descriptions of the pages.
The Dashboard was where we put primary focus. This would be the most important part of the portal, and we had to decide what the purpose of the Dashboard would be.
Discovery: Are investors looking to find new credits/issuers to invest in?
Surveillance: Are investors looking to manage and organize their portfolios?
Personal activity: Are they looking to organize their BondLink platform usage?
Overview: Are they looking to keep up with the market and multiple issuers generally?
What part of what we offer is the most important to investors to put it front and center? We decided to make it an overview of the whole platform's features and emphasize bookmarked content.
To help you make sense of my nonsense photos, I wrote a bunch of ideas down on a napkin and then transferred them to my sketch file by writing them over a photo of the Dashboard whiteboard sketch from the brainstorm session. I wanted to incorporate:
There were two components we already created that we knew we wanted on the Dashboard:
Half of the major requirements on the spec were related to surveillance and discovery. Investors needed to “quickly understand which favorite Issuers have made updates to their sites, quickly view activity/updates from favorite Issuers, and easily find new BondLink Issuers.” To assist in surveillance and discovery, we created dedicated pages for each content type the investor-user could bookmark.
One of the content types was issuers. We decided to make a page called Your Issuers that hosted your bookmarked issuers and activity from all issuers. The inspiration came from social networking sites to reinforce the idea of a BondLink universe with content a user could only find here.
The other was bonds. We already had a bond sale calendar on the corporate site, but we decided to put another calendar on its own page with enhancements for investor-users only.
The first Investor Portal lacked color and engaging visuals, so we wanted to make sure that changed. After deciding on a light mode scheme, we needed to determine the right accent colors. I went through our different company colors.
On our corporate site, we use "BondLink Blue" as the primary color and "BondLink Green" for the secondary color. I used the good ol' find + replace function to see what a range of color palettes would look like. It became clear that some colors would make the Portal look very distracting at best, and completely inaccessible at worst. We needed a darker color that looked better on web, so “BondLink Teal” #15625e was born.
Something didn’t work once actually designing the page in Sketch.
Because the Issuer Overview Cards took up so much screen real estate and they were already on the Dashboard, we took them out, leaving only the activity feed. If a user wanted to see activity from their bookmarked issuers, they could filter to just bookmarked issuer activity. We renamed the page Issuer Feed.
We tried a card-based treatment for the bond sale calendar because the rest of the portal used cards.
Ok, so maybe not cards. It didn't make sense to deviate from our design system and create a new type of card, nor did it make sense to introduce a page with a pure white background when we didn't use that color anywhere else. If content is king, consistency is queen.
Additionally, each bond sale listing needed to have the capacity to include:
Not only did every item have multiple data points, but there also could be many items. The way we could accommodate multiple data points and multiple items was with a table.
The first section Your Issuers had two tabs, Recently Viewed and Bookmarked. Recently Viewed refreshes the user of their last visit to the platform by showing them the last three Issuers they were looking at via their Issuer Overview Cards (IOC). Bookmarked shows them the IOCs of their bookmarked Issuers, paginating after 3 rows.
The second section Bookmarked Bond Sales had three tabs, Active, Recent, and Unscheduled. Active has cards with the information for bookmarked issuances that are coming up or currently happening. Recent has bond sales from the last quarter. Unscheduled has bond sales without a set date.
The third and last section on Dashboard is Bookmarked Issuers' Activity—a timeline of bookmarked issuers’ BondLink activity organized reversed chronologically from the most recent activity to the oldest up to ten updates. At the bottom is a button that links to the Issuer Feed page.
The Issuer Feed is a page that I took inspiration from (Jack Dorsey’s) Twitter. The design is an ecosystem-wide version of the timeline on the Dashboard.
Content: The feed content is a real-time feed of issuer activity in cards with details and a link to the issuer’s site. There is a line going through each card to denote continuity–to show that even though these are different Issuers, they're all part of the BondLink ecosystem, sharing content only available on BondLink. Each card has an icon denoting activity type.
The white icon stands out to give attention to new BondLink Issuers. Inside the card, we put the date and time, text description of the actual activity (e.g., Issuer A uploaded 3 documents, Issuer B added a new project, etc.), and a bookmark icon with functionality to bookmark/unbookmark the Issuer.
Filters: The filters included the ability to search, choose the time frame of activity, choose the activity type, and toggle between all Issuers and just bookmarked Issuers.
Though we wanted to differentiate the calendar behind the login in the Investor Portal from the corporate site's, we took some of the same styling. We kept it on a table, but with additional features: ability to download related documents, see the roadshow, and bookmark the sale. Additionally, to give the users' bookmarked sales a little extra emphasis, I added the issuers' seals next to their bolded names.
We released the MVP in 2019. It got great reviews and achieved our goals of increasing signups, average session times, and daily active investor-users. Over the next couple of years, the number of investor users increased by nearly 500%.
Scroll back up to the tabs to read the next case study about the post-MVP enhancements
How might we eliminate confusion and increase usability for new Investor Portal users?
This most recent update for the Investor Portal is AMAZING!!!!!
Love this product!!!!!
We received a lot of positive feedback about the redesign when it first launched, because investor users were happy with the enormous updates. After the new shine wore off, we received feedback about one thing in particular. When a new investor signed up, we dropped them on the dashboard with no guidance. We clearly needed to implement an onboarding process.
The discovery phase became a can of worms that ultimately was good, because we took the worms, went fishing, and caught some big ones. We let them go, though, to be humane, of course. Catch and a sorely needed post-MVP, large scale release.
When I read my case study for the MVP, I look back on my younger self and think “if only you knew, kid,” because the introduction of bookmarks, though specifically requested by the business, complicated the concept of notifications. At first, it seemed appropriate to merge notifications and bookmarks. Then, as we saw the features being used IRL, we realized that we needed to separate them.
New users of the Investor Portal sign up for a new account and immediately get dropped onto an empty Dashboard without any tutorial or explanation. Users become confused and miss some functionality, leading to poor UX or abandonment of the product.
We hypothesized that a guided onboarding experience would lead to higher retention and enable users to navigate the portal more effectively, encouraging them to explore features and fully engage with the platform.
Users of the platform don’t understand the bookmarking and notifications feature because we use inconsistent terminology and UI across the different platforms, as well as offer an unwieldy level of customization. Because users don’t understand and cannot control the feature, they become fatigued managing their bookmarks and notification preferences.
We hypothesized that separating the two concepts and being clear and consistent in functionality and UI would encourage more engagement and provide a better user experience.
We began by addressing the foundational issues before moving on to onboarding. We performed an audit of all the places across the product suite that had a mention of notifications, subscriptions, or bookmarks.
We then collaborated cross-functionally to nail down the terminology and rules around it, once and for all. Here’s a breakdown of our approach:
Problem: Initially, a user could go to an issuer and get notifications for everything on their site from a specific document category upload to a new bond sale. They could also bookmark the whole issuer, which, on the issuer sites, meant the same thing as subscribing to notifications. However, on the investor portal, notifications were not mentioned until you tried to un-bookmark an issuer or bond; and then, the unsubscribe modal popped up with no mention of bookmarking. And in the database… Well, I didn’t envy our backend team at all.
Solution: We redefined notifications as “alerts” and simplified them by enabling users to customize alerts by content type rather than by issuer. This streamlined system provided a clearer and more user-friendly way to stay updated on key content.
Terminology: Next, we revamped bookmarks, changing its name to “watchlist” and making it easier for users to save and monitor content. Improving the notifications streamlined the user flow for adding something to the watchlist because there was no extra form to fill out for specific notification settings.
Grouping: Between the MVP and now, BondLink introduced new hierarchical levels and groupings throughout the products to help with categorization and data specificity: states, sectors, and programs. For the watchlist upgrade, we had to make it possible for investors to add states and sectors to their watchlists.
Users had difficulty adding/removing multiple watchlist content at one time. Before, an investor had to search for an issuer. If the issuer was not there, it was frustrating for them and looked bad for us. If the issuer was there, they had to navigate to the issuer site, add the issuer or bond to the watchlist, then go back to the portal and search again. It was disjointed and clunky.
By allowing investor users to add sectors and states, they knew that they wouldn't miss anything in those groupings. However, it was really tricky establishing consistency and not introducing any unexpected behaviors.
State and sector were content grouping types by issuer attributes—information, not tangible content items on issuer sites. Issuers, bonds, and rfps were tangible. Issuers were special in that they were a tangible content grouping.
We had to figure out what happened when a user added or removed each level to their watchlists.
Dedicated Watchlist Page: Previously, users could only access their watchlist through a filtered view on the Issuer Feed, a limited setup. We introduced a dedicated, more intuitive “Watchlist” page in the Investor Portal. The page distinguished between content users actively added versus content included in a watchlist grouping.
With the updates to alerts and the watchlist in place, we were finally ready to design a comprehensive onboarding experience for new users that ensured they started their BondLink experience with a clear understanding of how to navigate and utilize our offerings.
After multiple rounds of feedback and working with engineering, we came up with a five-step onboarding process. For this release, we did not implement an app tour, because we had more research to do about using a third party like AppCues or building it in-house.
