Modernizing MHI.org: A Content-Heavy Website Redesign
Discovery, alignment, & website design
OOUX
UX Design
Visual Design
Web
MHI, the primary information hub for material handling, logistics, and supply chain industries in the US, tasked us with redesigning their decade-old website. Our challenge was to modernize the site, reflecting MHI's technical prowess and reinforcing their industry leadership.
Client
MHI (Material Handling Industry of America)
Client
MHI (Material Handling Industry of America)
Client
MHI (Material Handling Industry of America)
Timeline
Q2 2023, 8 weeks
Timeline
Q2 2023, 8 weeks
Timeline
Q2 2023, 8 weeks
Role
UX Designer, Visual Designer
Role
UX Designer, Visual Designer
Role
UX Designer, Visual Designer
What I Did
Assistant Researcher, Lead UX Design, Visual Design
What I Did
Assistant Researcher, Lead UX Design, Visual Design
What I Did
Assistant Researcher, Lead UX Design, Visual Design
Project Overview
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Regulation Table
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Regulation Text
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Regulation Table
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Challenge
Overhaul and refresh an 11 year old, content-heavy website so that it reflects the organization’s actual technical capabilities and reinforces that they are a future-thinking brand.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Output
I created a robust set of OOUX-based wireframes with prioritization, detailed web page design mockups, updated branding documentation, and additional assets to assist the organization in implementing the designs.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Context
The Material Handling Industry of America (MHI) is a non-profit organization that serves as the largest hub of information for the material handling, logistics, and supply chain industries in the United States. Their website hosts a massive library of content about these industries ranging from press releases and marketing material to industry standards documents and fundamental educational material. MHI additionally functions as a neutral marketplace for practitioners to find different vendors.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Team
Our team consisted of a Principal UX Designer, myself as a Senior UX Designer, a Business Analyst, and a Project Manager, as well as Client stakeholders and project management.
Project Conclusion
Next Steps
Integration with Policies module
Viewing regulations is only half of the task. We had begun work to bring the Regs experience and the Policies experience together when the contract was ended.
View for healthcare practicioners
The primary use case for this version was for policy writers, but regular doctors, nurses, and other healthcare staff need to be able to read the regulations as well.
Incidents view & integration
Another workflow that the Relias product was supposed to include was documenting and responding to incidents, and ensuring repeat offenders were taking effective training to avoid incidents in the future.
Next Steps
Integration with Policies module
Viewing regulations is only half of the task. We had begun work to bring the Regs experience and the Policies experience together when the contract was ended.
View for healthcare practicioners
The primary use case for this version was for policy writers, but regular doctors, nurses, and other healthcare staff need to be able to read the regulations as well.
Incidents view & integration
Another workflow that the Relias product was supposed to include was documenting and responding to incidents, and ensuring repeat offenders were taking effective training to avoid incidents in the future.
Next Steps
Integration with Policies module
Viewing regulations is only half of the task. We had begun work to bring the Regs experience and the Policies experience together when the contract was ended.
View for healthcare practicioners
The primary use case for this version was for policy writers, but regular doctors, nurses, and other healthcare staff need to be able to read the regulations as well.
Incidents view & integration
Another workflow that the Relias product was supposed to include was documenting and responding to incidents, and ensuring repeat offenders were taking effective training to avoid incidents in the future.
Successes
High satisfaction from PO & client team
The PO for the feature and her peers in the product strategy group above us were all very happy with the final design and the efficient process we used to get there.
Implementation of complex UI
Collaborating with our Dev to find the best way to implement the nesting mechanism of the Regulations table led to highly accurate implementation of designs
Mentoring a junior designer through project
I was able to bring Rochelle through our process of gathering additional information from our PO and figuring out an efficient screen design order, which allowed her to ask a ton of questions and use that experience immediately on her next client project.
Successes
High satisfaction from PO & client team
The PO for the feature and her peers in the product strategy group above us were all very happy with the final design and the efficient process we used to get there.
Implementation of complex UI
Collaborating with our Dev to find the best way to implement the nesting mechanism of the Regulations table led to highly accurate implementation of designs
Mentoring a junior designer through project
I was able to bring Rochelle through our process of gathering additional information from our PO and figuring out an efficient screen design order, which allowed her to ask a ton of questions and use that experience immediately on her next client project.
Successes
High satisfaction from PO & client team
The PO for the feature and her peers in the product strategy group above us were all very happy with the final design and the efficient process we used to get there.
Implementation of complex UI
Collaborating with our Dev to find the best way to implement the nesting mechanism of the Regulations table led to highly accurate implementation of designs
Mentoring a junior designer through project
I was able to bring Rochelle through our process of gathering additional information from our PO and figuring out an efficient screen design order, which allowed her to ask a ton of questions and use that experience immediately on her next client project.
Failures
Full A11y testing on Regulation table
The design system we were building on came with some built-in a11y functionality, but we did not have an opportunity to test the table with any screen readers or other non-visual interfaces within the contract timeline.
Usability & acceptance testing
We were unable to do any testing of our designs with users of any kind. I can’t truly claim these designs are successful until I know that they passed usability testing.
Failures
Full A11y testing on Regulation table
The design system we were building on came with some built-in a11y functionality, but we did not have an opportunity to test the table with any screen readers or other non-visual interfaces within the contract timeline.
Usability & acceptance testing
We were unable to do any testing of our designs with users of any kind. I can’t truly claim these designs are successful until I know that they passed usability testing.
Failures
Full A11y testing on Regulation table
The design system we were building on came with some built-in a11y functionality, but we did not have an opportunity to test the table with any screen readers or other non-visual interfaces within the contract timeline.
Usability & acceptance testing
We were unable to do any testing of our designs with users of any kind. I can’t truly claim these designs are successful until I know that they passed usability testing.