Toyota Financial Services is a platform dedicated to service excellence. Where millions of Toyota customers drive their vehicles, thanks to their flexible financing and leasing, comprehensive vehicle, payment protection plans, and well-rounded insurance offerings.
Visit toyotafinancial.com
Duration
11 Months
2018 - 2019
Role
Design Lead
Art Direction / Design System / Manager
The Ask
TFS approached us to redesign their logged-in experience to create simplicity for their users with a streamlined registration, simplified payment system, a new lease-end experience and a dashboard where a user had all the details of the vehicle they needed.
What I Did
• Led the redesign of Toyota Financial payment experience
• Managed a team of ux/ui designers
• Hired and Delegated work within our team
• Provided access to the right tools
• Promoted a healthy team culture
• Led creative critiques
• Set team Milestones
• Led team retros
• Story pointed user stories
• Partnered with Clients and Stakeholders to help meet requirements
• Delivered visual designs via Zeplin and worked closely with dev teams for QA
• Presented work to all stakeholders and client
• Led client workshops with our UX export and team
• Designed and managed the design system (later used across Toyota's Platforms)
• Worked with strategy to help conduct user interviews (9 interviews)
• Helped with conducting user testing
• Responsible for all work meeting Accessibility Requirements
• Provided content creation guidelines based on web accessibility and statistics
• Reported directly to our Creative Director
Style Guide / Design System
I started with developing a style guide from what was existing already to jumpstart our guide. Working closely with Saatchi’s brand team and the existing pallets from Toyota, I was able to enhance the styles. Making them more modern and fresh. Since this was a living and breathing document I was always able to add to it and document everything while making sure that the style guide was always up to date to hand off to the developers and client. As I was continuing to build this out I was always testing our compliance to meet a AA+ compliance level.
Wire Frames
As I was developing the style guide, I began to work with our UX team to dive into user stories to help build the architecture of the pages. After grooming user stories, we were able to begin to prioritize the elements needed for each page and what functionality needed to be available for the user.
These wireframes were meant to be simple, to map out the flow and functionality of the experience, and help catch any problems early. We worked in an agile methodology working in sprints of ux for 2 weeks, and design for 2 weeks. Making sure that we were able to adapt to any client request.
Visual Design
Using the Atomic Design methodology our team was able to begin building pages from the wires, style guide, so that we could iterate quicker with the components. We wanted complete consistency throughout the experience. Knowing we had over 10 million users coming here this experience needed to be seamless. Creating less friction for a task that many people dread doing every month. Using clear hierarchy to help guide the user through sections, typography to help highlight what was important to be read or scanned to help give the user direction. We also had to make sure we were using brand color appropriately since Toyota primary color is red. We had to take that into consideration when on our action states. Last thing we accounted for was accessibility, AA+ level of contrast, focus states, validations, notifications, and alt tagging.
