works
Product Design
HDSupply
As a Senior UX Designer and Front-end Developer, I crafted wireframes and prototypes to visualize and test the layout and functionality of our e-commerce application. I developed detailed user journey maps to ensure a seamless and intuitive experience from product discovery to checkout. Furthermore, I designed engaging user interfaces and implemented them using front-end technologies, ensuring the application was both visually appealing and highly functional.
In 2019, HD Supply reached a significant milestone by generating $1 billion in online revenue for the first time. This achievement was driven by a comprehensive website redesign that enhanced user ease, improved site speed, and expanded product offerings.
company
HDSupply
year
2018 - 2022
Role
Senior UX Designer / Developer
industry
Facilities Maintenance
![](https://framerusercontent.com/images/9ZxbZdJxVGnxTStexa7OZImgO0.jpg?scale-down-to=2048)
![](https://framerusercontent.com/images/9ZxbZdJxVGnxTStexa7OZImgO0.jpg?scale-down-to=2048)
This project was
a tremendous
success.
This project was
a tremendous
success.
This project was
a tremendous
success.
This project was
a tremendous
success.
$1B
$1B
$1B
In online revenue in 2019 for the first time in the company's history.
In online revenue in 2019 for the first time in the company's history.
In online revenue in 2019 for the first time in the company's history.
Within the first six months of launching
this feature, Expedia achieved over $4 million in spending
Mobile Award
Mobile Award
Mobile Award
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
Project process
creative process
creative process
Project process
creative process
creative process
creative process
How do we turn the snooze-fest of shopping for maintenance supplies into a visually cool and user-friendly adventure?
The approach behind the HD Supply redesign was to enhance the user experience for users and Field Service reps who used the tools. The focus was on creating a sleek and intuitive platform that displayed products for consumers and property managers while decreasing load times and elevating the entire property maintenance process.
team
Product Owner
Lead Designer (me)
Developers
PROJECT OBJECTIVES
Increase overall trust of website and cut down on customer support tickets. Also decrease site load times, which contributed among other things, to the negative feelings about the website.
goals
1
Increase
Increase ability to properly track orders and make lists for future purchase.
1
Increase
Increase ability to properly track orders and make lists for future purchase.
2
Reduce
Negative encounters per visit.
2
Reduce
Negative encounters per visit.
3
Increase
Trust of website and overall experience.
3
Increase
Trust of website and overall experience.
4
Reduce
Overall load times of website.
4
Reduce
Overall load times of website.
the problem
Given the lack of prior research data, our initial step was to engage with Customer Service Representatives and Field Sales Representatives through in-depth interviews. By understanding their pain points, we were able to identify and define key problems. Among the initial challenges we addressed were difficulties in tracking orders and the need for improved search functionality by item or order number.
EMPATHY AND INITIAL RESEARCH
Through extensive usability testing with an external UX research team, we identified several pain points and opportunities for enhancement by collaboratively affinity mapping the gathered data. We conducted in-depth interviews with customer representatives, field service representatives, and customers to collect valuable insights.
I'm having a hard time properly tracking my orders.
I'm having a hard time properly tracking my orders.
David Smith - Property Manager
David Smith - Property Manager
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
Key Insights
Inability to properly track orders.
Some product photos were not compatible with their description.
When items were out of stock they were not informed of that until they reached checkout.
Weather conditions on the website were nice to have.
The website was easy to navigate around.
Not all items are delivered at once.
Easy to find items when they used the search feature.
If items are out of stock, it would be nice to suggest a replacement item.
![](https://framerusercontent.com/images/5hykMrpdGw6qMiyUSqK6Cy1dWQ.jpg)
who is our user?
Meet David and learn about her goals and pain points.
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
david smith
Property Manager
"I want to use the Accelerator marketing tool to boost their hotel listings on the Expedia website"
"I want to use the Accelerator marketing tool to boost their hotel listings on the Expedia website"
goals and needs
I want to efficiently manage and track my property purchases in bulk.
I want to be able to easily search and compare prices from different suppliers.
I need a relaible method for making financial transactionsrelated to my property purchases.
I want to stay informed about industry trends and new products in the market
I want to generate positive reviews and ratings for my hotel to build trust and credibility.
I need assistance in managing inventory and ensuring timely replenishment.
goals and needs
I want to efficiently manage and track my property purchases in bulk.
I want to be able to easily search and compare prices from different suppliers.
I need a relaible method for making financial transactionsrelated to my property purchases.
I want to stay informed about industry trends and new products in the market
I want to generate positive reviews and ratings for my hotel to build trust and credibility.
I need assistance in managing inventory and ensuring timely replenishment.
Tasks and activities
Create and manage lists of required property items for bulk purchase.
Research and compare proces from various suppliers.
Place orders and make secure online payments for property purchases.
Coordinate deliveries and schedule installations or maintenance services.
Review and evaluate supplier performance and reliability.
Manage inventory and ensure sufficient stock levels for ongoing operations.
Tasks and activities
Create and manage lists of required property items for bulk purchase.
Research and compare proces from various suppliers.
Place orders and make secure online payments for property purchases.
Coordinate deliveries and schedule installations or maintenance services.
Review and evaluate supplier performance and reliability.
Manage inventory and ensure sufficient stock levels for ongoing operations.
pain points
Finding reputable suppliers who offer competitive prices and quality products.
Managing multiple orders and keeping track of delivery schedules.
Dealing with delayed or incorrect deleiveries and resolving related issues.
Balancing budget constraints with the need to maintain quality standards.
Handling communication challenges, such as laguage barriers or unresponsivesuppliers.
Adapting to changes in property management requirements and demand patterns.
pain points
Finding reputable suppliers who offer competitive prices and quality products.
Managing multiple orders and keeping track of delivery schedules.
Dealing with delayed or incorrect deleiveries and resolving related issues.
Balancing budget constraints with the need to maintain quality standards.
Handling communication challenges, such as laguage barriers or unresponsivesuppliers.
Adapting to changes in property management requirements and demand patterns.
Opportunities and features
Integrate with popular online suppliers to provide direct access to their catalogs and pricing.
Offer personalized recommendations based on previous purchase history and industry trends.
Enable secure online payment options, such as escrow services or trusted payment gateways.
Introduce AI-powered chatbots to assist with inquiries, product search, and issue resolution.
Offer bulk purchasing discounts or loyalty programs for repeat customers.
Include inventory management features, such as barcode scanning and automated stock replenishment reminders.
Opportunities and features
Integrate with popular online suppliers to provide direct access to their catalogs and pricing.
Offer personalized recommendations based on previous purchase history and industry trends.
Enable secure online payment options, such as escrow services or trusted payment gateways.
Introduce AI-powered chatbots to assist with inquiries, product search, and issue resolution.
Offer bulk purchasing discounts or loyalty programs for repeat customers.
Include inventory management features, such as barcode scanning and automated stock replenishment reminders.
ideate
USER FLOWS
User flows helped me understand how users would navigate through the experience.
![](https://framerusercontent.com/images/rqoHoaGeKwvLdjZelXHIzkGut3s.png)
wireframes
I created initial wireframes and iterations of those wireframes, designing various options to find a solution.
![](https://framerusercontent.com/images/xcC3s3NotMUcdBA6Nh6Kn0v7Q.png)
solution
Some before and after screens from the initial release.
BEFORE
![](https://framerusercontent.com/images/iEdeZBMWpOulF9IHNk5I0ut7KU.png)
![](https://framerusercontent.com/images/0efTfPAWm3OqUrDqYZ1iMsoRbPk.jpg)
AFTER
![](https://framerusercontent.com/images/z36EE6JdY1uftqXqtbxyOI1a2M.webp)
![](https://framerusercontent.com/images/7PCajx58z0K1PyHmRR34VaxHxEE.webp)
![](https://framerusercontent.com/images/qKY5kQqIxUgw9XQwQABsdFAyCyg.webp)
![](https://framerusercontent.com/images/W8qsMYAgk2YXT4KQfhEcOtf2s.webp)
![](https://framerusercontent.com/images/vO6dIRIbsIisCRMJ2Z0EdaDqAo.webp)
![](https://framerusercontent.com/images/T6WHQqxlzx8UimCgU697pONeSl0.webp)
![](https://framerusercontent.com/images/cMfgzMGX7xxF9hhnyPdlc7cZL7g.webp)
![](https://framerusercontent.com/images/XYnmghdmIy2uioRMWlhVXHwutuA.webp)
![](https://framerusercontent.com/images/ve8CWxS9VLNw81SXDGD8bgPMg9E.jpg)
impact
In 2019, HD Supply achieved a significant milestone by generating $1 billion in online revenue for the first time. This success was driven by a comprehensive website redesign that enhanced ease of use, improved site speed, and expanded product offerings.
User experience was a key focus in the design execution. The HD Supply website and mobile app now feature intuitive navigation, streamlined search filters, and interactive product listings, ensuring a seamless user journey.
The mobile app garnered prestigious accolades, winning the 2020 October Awards for Best Mobile App Design and the 2020 Horizon Interactive Award for Best Mobile App.
This project was
a tremendous
success.
This project was
a tremendous
success.
$1B
$1B
In online revenue in 2019 for the first time in the company's history.
In online revenue in 2019 for the first time in the company's history.
Mobile Award
Mobile Award
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
test
Throughout the design process we tested the designs with users and gave them specific tasks during testing to get feedback.
![](https://framerusercontent.com/images/XIv4Au2DzZoWikcidnW5VRqz4.png)
How do we turn the snooze-fest of shopping for maintenance supplies into a visually cool and user-friendly adventure?
The approach behind the HD Supply redesign was to enhance the user experience for users and Field Service reps who used the tools. The focus was on creating a sleek and intuitive platform that displayed products for consumers and property managers while decreasing load times and elevating the entire property maintenance process.
team
Product Owner
Lead Designer (me)
Developers
PROJECT OBJECTIVES
Increase overall trust of website and cut down on customer support tickets. Also decrease site load times, which contributed among other things, to the negative feelings about the website.
goals
1
Increase
Increase ability to properly track orders and make lists for future purchase.
2
Reduce
Negative encounters per visit.
3
Increase
Trust of website and overall experience.
4
Reduce
Overall load times of website.
the problem
Given the lack of prior research data, our initial step was to engage with Customer Service Representatives and Field Sales Representatives through in-depth interviews. By understanding their pain points, we were able to identify and define key problems. Among the initial challenges we addressed were difficulties in tracking orders and the need for improved search functionality by item or order number.
EMPATHY AND INITIAL RESEARCH
Through extensive usability testing with an external UX research team, we identified several pain points and opportunities for enhancement by collaboratively affinity mapping the gathered data. We conducted in-depth interviews with customer representatives, field service representatives, and customers to collect valuable insights.
I'm having a hard time properly tracking my orders.
David Smith - Property Manager
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
Key Insights
Inability to properly track orders.
Some product photos were not compatible with their description.
When items were out of stock they were not informed of that until they reached checkout.
Weather conditions on the website were nice to have.
The website was easy to navigate around.
Not all items are delivered at once.
Easy to find items when they used the search feature.
If items are out of stock, it would be nice to suggest a replacement item.
![](https://framerusercontent.com/images/5hykMrpdGw6qMiyUSqK6Cy1dWQ.jpg)
who is our user?
Meet David and learn about her goals and pain points.
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
david smith
Property Manager
"I want to use the Accelerator marketing tool to boost their hotel listings on the Expedia website"
goals and needs
I want to efficiently manage and track my property purchases in bulk.
I want to be able to easily search and compare prices from different suppliers.
I need a relaible method for making financial transactionsrelated to my property purchases.
I want to stay informed about industry trends and new products in the market
I want to generate positive reviews and ratings for my hotel to build trust and credibility.
I need assistance in managing inventory and ensuring timely replenishment.
Tasks and activities
Create and manage lists of required property items for bulk purchase.
Research and compare proces from various suppliers.
Place orders and make secure online payments for property purchases.
Coordinate deliveries and schedule installations or maintenance services.
Review and evaluate supplier performance and reliability.
Manage inventory and ensure sufficient stock levels for ongoing operations.
pain points
Finding reputable suppliers who offer competitive prices and quality products.
Managing multiple orders and keeping track of delivery schedules.
Dealing with delayed or incorrect deleiveries and resolving related issues.
Balancing budget constraints with the need to maintain quality standards.
Handling communication challenges, such as laguage barriers or unresponsivesuppliers.
Adapting to changes in property management requirements and demand patterns.
Opportunities and features
Integrate with popular online suppliers to provide direct access to their catalogs and pricing.
Offer personalized recommendations based on previous purchase history and industry trends.
Enable secure online payment options, such as escrow services or trusted payment gateways.
Introduce AI-powered chatbots to assist with inquiries, product search, and issue resolution.
Offer bulk purchasing discounts or loyalty programs for repeat customers.
Include inventory management features, such as barcode scanning and automated stock replenishment reminders.
ideate
USER FLOWS
User flows helped me understand how users would navigate through the experience.
![](https://framerusercontent.com/images/rqoHoaGeKwvLdjZelXHIzkGut3s.png)
wireframes
I created initial wireframes and iterations of those wireframes, designing various options to find a solution.
![](https://framerusercontent.com/images/xcC3s3NotMUcdBA6Nh6Kn0v7Q.png)
solution
Some before and after screens from the initial release.
BEFORE
![](https://framerusercontent.com/images/iEdeZBMWpOulF9IHNk5I0ut7KU.png)
![](https://framerusercontent.com/images/0efTfPAWm3OqUrDqYZ1iMsoRbPk.jpg)
AFTER
![](https://framerusercontent.com/images/z36EE6JdY1uftqXqtbxyOI1a2M.webp)
![](https://framerusercontent.com/images/7PCajx58z0K1PyHmRR34VaxHxEE.webp)
![](https://framerusercontent.com/images/qKY5kQqIxUgw9XQwQABsdFAyCyg.webp)
![](https://framerusercontent.com/images/W8qsMYAgk2YXT4KQfhEcOtf2s.webp)
![](https://framerusercontent.com/images/vO6dIRIbsIisCRMJ2Z0EdaDqAo.webp)
![](https://framerusercontent.com/images/T6WHQqxlzx8UimCgU697pONeSl0.webp)
![](https://framerusercontent.com/images/cMfgzMGX7xxF9hhnyPdlc7cZL7g.webp)
![](https://framerusercontent.com/images/XYnmghdmIy2uioRMWlhVXHwutuA.webp)
![](https://framerusercontent.com/images/ve8CWxS9VLNw81SXDGD8bgPMg9E.jpg)
impact
In 2019, HD Supply achieved a significant milestone by generating $1 billion in online revenue for the first time. This success was driven by a comprehensive website redesign that enhanced ease of use, improved site speed, and expanded product offerings.
User experience was a key focus in the design execution. The HD Supply website and mobile app now feature intuitive navigation, streamlined search filters, and interactive product listings, ensuring a seamless user journey.
The mobile app garnered prestigious accolades, winning the 2020 October Awards for Best Mobile App Design and the 2020 Horizon Interactive Award for Best Mobile App.
This project was
a tremendous
success.
$1B
In online revenue in 2019 for the first time in the company's history.
Mobile Award
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
test
Throughout the design process we tested the designs with users and gave them specific tasks during testing to get feedback.
![](https://framerusercontent.com/images/XIv4Au2DzZoWikcidnW5VRqz4.png)
How do we turn the snooze-fest of shopping for maintenance supplies into a visually cool and user-friendly adventure?
The approach behind the HD Supply redesign was to enhance the user experience for users and Field Service reps who used the tools. The focus was on creating a sleek and intuitive platform that displayed products for consumers and property managers while decreasing load times and elevating the entire property maintenance process.
team
Product Owner
Lead Designer (me)
Developers
PROJECT OBJECTIVES
Increase overall trust of website and cut down on customer support tickets. Also decrease site load times, which contributed among other things, to the negative feelings about the website.
goals
1
Increase
Increase ability to properly track orders and make lists for future purchase.
2
Reduce
Negative encounters per visit.
3
Increase
Trust of website and overall experience.
4
Reduce
Overall load times of website.
the problem
Given the lack of prior research data, our initial step was to engage with Customer Service Representatives and Field Sales Representatives through in-depth interviews. By understanding their pain points, we were able to identify and define key problems. Among the initial challenges we addressed were difficulties in tracking orders and the need for improved search functionality by item or order number.
EMPATHY AND INITIAL RESEARCH
Through extensive usability testing with an external UX research team, we identified several pain points and opportunities for enhancement by collaboratively affinity mapping the gathered data. We conducted in-depth interviews with customer representatives, field service representatives, and customers to collect valuable insights.
I'm having a hard time properly tracking my orders.
David Smith - Property Manager
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
Key Insights
Inability to properly track orders.
Some product photos were not compatible with their description.
When items were out of stock they were not informed of that until they reached checkout.
Weather conditions on the website were nice to have.
The website was easy to navigate around.
Not all items are delivered at once.
Easy to find items when they used the search feature.
If items are out of stock, it would be nice to suggest a replacement item.
![](https://framerusercontent.com/images/5hykMrpdGw6qMiyUSqK6Cy1dWQ.jpg)
who is our user?
Meet David and learn about her goals and pain points.
![](https://framerusercontent.com/images/j3VvojM3nEEfu4sVRH2wOdwSZQ.png)
david smith
Property Manager
"I want to use the Accelerator marketing tool to boost their hotel listings on the Expedia website"
goals and needs
I want to efficiently manage and track my property purchases in bulk.
I want to be able to easily search and compare prices from different suppliers.
I need a relaible method for making financial transactionsrelated to my property purchases.
I want to stay informed about industry trends and new products in the market
I want to generate positive reviews and ratings for my hotel to build trust and credibility.
I need assistance in managing inventory and ensuring timely replenishment.
Tasks and activities
Create and manage lists of required property items for bulk purchase.
Research and compare proces from various suppliers.
Place orders and make secure online payments for property purchases.
Coordinate deliveries and schedule installations or maintenance services.
Review and evaluate supplier performance and reliability.
Manage inventory and ensure sufficient stock levels for ongoing operations.
pain points
Finding reputable suppliers who offer competitive prices and quality products.
Managing multiple orders and keeping track of delivery schedules.
Dealing with delayed or incorrect deleiveries and resolving related issues.
Balancing budget constraints with the need to maintain quality standards.
Handling communication challenges, such as laguage barriers or unresponsivesuppliers.
Adapting to changes in property management requirements and demand patterns.
Opportunities and features
Integrate with popular online suppliers to provide direct access to their catalogs and pricing.
Offer personalized recommendations based on previous purchase history and industry trends.
Enable secure online payment options, such as escrow services or trusted payment gateways.
Introduce AI-powered chatbots to assist with inquiries, product search, and issue resolution.
Offer bulk purchasing discounts or loyalty programs for repeat customers.
Include inventory management features, such as barcode scanning and automated stock replenishment reminders.
ideate
USER FLOWS
User flows helped me understand how users would navigate through the experience.
![](https://framerusercontent.com/images/rqoHoaGeKwvLdjZelXHIzkGut3s.png)
wireframes
I created initial wireframes and iterations of those wireframes, designing various options to find a solution.
![](https://framerusercontent.com/images/xcC3s3NotMUcdBA6Nh6Kn0v7Q.png)
solution
Some before and after screens from the initial release.
BEFORE
![](https://framerusercontent.com/images/iEdeZBMWpOulF9IHNk5I0ut7KU.png)
![](https://framerusercontent.com/images/0efTfPAWm3OqUrDqYZ1iMsoRbPk.jpg)
AFTER
![](https://framerusercontent.com/images/z36EE6JdY1uftqXqtbxyOI1a2M.webp)
![](https://framerusercontent.com/images/7PCajx58z0K1PyHmRR34VaxHxEE.webp)
![](https://framerusercontent.com/images/qKY5kQqIxUgw9XQwQABsdFAyCyg.webp)
![](https://framerusercontent.com/images/W8qsMYAgk2YXT4KQfhEcOtf2s.webp)
![](https://framerusercontent.com/images/vO6dIRIbsIisCRMJ2Z0EdaDqAo.webp)
![](https://framerusercontent.com/images/T6WHQqxlzx8UimCgU697pONeSl0.webp)
![](https://framerusercontent.com/images/cMfgzMGX7xxF9hhnyPdlc7cZL7g.webp)
![](https://framerusercontent.com/images/XYnmghdmIy2uioRMWlhVXHwutuA.webp)
![](https://framerusercontent.com/images/ve8CWxS9VLNw81SXDGD8bgPMg9E.jpg)
impact
In 2019, HD Supply achieved a significant milestone by generating $1 billion in online revenue for the first time. This success was driven by a comprehensive website redesign that enhanced ease of use, improved site speed, and expanded product offerings.
User experience was a key focus in the design execution. The HD Supply website and mobile app now feature intuitive navigation, streamlined search filters, and interactive product listings, ensuring a seamless user journey.
The mobile app garnered prestigious accolades, winning the 2020 October Awards for Best Mobile App Design and the 2020 Horizon Interactive Award for Best Mobile App.
This project was
a tremendous
success.
$1B
Within the first six months of launching
this feature, Expedia achieved over $4 million in spending
Mobile Award
Won the 2020 October Awards for Best Mobile App Design and 2020 Horizon Interactive Award for Best Mobile App.
test
Throughout the design process we tested the designs with users and gave them specific tasks during testing to get feedback.
![](https://framerusercontent.com/images/XIv4Au2DzZoWikcidnW5VRqz4.png)