Redesigning Honda Financial Services Website
In the digital landscape, we recognized that established corporations were shackled by outdated designs of the early 90s. Our team set out to re-imagine the website, ensuring the focus remained on the needs of the company's loyal, long-standing customers.
This is an industry project with a team of 4 designers specialising in UX and visual design.
CLIENT
Honda and Acura
TEAM
3 UX Designers and 3 Visual Designers
DURATION
6 Months
PLATFORM
Mobile and Desktop
Project Description
An online portal that manages the payment of leasing or taking a loan on a car. This service is available on their website for both, Honda and Acura. This is a re-design project of a website that had problems in the UX and Visual design.
This service offers customers various ways to pay the bills, visualize their expenditures, set payment cycles, communicate with customer services, and hold accounts for many other modes of transport provided by the company.
From tedious paper-work to seamless digital transactions
Project Concept
Converting paperwork or the mundane task of going to the bank or office to pay bills into a digital experience provides a glimpse of the future. Increasingly, services are becoming digital, allowing people to interact with them digitally.
This project involved redesigning a portal that faced various issues, from poor interaction design to accessibility concerns. The team had to carefully research and ideate to address these problems.
Objectives
Restructuring the information from
old to new
Shifting to an entirely online model, both website and mobile
Solved end experiences and drop-off points for users
Designed experiences for users that guided them and provided documentation for quick decision making
Reduced steps to pay by tailoring payment options to user needs and goals
Studying 2000's website design
Structure
We studied the current website used for financial operations. And found out the pros and cons by conducting a heuristic evaluation and creating an existing flow.
These flows made us realize how old the experience was. Complex journeys and lack of documentation were some of the problems that plagued the users. We needed to come up with a simpler and updated design!
Opportunities
As we created a flow based on the current website, we discovered opportunities and flows that can be improved.
Various elements and page structures that can be changed to get the most of what the site has to offer.
What are the users going through?
Goal of the Study
We wanted to learn the pain points, why they use the website, and what is difficult for them. Through surveys, we got the pain points and valuable information about the users. The major questions are mentioned below, from which we based our survey.
Information Architecture
Keeping these 3 fundamental areas at the heart of the solution
Users
We first made a set of goals and flows for a first time user and a returning user, as their needs will be different. We would need to design experiences that tailor specifically to their requirements.
Payment Methods
Secondly, we distinguished two different payment techniques for each user. Which produced unique flows with separate goals for each.
End Experience
By making these goals, segregating users, and tasks we were able to make flows that were easy to understand. These tackled the problems faced in the previous website and focused on solving them.
User Goals and Flows
With the previously made requirements and goals, we created flows for each scenario.
Building Wireframes
The final steps in the re-design was the come up with wireframes but before that get some feedback for the new flows and architecture of the website from the clients.
As I was the part of the UX team, we had to deliver high-fidelity wireframes to the Visual design team. These wireframes had to go through multiple rounds of feedback with the client teams. Then passed on to the UI team for the final designs.
Desktop and Mobile
We kept in mind that most of the components and features should also work in mobile too. This was the first medium we started designing and in parallel kept the mobile designs going.
We used similar components and optimized it for the mobile screens.
Design direction
A collection of design components or elements that appear multiple times on a site. A pattern library documents all of these ‘patterns’ and defines how they behave and look. UI-Patterns describes these design patterns as Recurring solutions that solve common design problems.
Visual design
At the final stage coming to bringing life to the screens and the flow through designed components to both desktop and mobile.
Selected Works
Agile HCTProject type
Research PhotographyProject type
Honda RedesignUser experience
Behavioral DesignBehavior Design
WikisickUX design
Climate WorkshopProject type