top of page
PROTECT&GO LUBE CENTRE PORTAL
mockup1.png
Visually engaging UI with a focus on information architecture and user navigation
Defining the Project

Requirement

Client brief tasked our team to design a responsive and user-friendly portal for their partnership launch--Protect&Go, a chain of lube services auto shops across Western and Eastern Canada. The goal was to create a UI that is intuitive and allow users to easily find information. The design must be geared towards users in the automotive/HDEO businesses, drivers, and mechanics.

Information Architecture

We began by engaging stakeholders in order to lay out a set of system requirements, and develop a user navigation map in order to address potential user needs. Following the Protect&Go brand guidelines, we developed a visually engaging and intuitive user interface that allowed for easy wayfinding and highlighted the Client's services and products. 

site map.png
The Design

Our goal was to create a visual design that aligned with Petro-Canada Lubricant's brand look, but at the same time ensure its usability by making our design responsive, clean, and intuitive.

We aimed to maintain affordance by giving all interactive elements rounded corners, which creates a visual contrast between the informational elements within the page. We opted to use graphics and brand colors sparingly throughout the website and kept the backgrounds white or gray to ensure an overall clean look. 

bottom of page