GENESIS MOTORS
WEB PAGE DESIGN
Desktop & Mobile Web Design · Research · Content Strategy
Purchasing a Car, Transformed
Traditional patterns of commerce are shifting. Rather than transacting from retail locations, auto manufacturers like Tesla have created digital experiences that allow customization and purchasing through online platforms. We worked with Genesis Motors, a newcomer to Canada, to break into the auto industry by creating bespoke landing pages for their partner, REMAX.
To comply with my confidentiality agreement I have omitted and appropriated confidential information. These designs are a reinterpretation of the original.
The Dark Horse
In an effort to drive sales, Genesis Motors partnered with real estate company REMAX to entice agents to become early-adopter advocates of their vehicles. We were challenged to create an inspiring promotional landing page for REMAX agents where they could learn who Genesis is, see what their vehicles have to offer, book a test drive, and purchase.
This wasn’t as easy as it sounded. To ensure that this promotion could not be accessed by anyone else, we needed an unauthenticated state where REMAX agents could self-validate and enter an authenticated flow. Furthermore, REMAX has two separate organizations (West and Atlantic) with diverging requirements that needed access to a singular experience. We also had to allow agents to book test drives and build and purchase their vehicle, which meant integrating this experience with their existing e-commerce flow managed by a third-party.
My Role
As a UX designer at No Fixed Address Inc, I worked closely with our UX team, creative team, digital strategists, project manager and developers to bring this experience to life.
I was mainly responsible for:
The research
User flows
Content flow and wireframing
UI and development consultation
Presentation of all UX components to client
I also supported in the development of a CRM newsletter strategy that is not discussed in this case study.
What Drives the Driver
In order to inspire agents to consider Genesis, we first needed to grasp what the agents were looking for in a personal vehicle and key selling points to those shopping for luxury automobiles. We conducted a series of interviews with members of the REMAX team and also with Genesis’ Customer Experience Managers at their ‘boutiques’ to gain insight into our audiences’ values and why consumers choose Genesis. We found that many agents conducted business in their vehicles while they take clients out to various homes so wanted to impress through luxury, comfort, and innovative tech. We also looked into web experiences of industry leaders to find effective and delightful design patterns that were being utilized.
One Experience, Multiple Entry Points
The next step was to understand how REMAX agents of the two organizations were hoping to access the site and also their requirements of how they wanted to authenticate. We began white-boarding rudimentary flows to begin understanding how this would come together.
On one hand, agents from the Western region would mostly be entering through their secure internal portal where partnership offers are showcased. On the other hand, the Atlantic region did not have a comparable portal so would prefer to use email authentication.
I explored multiple avenues but recommended a system where non-portal agents could validate themselves in the unauthenticated experience by entering their unique identifier, which would be corroborated through a simple, back-end database check. Agents using a portal could enter via a whitelisted link, which meant they would arrive into the authenticated experience with promotional pricing already visible.
Content and Design
The next step was to map out the flow of content and begin wireframing using Axure RP. We first needed to indicate that the REMAX agent was in the correct place and start getting them excited about the products through inspiring copy and imagery. Since Genesis was a newcomer in Canada, we highlighted the Genesis brand and value proposition to begin building awareness of who they are.
We decided to keep all of the pertinent, vehicle-specific content in one spot so users did not have to exit to visit the main Genesis site so we leveraged patterns such as tabbed or expandable sections to house information. Users, authenticated or not, were able to fill in the "book a test drive" form through a modal window directly which would create leads for Genesis Experience Managers to contact. I used UI elements such as a fixed footer bar to house important CTA's relevant to each experience (ie. Enter your email vs. book a test drive).
When REMAX agents were ready to purchase, they were passed onto Genesis’ Build & Purchase experience with integrated promotional pricing.
Rather than designing 'mobile first', we believed in a process called “mobile aware” which meant creating mobile and desktop experiences in tandem to ensure that our designs and interactions were consistent and optimized across both.
As wireframes were approved, I worked hand-in-hand with our design team and developers to ensure that they understood and followed the designs. Through the design process, I championed accessibility as we were designing our site to specific WCAG 2.0 accessibility standards.
The Results
We designed a simple, secure experience that allowed multiple organizations with various technical requirements to identify themselves and fulfil their order. The experience integrated seamlessly with Genesis Motors' digital ecosystem and inspired the REMAX agent to get behind the wheel.
