digitalreach - a new and improved content viewer

Client:  BLUERUSH       Project Date:  2018
About the Project
Digital Reach is a platform used by over 75,000 financial advisors across Canada to send content to their clients. When their clients receive this content, they view it in the DIGITALREACH content viewer. The viewer used to only house PDFs and videos, but now that advisors need to send out HTML and other types of interactive content, it needed an update.
My Role
PRODUCT DESIGN LEAD
I led the redesign for the DIGITALREACH content viewer. I worked alongside an agile team of developers, a business analyst and a product manager.
About the Project

Digital Reach is a platform used by over 75,000 financial advisors across Canada to send content to their clients. When their clients receive this content, they view it in the DIGITALREACH content viewer. The viewer used to only house PDFs and videos, but now that advisors need to send out HTML and other types of interactive content, it needed an update.

My Role

product design lead
I led the redesign for the DIGITALREACH content viewer. I worked alongside an agile team of developers, a business analyst and a product manager.

a bit of historical context - the ORIGINAL content viewer

The DIGITALREACH content viewer has been around for a while. Its primary role was to allow advisor's clients to view PDFs in a branded viewer. The problem was it didn't even do that very well.

Content Viewer Circa 2012
The first iteration of the content viewer was frustrating to read content on. The reading window wasn't tall enough to accommodate PDFs and make reading them enjoyable. The UI also limited the viewer to only displaying 4 PDFs at a time. The mobile UI was even worse - it was practically useless. The accordion tabs open awkwardly, and all the user could do was tap on the PDF link to view them in their phone's native PDF viewer.
DR-OLD-contentviewer-mobile
DR-OLD-contentviewer-mobile

our goals for the redesign

Before we started designing anything, we reached out to our users to give us some feedback on the existing content viewer - what they liked, what they hated, and what they wanted it to do. Based on their feedback and our business goals, this is what we decided to focus on:

what we envisioned

The Workflow:
The user would receive an email of content from their advisor. When the user tapped on one of the pieces of content it would open up in the new Content Viewer and open directly into that piece of content.

The content is now given as much screen real estate as possible, making it easy and fluid to scroll through and read.

The breadcrumbs in the bottom indicate how many pieces of content are viewable in the viewer. The user can swipe through the content left or right.

The title of the content appears in a semi-transparent bar near the top of the viewer, but it disappears as the user scrolls.





mobile phone with digitalreach
content viewer - pdf
Delivery Items Overlay:
Tapping on the icon in the top left corner of the brand bar would open the Delivery Items Overlay panel - which houses all of the content that the advisor sent to the user in the email communication.

Unlike the old content viewer, there is room for an unlimited number of content pieces. The user can simply scroll through them in the Delivery items overlay.

Sharing Content: The user is able to share content either from the Delivery Items Overlay, or while inside a specific content piece by tapping on the share icon.





content viewer - delivery items overlay
mobile phone with digitalreachmobile phone with digitalreach

A content agnostic viewer allows the user to view any type of content with ease:

content viewer video
content viewer html article
content viewer - html tool
The Advisor Panel:
Tapping on the icon in the top right corner of the brand bar would open the Advisor Information Panel. This panel houses all of the advisor's contact information.

One of our future roadmap items was to build a video call feature into the recipient viewer so the user could video chat with his advisor as he was viewing the content that the advisor sent him.

If the email was sent to the recipient from a team of advisors, the advisor information panel would reflect that team's information.





mobile phone with digitalreach
content viewer - pdf

The content viewer also worked beautifully on larger screen sizes:

How the designs held up post launch

Sometimes details can get lost in translation from the initial design phase to shipping time. However, the revamped content viewer is definitely not one of those times. I was really happy how the development team incorporated my designs. Plus, even though we had to remove some of the future state bells and whistles (for now), I think the content viewer really holds its own and provides an excellent viewing or reading experience for any user.
Check it out for yourself: Visit a sample of the Content Viewer

We even incorporated a walkthrough for launch, so the user was properly onboarded as to how to user the viewer

Overall, the content viewer redesign was a huge success. We received numerous compliments from our clients, and when our clients tested the new designs among their users, they received a lot of really encouraging feedback. The viewer is still being improved upon day by day, but I'm happy that our team was able to make such a positive change in a really short amount of time.

related works

BACK TO TOP
Want to see more?  Let’s go back to my  Portfolio