Onfido Real Identity Platform
Case Study
This fully responsive web asset provides a holistic yet focused tour of Onfido’s key suite of products all in one place—weaving together an immersive interactive demo, 11 videos, and 18  informational pages.
The interactive demo guides users through Onfido Studio. Panel overlays guide users through the narrative, invite them to engage with clicks and drag-and-drop interactivity, and promote business benefits.
The various informational pages needed to act like an ebook but walk like an infographic—thorough in explaining technologies, solutions, and benefits, but short and engaging enough to maintain user attention.
Each of the 11 videos were created custom for the experience, making the overall Platform Tour deliverable a true full-team effort between business strategists, writers, designers, developers and animators.
CHALLENGE
"Making digital identity simple," Onfido needed to stay true to their tagline and help prospective customers understand their elegant yet complex Real Identity Platform.

As with many revolutionary technologies, the benefits are game-changing—but distilling the solution into approachable, consumable “customer speak” was tough.
SOLUTION
Onfido had plenty of resources describing each of their Platform’s four technology pillars, but needed a single experience that brought everything together in one place.

Enter, CPR Interactive.

The brief: Conceptualize and create a bespoke web asset (plus all creative content therein!) to quickly and visually explain the four pillars of Onfido’s solution—motivating users to dig deeper, while maintaining engagement through consumable and relevant media, visuals and written content.
PROCESS
The creative process starts with the big picture: What are we creating? What’s the goal? From there, each project phase refines the concept and builds on what came before.

Extensive research and planning are expanded into written content, forming the backbone for the experience. Then, it’s all about iterations of visual design that are ultimately brought to life by the development team before final deployment on the web.

Constant collaboration is key. At every stage, we included Product Marketing, Product Development, Corporate Marketing,  Brand, and executive teams at Onfido in brainstorming workshops and reviews to reflect diverse perspectives.

Use the timeline to explore each phase below.
●
Planning
●
Writing
●
Design
●
‍Production
●
‍Deployment
Planning is the foundation for success in any project.

We first needed to fully understand Onfido’s solutions and the existing education materials available to their customers. We scoured Onfido’s website, watched existing videos, read ebooks, infographics, and whitepapers, and most importantly, discussed it all with Onfido experts.

We soon realized that to fully capture the breadth of Onfido’s unique offerings, we needed to create a multi-asset deliverable—an interactive web experience combining an interactive product tour, video library, and informational microsite.

The “Platform Tour” concept was born.
Writing is where the rubber begins to meet the road—meticulously gathering information from all existing sources, merging them with our conversations with Onfido experts, keeping the nuggets, and culling the unnecessary.
Each asset type required a different writing style:

• Onfido Studio interactive tour:  the star asset of our experience needed to walk users through clicks and software interactions, explain what they were doing and why, and present a narrative users could relate to—weaving in business benefits along the way.

• 11 Videos: to maximize engagement and interest , video was the perfect fit for a featured asset on each sub-product page. To quickly tell each story, scripts needed to be short and consumable at 30 seconds or less and written with a punchy, efficient, yet approachable writing style.

• 11 Sub-pillar pages: the various informational pages needed to act like an ebook but walk like an infographic—thorough in explaining technologies, solutions, and benefits, but not so long that users would lose interest.

Design is an evolutionary process: methodical application of a “visual skin” to written content, based on a series of highly collaborative iterations that balance visual beauty, best user experience, diverse perspectives, and brand integrity.

Through discussion, creative exploration, and balancing rounds of feedback from all key stakeholders, the visual approach became cleaner and more focused—resulting in a final design balancing creativity and simplicity.
Home Page
The first impression needed to immediately capture the concept in a clear, highly visual way: four main pillars and their relationship to each other, with a clear starting place for users to explore.
The interactive demo guides users through Onfido Studio. Panel overlays guide users through the narrative, invite them to engage with clicks and drag-and-drop interactivity, and promote business benefits.
The various informational pages needed to act like an ebook but walk like an infographic—thorough in explaining technologies, solutions, and benefits, but short and engaging enough to maintain user attention.
Each of the 11 videos were created custom for the experience, making the overall Platform Tour deliverable a true full-team effort including business strategists, writers, designers, developers and animators.
Production is where designs comes to life.

Given the multi-asset scope of this project, Production involved two concurrent processes:
development of all web pages and interactive assets via HTML code writing, and creation of all final videos via animation in Adobe After Effects.

Both the Development and Animation teams kept constant communication between the Onfido development and brand/design teams (respectively) to keep the Platform and video visions on track.
Development in HTML
Using cutting-edge technologies to create rich animation details and responsive code, we craft an experience that works great on any device. Extensive testing and constant communication with client-side developers ensure bulletproof performance in the final environment.
Video animation
While the HTML experience is being created by the development team, the animation team was busy bringing the video storyboards to life. Adobe After Effects is our software of choice to combine music, voice, and design—bringing the static storyboard concepts to life through carefully keyframed motion.
Deployment involves much more than just delivering final files and calling it done.

With constant back-and-forth file deliveries, communications, testing, and revisions, we worked with client web teams every step of the way until final delivery to ensure the final product performed perfectly.
With a project of this size and breadth, the push to "final go-live" meant a coordinated hand-off of files and code across several phases:

• Video delivery:  All video files were delivered to Onfido teams to be hosted on their Youtube.

• Web pack delivery: With the newly created Onfido Youtube links inserted into the Platform Tour's code, CPR developers handed the entire web experience's file pack over to client development teams.

• Testing: The CPR team assisted with performance testing in the staging environment, working hand in hand with client development teams to solve issues—an iterative process incorporating final changes from client and squashing any remaining bugs.

• Final go-live: With all testing complete in the staging environment, it was time to push everything to the final live environment—after which, CPR provided continued support if any issues were found.

RESULT
Birthed from a highly collaborative process across client and agency strategy, product, writing, design, and development teams, we’re thrilled with the end result: a fully responsive web asset available on all devices that weaves together an immersive interactive demo, videos, and informational content pages to bring the Onfido Real Identity Platform to life.

Best of all? The Onfido team loved it so much that it’s become a main feature across the company’s website.
Launch Project
Inspired? We'd love to work with you.
Let's create awesome together.
Contact us

Let's talk

info@ineedcpr.com
Join our newsletter
Privacy Policy