• LinkedIn - White Circle
  • Vimeo - White Circle
  • Facebook - White Circle

 

 

COMPANION APP

&

MY ROLE.

AUG 2016 | 7 month

Commercial Project 

Softwares | Sketch, Flinto, AE

The Mercedes companion app gives users access to their Mercedes-Benz from anywhere. Start the engine, lock the doors, or get technical help at the push of a button.

Home Automation is a new section we added on Mercedes Companion app as the third major function.

 

As the only UX designer in the Home Automation project (1 PM, 1 researcher, engineer team). My work included producing wireframes, interactive prototypes, UI (iOS & Android) and conducting a user study.

 

DISCOVER

User Interviews

Journey Map

DEFINE

Problem Definition

How Might We

DEVELOP

Wireframe

Prototypes

User Study

DELIVER

UI Design

Micro Interactions

DISCOVERY

Home Automation is a new feature built in App and vehicle head unit that allows users loading “scenes” from HomeKit, Nest and SmartThings and using the vehicle’s GPS  to trigger “scenes” based on distance to a location.

 

2

LOCATIONS

Home

Office

 

 

2

ACTIONS

Departure

Arrival

 

 

2

GEOFENCES

Geofence1

Geofence2

 

 

3

SYSTEMS

HomeKit

SmartThings

Nest

 

 

>1

SCENES

Good Morning

Good Afternoon

Good Night

Welcome Home

Party Night

Go to Work

...

DEFINE

Hierarchy 

How will the new feature fit in with the rest of the app?

How will all hierarchy levels fit on a smaller portion of the screen?

How will users quickly see important information about their systems (if buried deeper in the app)?

How it works 

How will users know what the feature can do?

First-time user 

How will users quickly grasp how to use the feature?

How will users quickly discover the limitations of the feature?

PROTOTYPE

Click here to see workflows

Concept 1 - V.1

Concept 2 - V.2

RESEARCH

To compare usability of two UI concepts we conduct a user study among 10 participants by using the Think-Aloud technique.

Demographics & background / 

 

First impressions /

 

 

Think-Alouds /

 

 

 

Comparison of concepts /

 

 

 

Conceptual interview /

Personal information 

Familiarity with HA and the Companion App 

 

 

First exploration of concept 

 

15-minute intro and narrative

Completion of 10 tasks for each concept 

 

Ease of use Favorability 

Advantages/ Disadvantages

 

Perceived benefit 

Acceptance of limitations 

 
 
 

Findings |

Hierarchy 

How will all hierarchy levels fit on a smaller portion of the screen?

Put the most common use cases on the first level and move other use cases deeper.

Meanwhile, we still make it easy to find everything that’s deeper in the app.

Findings |

How it works 

How will users know what the feature can do?

 

1.Map explains concept of the geofence

 

2.Descriptive labels will help users find information and

 it also teaching the user how the concept works.

 

3.A right icon will be a good indicator.

Concept 1 - V.1

Concept 2 - V.2

Findings |

First-time user 

How will users quickly grasp how to use the feature?

In concept 1 and 2 we found:

1. Many of the UI elements that tested poorly did not match guidelines, so users were unfamiliar with the design patterns. 

2. Inconsistent designs made new users reapplying what they just learned.

So we:

1Try to Follow iOS guidelines, Use familiar designs to Avoid drop-down menus.

2. Add help text. It is a helpful tool to clarify process and explain the concept. 

USER STUDY SUMMARIES OF 

V.1 AND V.2

Hierarchy 

Testing revealed that the UI did not support the participant’s expectation that feature’s primary use case is configuring arrival and departure settings. Current labels, or lack of, lead to misinterpretations.

Mercedes-Benz customers tend to want as much information as possible to make the best decisions. They will hesitate to use a new feature if it is not clear how it works

Additionally, customers would rather see limitations up-front than find them out later on through trial-and-error. 

Customers may be new to home automation because they just purchased a system and immediately tried to set it up. After setup, users are not likely to use the feature frequently enough to become experts. A UI that favors new users is recommended

How it works 

First-time user 

DESIGN ITERATION

Both concepts showed a combination of aspects tested well. In the end of the study, I designed a solution v.3 that emerged the most user-friendly aspects of both versions. 

low - fidelity prototypes of V.3

High - fidelity prototypes of V.3

 
 

SECOND ITERATION

High - fidelity prototypes of V.4