WillScot

Context

Today the corporation has a market cap of ~$10B, making it the second largest player in the industry. The industry is dominated by WSMM and a small set of other large players, which all offer a broad range of specialist products to serve customers’ sites. Recently multiple smaller companies are emerging in the industry, differentiating themselves by offering quick and convenient access to units or entirely tailor-made solutions.
‍
The business was formed in 2020, with the acquisition of Mobile Mini (a Phoenix-based, portable storage provider) by WillScot (a Baltimore-based, supplier of flexible spaces). The integration of the two businesses, along with other, smaller acquisitions has been an ongoing process. To date, the focus of the integration has been on unifying back-end systems. Now, attention is shifting over to the merger of the two brands into one, with a singular front-end, customer experience.
‍
The first step in this phase will be the development of a new consolidated website.

Identifying Challenges

Separated web domains, slow traffic and limited lead generation

Lack of transparency into fulfilment and delivery process

Limited support options, lacking consistent and proactive servicing

Billing ambiguity and siloed processes add time and uncertainty

Complex returns and damanges process with limited renewal

Purchasing cannot be completed online, with limited cross and upsell capabilities

Limited configurable shopping and minimal sales automation

What does their Business Need?

Focusing on users and their journey‍

Organizations that focus on delivering an exceptional experience have become leaders in their industries. By designing their entire process around the needs and expectations of users, they create more effective and insightful solutions.

We realized that rapid advancement of digital technology and evolving user expectations has made the organization question whether they need to digitally transform and how to start. Our approach was to guide them through this transformation by focusing on the target users. We aim to help them design a comprehensive vision for seamless, connected digital experiences that span the entire user journey. By putting user needs at the center, we will ensure their digital offerings are not only competitive but also ahead of the curve at all times.

Attract, Regain, and Grow by meeting expectations in Key interactions.

The journey stages represent a series of experiences (e.g. transactional, educational, professional, etc.) which shape successful user outcomes. Taking a user-centered approach to digital transformation positions these points as the focus for differentiation and value.

Businesses must identify and prioritize interactions across the journey that drive user decisions to stay, leave, or invest more in their relationship with a company. Delivering on the needs and expectations of users in these moments has the biggest impact on their actions. The aim of Willscot MobileMini’s digital transformation will be to digitally facilitate each stage of the use journey.

User Research

The company needed to focus deeply on understanding their target audience—customers, employees, and investors. By identifying what these groups want, need, and expect, we could tailor our approach to effectively communicate the company’s value. User research helps us meet their expectations and strengthen our overall engagement.

Digital Audience

Industries they serve

Competitive Analysis

The industry is constantly being reshaped by emerging digital capabilities and applications; by understanding how incumbents and new market entrants have designed or enhanced user experiences throughout the user journey we revealed where WSMM must compete and stand out with its digital capabilities.

User expectations are being changed by leading experiences across different industries. WSMM can take inspiration from the digital advancements made by some of the world’s leading organizations. The companies profiled below have engaged in digital transformation at critical phases of their customers’ journeys to deliver impactful, valuable experiences

Interview Synthesis

I conducted 20+ interviews with the stakeholders and customers to uncover key insights/pain points related to the web experience and the customer portal. These discussions provided a comprehensive understanding of business objectives, brand voice, and organizational challenges. I gathered crucial insights into strategic goals and operational hurdles, which further informed the design and functionality of the unified platform. I engaged with end-users to identify their needs, frustrations, and expectations regarding the website and internal portal. This feedback highlighted critical pain points in user experience and navigation, helping us refine the information architecture and improve overall usability.

FigJam sessions to gather Interview insights and common pain points

Customer Journey Map

We developed a comprehensive customer journey map to better understand the user experience across the newly unified platform and internal portal. This process was crucial for visualizing how users interact with our services from start to finish and identifying key touch points and pain points. We integrated insights from the stakeholder and customer interviews into the journey map. This involved highlighting critical interactions and stages users go through, from initial contact to post-support.

Information Architecture

Analyzing the existing IA: I performed a thorough content audit of the eight existing website IAs. This involved cataloging the content, identifying redundancies, and evaluating the effectiveness of the current organization. By analyzing the existing structures, I identified common patterns and content types. This helped in understanding what worked well and what needed to be restructured for a more cohesive experience.

Designing the new IA: I prioritized user needs by creating a new IA that simplified navigation and made information more accessible. This involved reorganizing content into logical categories and creating clear, intuitive pathways for users to find what they need. I developed a hierarchical structure with a clear, top-down approach. Key categories were defined, and subcategories were organized to ensure users could easily drill down to specific information without feeling overwhelmed.

Tree Testing and Gathering Insights

After developing the new information architecture (IA), we proceeded to validate its effectiveness through a two-pronged approach involving tree testing and internal team feedback. To ensure the IA's usability, we conducted tree testing using Maze, which involved asking participants to locate specific items within the proposed structure. This process provided quantitative data on how well users could navigate the site and find information, highlighting any potential issues or areas of confusion.

Concurrently, we gathered insights from internal teams who have a deep understanding of the content and organizational needs. Engaging these stakeholders allowed us to review the IA from a practical perspective, ensuring that it aligned with both user expectations and business objectives. The feedback from these teams was invaluable, revealing gaps and suggesting refinements that enhanced the IA's overall effectiveness.

Initiated a Collaborative FigJam Board to facilitate feedback and iterative improvements

Wireframes

With the validated information architecture in place, the next step in the design process was wireframing, a crucial phase for translating our IA into tangible, interactive designs. To kick off this stage, I drew inspiration from competitor platforms and other leading B2B applications. Analyzing these sources provided valuable insights into effective design patterns and user interface elements that resonate well with users. This benchmarking helped identify best practices and innovative approaches that we could incorporate into our wireframes.

The wireframing process began with quick brainstorming sessions aimed at exploring various design concepts and approaches. This collaborative effort, allowed us to experiment with different ways to present content and guide user interactions.

By leveraging competitive analysis and B2B application trends, combined with brainstorming and user research insights, we developed wireframes that were both functional and user-centric. These wireframes served as the blueprint for the website, providing a clear visual representation of how users would interact with the new IA and ensuring a cohesive and intuitive user experience across the consolidated platform.

Final Solution

The WillScot website employs a range of UX best practices to create a streamlined, user-friendly experience. The clean design, responsive layout, and prominent CTAs reflect a focus on usability and conversion. High-quality imagery and intuitive navigation enhance content engagement, while the search functionality and comprehensive footer contribute to a seamless user journey. Trust signals further bolster credibility, reinforcing the company's reputation and reliability. Overall, these features are strategically designed to align with user needs and business objectives, delivering an effective and professional online presence.

Selected UI/UX Improvements

Industries Section

The "Industries" section leverages horizontal scrolling and pulse points to create an engaging, user-centric experience.

The interactive highlight cards with pulse points not only enhance visual appeal but also drive user engagement by making key information more accessible and memorable.

This design effectively showcases the company’s diverse solutions across various industries, providing a clear, organized way for users to explore and understand the offerings tailored to their specific needs.

Search for the Perfect fit

This page is crafted to offer a seamless and engaging experience for users looking to explore WillScot’s range of units.
‍
The "Sales Showroom" page reflects our commitment to creating a user-centric experience. With an interactive gallery, robust search functionality, and detailed unit information, we aimed to make the process of finding and evaluating units as intuitive and efficient as possible.
‍
The user-friendly navigation and well-placed CTAs further guide users smoothly through their journey, making the page a crucial component of the website’s overall design.

Lead Generation Form

The goal here was to create a straightforward and efficient way for users to request a quote.
‍
The “Request a Quote" page is designed to be user-centric and efficient. The step-by-step form layout, combined with effective imagery and clear instructions, minimizes confusion and enhances usability.

By incorporating these design elements, we aimed to make the process of requesting a quote as straightforward and pleasant as possible, ensuring users can easily get the information they need.

Comprehensive Product Overview

This page was crafted to ensure that users have all the information they need at their fingertips, making the process of evaluating and selecting the right product as seamless and efficient as possible
‍
The page was designed to provide comprehensive details on the product (ground-level office units), including features, dimensions, and customization options, all in one place. This approach minimizes the need for users to navigate through multiple pages, streamlining their decision-making process.
‍
High-resolution images and interactive elements enhance the user experience by allowing them to explore different office configurations and visualize the spaces in context.
‍
Detailed product sections are neatly organized with expandable content, ensuring that users can access in-depth information without feeling overwhelmed.
‍
Clear CTAs like “Request More Information” and “Contact Us” are strategically placed to facilitate further engagement.

Next Steps

The next steps involved a comprehensive handover to the development team to ensure a smooth transition from design to implementation. The design team meticulously prepared a detailed handover package, including annotated design files, style guides, and interaction specifications. This package was designed to provide clear guidance on every aspect of the website’s design, from layout and typography to interactive elements. We leveraged Jira to manage and track the development tasks, creating detailed tickets for each feature and page, specifying design requirements and functionality. This helped keep the development process organized and ensured that all team members were aligned on the project’s objectives.

Daily standup meetings played a crucial role in our collaboration, providing a forum to discuss progress, address any design-related questions, and resolve issues quickly. My active participation in these meetings ensured that the development team received timely feedback and could make necessary adjustments.Throughout the development phase, we conducted regular reviews to verify that the implementation adhered to the design specifications, allowing for iterative improvements and maintaining the integrity of the original design. This structured approach to the handover process ensured a cohesive and successful realization of the redesigned website, aligning with our vision and enhancing the overall user experience.

Web Consolidation: A journey to Digital Transformation

About the Company

Status

Tools

Time Frame

My role