WM is North America's leading provider of comprehensive waste management environmental services. I worked there for 2 years, mainly focus on web & mobile design and build design systems and documentation. For this project, I will show you the process of residential and commercial feature on homepage.
Duration:
My role:
Team:
Impact:
Website:
WM Rebrand
130K
Daily visit wm.com
21M
Customers
0
Toolkit in 2020
Residential and business pickup page | WM design toolkit | rebranding +redesign homepage
Context
Solution
Impact
Hearing From Our Users
• “There is no way to identify which industry on the Business Waste Pickup Page.”
• “There is no way to input address and search available services on residential and business waste pick up pages.”
Residential
Commercial
41.1%
31.3%
18M users
3M users
Context
Solution
Impact
Project requirement from PM
For Commercial pages, we would like to add a field next to the address field for “Industry Picker”. When a customer clicks the CTA, it will direct the response to PROS.
For Residential pages, we would like to add two new fields next to the address field for “First Name” and “Last Name”
This will be for all US and CA customers
Residential
Company can capture personalized
segmentation information
Commercial
Company can gather data around
various industries customer segments
Benefits to WM
Context
Solution
Impact
Before
Residential waste Pickup page
“There is no way to input address and search available services on residential and business waste pick up pages.”
Context
Solution
Impact
Business in mind
Data driven
Advocate for our users
Team discussion
Context
Solution
Impact
Design solution + team crit
After
Residential waste Pickup page
User can input address and search available services on residential and business waste pick up pages.
Context
Solution
Impact
Context
Solution
Impact
Before
Business waste Pickup page
“There is no way to identify which industry on the Business Waste Pickup Page.”
Context
Solution
Impact
Business in mind
Data driven
Advocate for our users
Team discussion
Context
Solution
Impact
Design solution + team crit
Option A
Option B
Context
Solution
Impact
Design solution + team crit
After
Business waste Pickup page
User can identify which industry on the Business Waste Pickup Page.
Context
Solution
Impact
After
Business waste Pickup page
User can identify which industry on the Business Waste Pickup Page.
Context
Solution
Impact
Context
Solution
Impact
6 months later...
Why not utilizes the services address tool on homepage?
After
Business waste Pickup page
User can identify which industry on the Business Waste Pickup Page.
Context
Solution
Impact
After
Business waste Pickup page
User can identify which industry on the Business Waste Pickup Page.
Context
Solution
Impact
Context
Solution
Impact
6 months later...
Why not utilizes the services address tool on homepage?
Context
Solution
Impact
Rebranding happened...
My tasks:
Build a 0-1 design system toolkit
Create components with 2 designers
Add documentation
Create rebranded homepage
50+ components
50+ components
Context
Solution
Impact
Documentation and for each component
Context
Solution
Impact
Context
Solution
Impact
Review the design & dev alignment
Context
Solution
Impact
Engineer:
Hi, I am done with the rebranding component development, let’s review!
Context
Solution
Impact
Context
Solution
Impact
Review the design & dev alignment
Context
Solution
Impact
Context
Solution
Impact
Context
Solution
Impact
Rebranding Homepage
VS
Old Homepage
A: 25%
B: 75%
40 Participants
Measure the success
• “Clean, modern, with logical high-use topics highlighted at the top.”
• “I can clearly understand how to input my address and search for services on homepage”
Context
Solution
Impact
101 components
1 toolkit + 1 documentation website
0-1 WM design system
Context
Solution
Impact
Rebranding WM.com live on 11/15/2021
Thank you
for watching
