LIBERTY MUTUAL:
SAFE DRIVING APPS
TELEMATICS + GAMEIFICATION PRODUCT DESIGN
THE ASK:
The client came to us to redesign and refine an existing telematics app (RightTrack) and customize a 2nd out-of-the-box gamified platform from Cambridge Telematics, for tracking and rewarding good driving behavior for both active insured users & new potential customers with cost saving offers.
The overall look & feel was inspired by the most recent branding while optimizing content to be streamlined & modern. The technology used either OSD-connected telematics receivers or using the phone’s own GPS + accelerometer tracking.
Participation
Art Director Showrunner
UX/UI Design
Client
Liberty Mutual
Year
2015
THE CHALLENGE:
We pivoted on our traditional ways of working and built a Team Room that housed all our contributors and the LM Product Owner while we all simultaneously operated at peak efficiency. As such, we were able to get instantaneous responses from each delivery lead as issues arose.
We used whiteboards for wireframes, Photoshop w/ auto-generated assets exported, and developers building a true working environment vs relying on a prototype to carry approvals. This experience truly proved the value of AGILE workflow and enabled each team member to respond to change instantly.
Due to a short delivery timeline, we opted to participate in a true SCRUM/AGILE process and recruited a 3rd party SCRUM Master to help guide us through the rigorous process and educate our team on best practices.
Based on our findings from the Heuristic and Competitive Analysis, we made sure that all of our research was put to use and built Guiding Principles around the findings to keep us on the "right track."
THE PROCESS:
What was most crucial in the first weeks of the project was building team culture. Learning to communicate and trust each other came before truly understanding the AGILE process. There had been other attempts at working AGILE/SCRUM with clients; they typically defaulted to a Waterfall method with shorter timelines. We wanted to try and complete an AGILE project without the “Hybrid-ness” of WaGILE that tends to creep back in. Truly crafting a team that relies on each other & works in tandem is tantamount.
Early on in the project, we had problem we couldn’t solve for with RightTrack (Redesign); how would we build an “interactive data visualization” that displayed all of the drivers within a household and how each of them impacted the app’s driving score.
After some quick user testing, we found that no one wanted an interactive graph at all. They wanted transparency around what elements was causing the score to dip or jump. So, we kicked out the graph and replaced it with an FAQ page. We then settled on the mantra of “If it takes more than 15min to discuss; test it.” We averaged around 1 test a week and greatly help to inform our work moving forward.
With HighwayHero (CMT App), the goal was to that engaged and enticed new potential customers to install the app for free and play the “game” of safer driving habits + scoreboards to get a better quote on switching to Liberty Mutual.
We were constrained with our designs due to the pre-built nature of a “whitelabel” product. This meant we could only change thing s like colors, fonts, and populate specific areas with assets. This limited us as we could only “design-by-number” vs crafting a customized experience. Luckily, Cambridge Telematics agreed that it could use some work and we compromised on some low-effort wins and a backlog of future improvements.
As we were trying something new with AGILE/SCRUM, we took it just a bit further to implement Atomic Design (Design Language System) as a part of the process. The Development team was ecstatic and was fully in favor of it. This ended up being highly successful as it built open lines of communication through previously gate-kept conversations. This allowed us to be incredibly prescriptive with what was being built and, since we used the UAT as a live working-prototype, the devs were happy to simply swap code or adjust existing DLS componentry to meet our design needs.
THE RESULTS:
RIGHTTRACK (REDESIGN)
The new RightTrack app launched in the app store in March, 2015. You had to be a Liberty Mutual customer to use the app. This was one of the best projects I've worked on in my career. I loved my SCRUM team and how we came together to work in a new way and to overwhelmingly impress the client. And they were. What started as a 10 week engagement has extended into an ongoing partnership. We completed the app in 20 weeks and pivoted into other projects and engagements with solid relationships already established.
RightTrack Tutorial Walkthrough Video
RightTrack Custom Microanimation Examples
RightTrack :30 Second Functional Demo
RightTrack App Screens
Highwayhero
(CMT App)
In regards to Highway Hero, we delivered a clean and modern UI Kit with supporting assets that set LM apart from others using the same platform by a wide margin. We worked with CMT to customize specific areas of the app that allowed us to have more design flexibility and adjust specific components and how they interact with one another. We presented three different design concepts to the client based on what could be accomplished in CMT’s Telematics platform. Once the direction was chosen we refined the concept by choosing fonts, creating a logo, color palette and icon style.
With the design system set, we needed to build page templates and a library of almost 100 unique icons and illustrations. Along the way there were also hidden UX opportunities such as adding a notifications feature. As you earned points overall you also earned badges for practicing specific good driving habits. The badges were a great place to push the limits of the icon-based approach while further maturing the new brand identity.
Overall, Highway Hero was brought into Liberty Mutual’s growing app family and promoted across several channels and marketing initiatives.
Working on 2 projects simultaneously allowed us to take bother userbases into account while ensuring that if 1 app couldn’t meet a need, the other could. All in all, this was a challenging project that tested the experience and skills of several of our best designers and developers.
To this day, this has been one of my most rewarding and educational projects.
Highway Hero Promo Spot feat. NASCAR Driver Clint Bowyer
CES 2017 - feat. Nicholas Grant, VP of Product Technology Solutions presenting on BeTerrific’s webcast.