Amy
Huang

Overhauling UHaul

A responsive redesign of the UHaul website.

Introduction

UHaul is one of the most popular moving truck rental companies, known for its affordability and the hassle-free pickup process. It has been so popular that people say “I’ll UHual”, instead of “I’ll rent a truck” when moving. Contrasting its popularity, however, UHaul’s website makes the reservation process so complicated that some people would rather visit a store directly than reserving online. It’s time to boost its usability!

To improve the usability of UHaul’s website, we first analyzed the site using the usability factors from usability.gov and addressed usability issues through iterations of wireframing. Combining all the wireframes, we created a navigation flowchart to illustrate how a user might be able to complete the reservation in 5 steps.

Based on the wireframes, we redesigned the visual appearance of the website. To help translate our design into functioning programs we annotated how each page element should move and scale for various screen sizes and directions.

And lastly, we coded the front end of the new UHaul website.

Click here to try resizing the window yourself!

Original Pages

Wireframes

Comparison

Visual Redesign

To improve readability on the home page, the most popular services provided by UHaul, trailers, pickup trucks, vans, and trucks. The order is determined by the size of the vehicle. The additional services are now a graphic instead of an image to help determine the visual hierarchy of the webpage. The selection page of the rental process is completely redone. The map on the right has been added to help users visually understand where they are in proximity to a rental lot. The “Pick Up” and “Drop Off” options has a minimalistic appearance and utilizes a grid to lead the user’s eyes along the page. The bold orange from the logo helps keep the user visually engaged.

Responsive Redesign

Home Screen Desktop (1440x1024)
Home Screen 4K Widescreen (1920x1080)
Home Screen Tablet (iPad Pro: 834x1112)
Home Screen Phone (iPhone X: 375x812)
Selection Screen Desktop (1440x1024)
Selection Screen 4K Widescreen (1920x1080)
Selection Screen Tablet (iPad Pro: 834x1112)
Selection Screen Phone (iPhone X: 375x812)