Case Study

Brokermate

Brokermate is a financial technology platform, that provides all the tools required to run a successful brokerage. Until now, brokers have had to rely on several different technologies to manage their business. Brokermate eliminates these layers and brings together everything you need in one solution.

Brokermate Logo

Challenge

While developing a highly complex brokerage management and client interaction application, Brokermate discovered that new users needed a way to quickly get started using the service.

Brokermate Home page with a few tours completed
Brokermate Branding Tour first step
Brokermate Branding Tour first step telling users to open the nav menu

Solution

Integrating the Shepherd site tour library, we were able to manage multiple visual guides for first time users to add required settings and communicate to them how the applications functioned. This was done in a way that lead new users to a home setup page, then tracked each tour state to ensure completion.

Brokermate Branding Tour step to lead user to configuration page
Brokermate Branding Tour step to get user to update information
Brokermate Branding Tour completed

We leveraged the existing Shepherd and ember-shepherd libraries, and added additional features to them, to allow us to fully customize many steps, and accommodate design requirements. The site tour we created helped walk the users through several different app features, and illustrated the location of these features, in the app they are currently using. We also added step tracking, throughout the app, to ensure that users completed certain steps, such as changing pages or adding account settings, before transitioning to subsequent tour steps.

Brokermate home page with Arabic
Brokermate tour started using the correct language

Finally, we needed the tours to integrate into application features, such as translations and transition animations, so that they felt like an integrated part of the application, as opposed to an add-on.

Outcome

New users are now shown a list of tours, to help add required configurations and quickly get them familiar with the application. The user is scoped to either completing the action asked in the step or canceling a tour, in order to return later.

They begin tours with customized tour themes that integrate naturally into the application flow. All features for this global application were applied to the tour initialization allowing for international, routable, and trackable tours.

Brokermate Tour with a detailed step on desktop