B2B Annuity Website and Portal

The Goal
Create a modern, user friendly, and responsive website and portal that would educate financial professionals about our client’s business and allow them to manage their clients and book of business.

The Problem

Agents using the portal took a long time to learn how to use it and often complained about the poor user experience.

The Team

  • Project Manager
  • UX Manager
  • UX Designer
  • Creative Director
  • Visual Designer

The Tools

  • Visio
  • Sketch
  • Zeplin
  • Aha!
  • Chalkmark

The Discovery
Research for this portion of the Annuity website was difficult because we didn’t have access to competitor’s portals to be able to know what they were doing. Instead, we worked with the stakeholders through a workshop to better understand how their portal worked and any pain points their users were experiencing. For the financial professionals website, we were able to do a competitor analysis to determine how best to bring our client’s website in line with the industry standard. Following these activities, we wrote a business requirements document that outlined all the major features we should include, analyzed their information architecture and proposed a new sitemap that helped simplify their navigation across both the website and the portal.

The Process
The site architecture for the portal was a key part of this project because the abundance of features accessed from the portal meant a lot complexity in the portal, which we wanted to improve. We went through many iterations of the site map in order to work through this piece before moving on to the wireframes. The most important page of the portal project was the dashboard – the existing solution had a dashboard that didn’t necessarily help the users achieve their goals. We worked with the client to reimagine the dashboard with new features that would help financial professionals immediately find information that was relevant to them on the first page.

For the remaining pages, we used a content audit of the existing site to understand how best to wireframe pages into specific templates. We carefully considered the content for relevancy and hierarchy on the page using a mobile-first approach. By understanding the types of content we needed to use through a content audit, we were able to design on a pattern or component level, which allowed for the creation of reusable elements that could be combined in a multitude of ways to create templates. This greatly aided in an efficient handover to the client’s development team at the completion of the project and allowed the client to scale the project as needed once we handed over the work.

The Final Outcome
Once the wireframes had been signed off, they were given to the visual designer to skin. A few weeks later, I was able to take the final visual designs to create an unmoderated quantitative first-click test in Chalkmark. After writing a test plan, in which we outlined the goal of the usability study, the criteria for the users, the tasks they would complete, and the pre- and post-test questions, we built the study in Chalkmark and ran it for about two weeks. We ended up with under 100 participants, and received a lot of valuable feedback. Presenting those insights back to client, we were able to decide which changes to the design should be implemented – they all ended up being minor but important tweaks that greatly enhanced the experience. We look forward to seeing this portal built so that the agents can more easily manage their clients and book of business!

This is a unique website which will require a more modern browser to work!

Please upgrade today!