CLIENT

Honda Canada

ROLE

Lead Product Designer

SERVICES

Requirements Gathering / Workshop Facilitation / UX/UI design

How might we design an intuitive online credit application that provides customers with a seamless transition to the dealership to complete their purchase?

Honda Canada was looking to modernize its credit application process as part of a larger effort to enhance their customer’s online shopping experience. To take their existing credit application from paper to digital, our Design team was engaged to develop the MVP user experience and later the high-fidelity detailed designs to take into development.

DISCOVERY

I’ll start by going over the work that the Strategy & Research team did, as their work set the foundation for our Design Team’s work. The Strategy & Research Team conducted stakeholder engagement activities to understand the current state and define the vision for a customer-friendly, omni-channel credit application solution.

Customer Identification

Four customer segments were identified based on their behaviours, needs, frustrations and goals. These segments were developed into personas, and corresponding current state journeys were also developed with an emphasis on the emotional state and high priority moments that matter.

Sample Customer Persona

Sample Customer Persona

Sample Current State Experience

Sample Current State Experience

Future State Vision

A workshop was held with Honda executives to co-create a future state vision which addressed the previously identified problem statements, solutions and impact, emotions, touchpoints and potential risks.

Future State Journey Map

Future State Journey Map

Future State Customer Experience

Future State Customer Experience

Idea Prioritization

The proposed solutions were mapped back to the problem statements to ensure that the team would design towards core user needs. Then, the solutions were evaluated on their desirability, viability and feasibility.

Prioritization Matrix

UX Requirements

This is where our Design Team in - we were tasked with bringing the online credit application vision to life. To start, I helped to plan and facilitate a workshop with senior executives to translate the future state journey map and desired features into a screen flow.

REQUIREMENTS GATHERING

screenflow sketch.png

I then created low-fidelity wireframes and conducted another workshop to gather UX requirements and validate the screen flows with Honda executives.

screenflow workshop.png

After validating the screen flows, we prioritized the most complex screens to develop mobile wireframes for, which included:

  • Screening Questions

  • Application Information

  • Co-applicant Information

  • Trade-in Details

  • Review & Submit Page

  • Decision/Results Page


Functional & Technical Requirements

Concurrently, our other team members gathered functional and technical requirements through workshops with Honda executives and the Development Team. We worked closely alongside all stakeholders to ensure we were aligned and that any impacts to UX based on the functional/technical requirements, or vice versa, were communicated clearly. Outputs included:

  • List of functional requirements

  • Architecture refinement

  • Sequence Diagram Mapping

  • Exception Scenario Identification

Prototyping

Design Principles

Before diving into prototyping, we developed design principles based on the needs, pain points and goals of customers - uncovered during the Strategy Phase - as well as inspiration from industry leaders and UX best practices. These principles provided the basis for design decisions to ensure an intuitive, frictionless and flexible experience for users.

Principle 1: Less is more

Reduce clutter and keep things simple to focus user’s attention and decrease cognitive load.

Principle 2: The faster the better

Only ask what’s mandatory, minimize steps needed to complete a task, and reduce typing effort.

Principle 3: Situate the user

Ensure the user knows where they are in the process.

Principle 4: Make it fun

Keep it fun and engaging in terms of the tone and look & feel, to relieve barriers traditionally associated with application forms.

mockup_transparent.png

Prototypes

I created interactive mobile and desktop prototypes to capture the end-to-end flow of the online credit application, including conditional logic applied to certain screens and questions. This helped stakeholders better understand what the customer journey could look like and was used to drive design review sessions, test concepts, and gather feedback for continuous iteration.

Wireflows

I created several wireflows to illustrate the various entry points into the online credit application as well as exception paths (i.e., if there is a price change, or an accessory is discontinued before the user finishes applying). I documented all the conditional logic in the wireflows as well as a detailed annotations for each screen to hand off to the Development Team; this helped to provide clarity for the development of user stories.

Gravity-Devices-UI-Mockup-Set-vol7.png

Detailed Design

Once the wireframes were completed, I worked closely with our UI Designer and Copywriter to create high-fidelity detailed designs for mobile and desktop. These visual designs incorporated Honda’s style guide and met WCAG Level AAA accessibility standards.

We held several Design Review Sessions with Honda to gather feedback and iterate on the wireframes and detailed designs to ensure that they addressed user needs and also captured information required by the business.

DESIGN FEATURES

Trade-in Value –  A free trade-in value for an existing vehicle entices customers to expedite their purchase by showing them an immediate discount to their purchase, based on an anticipated no-haggle price of their vehicle.

Identity Verification – The customer application is verified through a “Know Your Customer (KYC)” questionnaire that complies with Fintrac reporting.

Instant Auto-Approval Decision Allowing the customer to apply from any device and receive a near instant approval decision makes the process easier & increases the likelihood of converting the approval into a sale. 

Send Decision to Selected Dealer – The online process facilitates a smooth transfer of application & approval data to the dealership.

IMPACT

The online credit application is now launched and provides customers with a flexible, fast, and transparent way to apply for credit. It also creates business value by pushing customers into the sales funnel. It reduces the time required by dealers to get customer information so they can focus their time on providing tailored products and services.

This online credit application also led Honda to rank first in a national customer satisfaction study.

SKILLS DEVELOPED

Product Management

Requirements workshop facilitation

AxureRP & Prototyping Conditional Logic

Responsive Design

WCAG Level AAA accessibility standards.

INSIGHTS

We faced pushback from the Development Team as we did not give enough consideration to technical feasibility and cost constraints. Eventually, we took a step back and sat down with the Development Team and business stakeholders to go through edge cases and iterated the designs to balance usability & feasibility. It was a very collaborative process and we ended up with a very positive working relationship, but I definitely learned we would’ve saved a lot of time if we had been more collaborative earlier on.

Previous
Previous

Social Assistance Case Management Platform

Next
Next

Siena