Toyota Connected Services

At Toyota, tech support found that it was difficult for customers to use the apps & services available for their in-vehicle experience. With the multitude of connected services, customers had difficulty understanding the various offerings. Since Owners is a major touch point in the customer journey, a learning resource needed to be develop to engage and educate customers on the available services.

Preview for Toyota Connected Services

View the live page for Toyota Connected Services

Role

I led the UX process in content discovery, information architecture and interaction design. The team worked collaboratively in brainstorming sessions to develop a simple and elegant solution.

Collaborators

Visual Designer
Producer
Business Analyst
Account
Copy Writer
Associate Creative Director

Process

The challenge was to develop an easy way for users to get the gist of each offering, while being able to deep-dive further into areas that spark their interest. I collaborated closely with a visual designer, as we scoured the web for example UI that would satisfy this criteria. We decided that an accordion-style UI paradigm accomplished the task.

To reduce the number of clicks for users to reach information on each service, a single page scroll paradigm was used. The single page design is tried-and-true as demonstrated by major product pages for Apple, Sonos, and Bowers & Wilkins. It resonates with the user mental model of reading through a printed product brochure or a newspaper editorial. The simple scroll navigation reduces the need for users to jump from page to page. Finally, the fixed sub nav helped users both recognize their current position and navigate to other sections.

Our stakeholders thought that each service should have its own product page based on the amount of content. While each service offering could have commanded its own page, the accordion-style paradigm cleverly summarized the offering through short descriptive headers for each expandable selection. This paradigm permitted all services to be allocated on a single page without inundating our users with too much information.

Wireframes
Visual Design