Redesigns and launches for Liberty Mutual's global safety website to help business policyholders improve workplace safety, reduce the cost of risk, and follow nationally recognized standards. Additionally, as product owner: research, ideation, journey mapping, and wireframes for future system upgrades.
Homepage: Before and after
My role: UI/UX Designer and Product Owner
I led two site-wide rebrands: one in 2016 and one in 2019.
I managed the site operations through a customer-centric lens, and coordinated with copywriters and subject matter experts on a day-to-day basis to continuously improve content strategy.
I executed all phases of the site's UI, with the goals of improving site usability, and strengthening brand application and engagement.
I prioritized and planned web design work based on site metrics, user feedback, and insights from corporate web forum, company-wide design meetups, and technology initiatives.
As the technology liaison on the business side, I logged site issues to be fixed in the short-term, and kept project team aligned with national and global technology initiatives in the long term.
I helped facilitate design thinking workshops as part of continuous improvement and showcasing future vision, integrations, and capabilities.
I designed the site's internal and external marketing materials
Rebrand #1 — Nov 2016
Main improvement: Information Architecture
Milestones
Introduction of user studies
Improved information architecture including card sort
Restructured page layouts designed with HTML and CSS
Introduction of interactive elements
Introduction of iconography
Creation of style guide
Project plan
Bring up to current (2013) brand standards to create consistency/familiarity with other LM products and services
Create icons to decrease wording-heavy content and improve navigation to popular pages
Create new information architecture
Eliminate unnecessary links, pages, and redundant, outdated, or significantly low traffic content
Design and test functionality of rotating news, accordion, and tabbed webparts working with tech intern
Streamline navigation between safety tools, training, and resources – validate with card sorting exercise
Create all new page layouts with inline HTML; implement on 84 pages
Rewrite technical language and labels into plain language
Create style guide for consistency moving forward
Create new promotional materials including video working with vendor
Style guide and card sort
Rebrand #1 — Final design
Rebrand #2 — July 2019
Main improvement: Accessibility
Milestones
Definition of scope and Standard of Work agreement within project budget
Full site content audit
Creation of detailed prototypes and drafted CSS edits
Daily touch points with contracted developers throughout 11 month project span
Focus on accessibility — including elimination of inline styles, addition of image-alt tags, elimination of text embedded in images, menu style switch from pop-out to accordion, and increased color contrast
Training and documentation for site editing team
Design and project management of internal and external marketing materials to increase engagement, including email design, laptop decals, screensaver, and promotional video
Mockups
Provided new CSS, altering colors, fonts, div sizes, and marked up additional changes for contractors showing specs and interactions.
Customer centric opportunity: 404 page
Rollout
I coordinated the project rollout across teams of site editors, marketing, developers, and others. With several contingencies, I kept the plan visible and in an accessible location.
Metrics
In the first month after launch, there was a:
61% increase in page views
33% increase in unique visitors
53% increase in number of visits
141% increase in downloads
Research and design for future system upgrades
Feature prioritization: KANO Model
2018 UX survey results
Key findings:
Desire to access SafetyNet by direct URL
Desire to see information customized by industry and loss areas
Desire to take self-assessments
Customer journey maps / service blueprints
To identify where customer pain points and manual processes intersected, myself and my manager conducted journey mapping with 7 different functions within the department to understand touchpoints for "Owen Onsite" persona. We created a total of 15 journey maps.
As a result, I took the lead on researching and designing 3 concepts:
1. Customization concept
Based on the customer survey responses and business opportunities from the journey mapping, a customized SafetyNet was validated. I drafted some layout ideas for mobile and desktop:
A concept similar to this ended up being built by myself and a few others at Liberty Mutual's 2019 global hackathon.
2. Self-assessment hub concept
As identified in journey mapping and dug into in a 3 day event storming workshop, these tools contain proprietary formulas that allow Liberty's risk control consulting to be world class—but they still reside on excel, with a confusing interface, high effort for training new hires, and inability for customer self-service. Myself, another designer, and a developer reimagined these tools from sketches to coded prototype.
3. Field recommendations hub concept
The Risk Recommendations Portfolio is a concept for a cloud-based application that aggregates safety recommendations from field visits to generate customizable reports. It extracts report data currently in Word, PDF, and Excel formats to automatically generate account-level and location-level reports, saving hundreds of service director hours. Additionally, it gains insights into risk performance and content development needs. Machine learning would improve accuracy over time, and extract key words/trends support Risk Control service and elite underwriting operations.
I completed research, interviews, and wireframes before the project was put on hold due to COVID-19.
Example of KPIs
Part of a quarterly stakeholder report I put together:
Shift in content strategy based on COVID-19:
Comments