Buick Freeform

buick-envista-closup
buick-envista-closup
buick-envista-closup
Role

Product Designer

Deliverables

User study + User flows + Specifications + Partner UI Certification

Type

In-vehicle UX / UI

Date

2023

Role

Product Designer

Deliverables

User study + User flows + Specifications + Partner UI Certification

Type

In-vehicle UX / UI

Date

2023

Overview

One of GM’s first frameworks using an irregular (non-rectangular) display shape to be used in multiple Buick vehicles. This display was using Google Automotive Services (GAS) OS and would go into both electric and internal combustion engine (ICE) vehicles. For multiple products under connections and partner UI, I provided the wireframes, user flows, unique behaviors, and acquired UX certification for Apple CarPlay and Android Auto.

Overview

One of GM’s first frameworks using an irregular (non-rectangular) display shape to be used in multiple Buick vehicles. This display was using Google Automotive Services (GAS) OS and would go into both electric and internal combustion engine (ICE) vehicles. For multiple products under connections and partner UI, I provided the wireframes, user flows, unique behaviors, and acquired UX certification for Apple CarPlay and Android Auto.

Overview

One of GM’s first frameworks using an irregular (non-rectangular) display shape to be used in multiple Buick vehicles. This display was using Google Automotive Services (GAS) OS and would go into both electric and internal combustion engine (ICE) vehicles. For multiple products under connections and partner UI, I provided the wireframes, user flows, unique behaviors, and acquired UX certification for Apple CarPlay and Android Auto.

Problem Statement

Reduce the complexity of the different device lists and increase accessibility. There were three separate lists available to the user: phone, CarPlay, and Android Auto. All three were individual and accessible to the user, but only one at a time and only by specific user paths. The difficulty of switching phones was also a pain point.

Problem Statement

Reduce the complexity of the different device lists and increase accessibility. There were three separate lists available to the user: phone, CarPlay, and Android Auto. All three were individual and accessible to the user, but only one at a time and only by specific user paths. The difficulty of switching phones was also a pain point.

Problem Statement

Reduce the complexity of the different device lists and increase accessibility. There were three separate lists available to the user: phone, CarPlay, and Android Auto. All three were individual and accessible to the user, but only one at a time and only by specific user paths. The difficulty of switching phones was also a pain point.

Solution

Each of these lists originally served a purpose as part of legacy requirements. The obvious path forward to reduce complexity was combining all lists into one, but that had its own challenges.

The plan of improvement looked something like: assess the current flows and entry-points, map out how a single list would work to fulfill user needs, address the combined connection types, plan how to increase visibility and accessibility of the feature, user test the new framework, reiterate, and move to implement changes.

Assessing the impacted user flows and how they could be improved. Each list had different entry-points and connection scenarios and would now be leading to a single point. With a single destination, it also allowed for simplification of various prompts and error messages.

Next, to address the multiple connection types in one location. Previously, each list served a singular connection type (CarPlay, Android Auto, Bluetooth). Bringing them together, there was now a need to switch that device between Bluetooth and projection in addition to switching between separate devices. This was achieved by keeping the existing phone card component and adding a split connection type with visual ques to indicate the active phone + type. Working closely with software to make sure intended behavior and visual identifiers could be implemented as designed. Users could now switch the connection type, select a previously paired device, or add a new device from the same page.

Now that there was a unified list, there was a need to increase visibility and accessibility of the feature. After iterating different options and working with system framework team, it was determined the best option was to create a persistent entry-point in the app-tray area always that’s accessible from anywhere.

As an idea for continuous improvement, I would make a more identifiable persistent icon and reinforce that behavior association in other areas throughout the infotainment.

Solution

Each of these lists originally served a purpose as part of legacy requirements. The obvious path forward to reduce complexity was combining all lists into one, but that had its own challenges.

The plan of improvement looked something like: assess the current flows and entry-points, map out how a single list would work to fulfill user needs, address the combined connection types, plan how to increase visibility and accessibility of the feature, user test the new framework, reiterate, and move to implement changes.

Assessing the impacted user flows and how they could be improved. Each list had different entry-points and connection scenarios and would now be leading to a single point. With a single destination, it also allowed for simplification of various prompts and error messages.

Next, to address the multiple connection types in one location. Previously, each list served a singular connection type (CarPlay, Android Auto, Bluetooth). Bringing them together, there was now a need to switch that device between Bluetooth and projection in addition to switching between separate devices. This was achieved by keeping the existing phone card component and adding a split connection type with visual ques to indicate the active phone + type. Working closely with software to make sure intended behavior and visual identifiers could be implemented as designed. Users could now switch the connection type, select a previously paired device, or add a new device from the same page.

Now that there was a unified list, there was a need to increase visibility and accessibility of the feature. After iterating different options and working with system framework team, it was determined the best option was to create a persistent entry-point in the app-tray area always that’s accessible from anywhere.

As an idea for continuous improvement, I would make a more identifiable persistent icon and reinforce that behavior association in other areas throughout the infotainment.

Solution

Each of these lists originally served a purpose as part of legacy requirements. The obvious path forward to reduce complexity was combining all lists into one, but that had its own challenges.

The plan of improvement looked something like: assess the current flows and entry-points, map out how a single list would work to fulfill user needs, address the combined connection types, plan how to increase visibility and accessibility of the feature, user test the new framework, reiterate, and move to implement changes.

Assessing the impacted user flows and how they could be improved. Each list had different entry-points and connection scenarios and would now be leading to a single point. With a single destination, it also allowed for simplification of various prompts and error messages.

Next, to address the multiple connection types in one location. Previously, each list served a singular connection type (CarPlay, Android Auto, Bluetooth). Bringing them together, there was now a need to switch that device between Bluetooth and projection in addition to switching between separate devices. This was achieved by keeping the existing phone card component and adding a split connection type with visual ques to indicate the active phone + type. Working closely with software to make sure intended behavior and visual identifiers could be implemented as designed. Users could now switch the connection type, select a previously paired device, or add a new device from the same page.

Now that there was a unified list, there was a need to increase visibility and accessibility of the feature. After iterating different options and working with system framework team, it was determined the best option was to create a persistent entry-point in the app-tray area always that’s accessible from anywhere.

As an idea for continuous improvement, I would make a more identifiable persistent icon and reinforce that behavior association in other areas throughout the infotainment.

buick-envista-interior-screen-angle
buick-envista-interior-screen-angle
buick-envista-interior-screen-angle
buick-envista-interior-screen-straight
buick-envista-interior-screen-straight
buick-envista-interior-screen-straight

Other Common Objectives

Each program will have similar constraints that come with a new framework on different sized displays. They are more routine, but still need attention and definition.

  • Defining multiple container sizes for users to customize their experience.

  • Working around no touch / inactivity zones and digital control buttons.

  • Display dimensions and pixel density to support multiple resolutions.

  • Managing the different features and tweaking implementations for other global markets when necessary.

I also fill out and submit CarPlay and Android Auto UX certification documents. This includes documenting user flows with videos and images on pre-production builds.

Working with UX

I collaborate with other product designers in various areas like framework, navigation, media, home screen, etc. to ensure the integration of my products is seamless, consistent, and intentional.

I work with the writing team to ensure messaging is consistent with each brand and other products throughout the vehicle.

Additionally, I work closely with the localization team on any new text or changes to apply correct translations for the global regions.

Working with UI

Each vehicle has multiple displays that receive design intent (main display, instrument cluster, HUD). I work closely with other GUI designers to translate wireframes into hi-fidelity screens, making sure they meet the design intent, brand standards, and match vehicle theming.

Working with Software

I work with software teams throughout the US and Canada, providing guidance, specifications, and any limitations or possibilities for implementation. Operating together in an agile environment, we collaborate to deliver new features and regular updates.

Other Common Objectives

Each program will have similar constraints that come with a new framework on different sized displays. They are more routine, but still need attention and definition.

  • Defining multiple container sizes for users to customize their experience.

  • Working around no touch / inactivity zones and digital control buttons.

  • Display dimensions and pixel density to support multiple resolutions.

  • Managing the different features and tweaking implementations for other global markets when necessary.

I also fill out and submit CarPlay and Android Auto UX certification documents. This includes documenting user flows with videos and images on pre-production builds.

Working with UX

I collaborate with other product designers in various areas like framework, navigation, media, home screen, etc. to ensure the integration of my products is seamless, consistent, and intentional.

I work with the writing team to ensure messaging is consistent with each brand and other products throughout the vehicle.

Additionally, I work closely with the localization team on any new text or changes to apply correct translations for the global regions.

Working with UI

Each vehicle has multiple displays that receive design intent (main display, instrument cluster, HUD). I work closely with other GUI designers to translate wireframes into hi-fidelity screens, making sure they meet the design intent, brand standards, and match vehicle theming.

Working with Software

I work with software teams throughout the US and Canada, providing guidance, specifications, and any limitations or possibilities for implementation. Operating together in an agile environment, we collaborate to deliver new features and regular updates.

Other Common Objectives

Each program will have similar constraints that come with a new framework on different sized displays. They are more routine, but still need attention and definition.

  • Defining multiple container sizes for users to customize their experience.

  • Working around no touch / inactivity zones and digital control buttons.

  • Display dimensions and pixel density to support multiple resolutions.

  • Managing the different features and tweaking implementations for other global markets when necessary.

I also fill out and submit CarPlay and Android Auto UX certification documents. This includes documenting user flows with videos and images on pre-production builds.

Working with UX

I collaborate with other product designers in various areas like framework, navigation, media, home screen, etc. to ensure the integration of my products is seamless, consistent, and intentional.

I work with the writing team to ensure messaging is consistent with each brand and other products throughout the vehicle.

Additionally, I work closely with the localization team on any new text or changes to apply correct translations for the global regions.

Working with UI

Each vehicle has multiple displays that receive design intent (main display, instrument cluster, HUD). I work closely with other GUI designers to translate wireframes into hi-fidelity screens, making sure they meet the design intent, brand standards, and match vehicle theming.

Working with Software

I work with software teams throughout the US and Canada, providing guidance, specifications, and any limitations or possibilities for implementation. Operating together in an agile environment, we collaborate to deliver new features and regular updates.

buick-envista-interior-carplay
buick-envista-interior-carplay
buick-envista-interior-carplay
buick-envista-interior-wide
buick-envista-interior-wide
buick-envista-interior-wide
buick-envista-exterior-side
buick-envista-exterior-side
buick-envista-exterior-side

Images provided by GM Pressroom

Images provided by GM Pressroom

  1. View Project
  2. 01
  3. 02
  4. 03
  5. 04
  6. 05
  7. 06
  8. 07
  9. 08
  10. 09

I appreciate the interest.

Let's connect.

I appreciate the interest.

Let's connect.