Avant-garde UI/UX & CTA Focus
Throughout the website we pushed for two things to permeate for users: intuitive-yet-attractive UI/UX and a strong focus on providing opportunities for users to contact the company directly or to find dealers.
Left-Hand Sticky Navigation
The first UI/UX decision we made was around a simple left-hand sticky navigation menu. We purposefully kept this navigation simple so that it didn’t get too cluttered with options. The options were simple yet very important to Hino®:
- Trucks – Quick navigation to all of the truck sizes, GVWR options and more for each Hino® truck.
- Owners – Information for those that own Hino® trucks.
- Parts & Services – For users who need quick navigation to specific parts or services for their Hino® trucks.
- Language Options – To appeal to both French and English users and dealers.
Secondary Menu
We provided other ancillary links in a pull-out menu that were marked with a sandwich icon (the sandwich icon appears on any device size).
Dealer Call to Action (CTA)
On the truck pages, we created a sticky top menu navigation.
Progressive Sub-menu
A neat breakthrough we had with the UI/UX was creating a sub-menu on all the truck pages that lets users flip between the different models.
Enhanced Truck Pages
The previous website kept the truck content all text, usually less than 300 words and above the fold. We decided to create a high-fidelity artwork file for the truck pages alone that would combine:
- Heavy and relevant text content
- Great imagery
- Strong headlines
Melissa McInerney, our Chief Creative Officer has been building these types of page layouts for clients since 2012, first doing it with a previous North Star Windows & Doors (which went on to win “Outstanding Manufacturing Website” at the Web Marketing Associations 2013 IAC Awards.
The fundamental idea behind them is that we infuse the three items together: heavy text, headlines, and imagery or icons. Here’s the reason for heavy text – Google likes heavy, relevant content and certain types of users like to read in-depth on the product they are considering.
For users that don’t like heavy content, you include the headlines (e.g., see below: “Bottom Line: Driver Comfort”). And for users that may not even spend much time reading headlines, you include lots of imagery.
For users that don’t like heavy content, you include the headlines (e.g., see below: “Bottom Line: Driver Comfort”). And for users that may not even spend much time reading headlines, you include lots of imagery.