FORDPASS APP REDESIGN
Student Collaborator
Project Overview
My Role
UX Designer & Researcher
Date & Duration
Aug - Dec 2019
Sixteen Weeks
My Impact
As a team member, I was able to apply my wide range of design interests and skills. Some of my specific contributions included:
-
Spearheaded the creation of our site map
-
Conducted a feature audit of the FordPass app
-
Conducted interviews to inform the creation of our desirability model
-
Continuous ideation, including extensive sketching
-
Utilized my visual design skills to create mock-ups of our redesigned FordPass app
Skills
primary & secondary research, information architecture, desirability model, content audit, figma prototyping
Team
Shelby Benton, Brandon Dentler, Annie Giang, Megan Ledford, Greg Sirko
What I Learned
This was a very challenging project. Throughout the course of the semester the team had to rescope and narrow our problem statement roughly four times. I learned that rescoping should not be something to be scared of, but rather, something to be expected and appreciated. I also learned that communication between all team members is much easier said than done, and it can make or break a project.
Design Opportunity
The Problem, Scope & Goal
The adoption of the FordPass mobile app is very low. The functionality is lacking, the needs of its target user group are not met, and the product has become stale.
Our goal for this semester-long project was to redesign the FordPass app. The team was to identify one section of the app that would enable it to capture/recreate a positive feeling users experience when using their favorite app.
The Solution
The team utilized a plethora of UX research methods throughout the project in order to identify the pain points, challenges, and needs of our specific users: middle-aged and older Ford owners.
Our solution features a redesigned homepage, more accessible interactions within the app, and streamlined navigation.
Final Design
Homepage
The homepage features a clean and organized layout, large buttons and text, and a simple color scheme.
Vehicle Details
When users click on vehicle details, they are able to see their license plate and VIN number since this was something our users expressed was important during our concept testing.
Engine Start
Testing insights pointed to a greater want for varied interactions within the app. When users start their car, the engine button turns green to indicate that it was successfully started.
Add Vehicle
On this screen, users are able to easily add another car to their “garage.” They toggle through their cars with the right and left arrows.
Other Features
Schedule start time
Set starting climate
View car location
Maintenance notification
Maintenance info
Scoping
Over the course of the project, the team rescoped many different times. Our initial brief focused on communication between dirives during emergencies, but because there are many different existing technologies out there, our sponsor presented us with other directions for the project. These directions were as follows:
Create a new feature that invokes emotion
Our sponsor suggested creating an out-of-the-box abstract idea that would invoke a desired emotion from the user.
Update a current feature within the app
After conducting a feature audit of the existing FordPass app, we realized how many features the app already had. For this reason, we focused on updating a current feature of the app to invoke a desired emotion.
Redesign app for chosen user group
Our research from the initial scopes pointed us to a unique user group of the FordPass app: middle-aged car owners. Our final scope focused on redesigning the homepage for these users.
Rescoping proved to be very challenging for the team and for myself. I reworked my communication skills to better suit my teammates needs, and focused my efforts in areas the team was struggling. If I could do this project again, I would urge myself to pick a scope from the beginning and just work with it. All the narrowing, scoping, and deliberating forced the team to lose valuable time in which we could have spent researching and ideating. It was difficult to get everyone on the same page, and this led to confusion over the course of the entire project.
Research
The team utilized many different types of research throughout the project to inform our redesign. From primary research to secondary research, take a closer look at our methods below.
Desirability Model | to understand user desires
Goals
-
Use this graphic model to display the users’ emotions toward a product or a brand and its capabilities
-
Use this to guide our research and ideation along the design process with a core set of values
Takeaways
The overall model reads: “control and organization allow me to feel relaxed, powerful, and effective, because I can unlock my car, find my parking spot, and know my car’s health.” Based on this, we were able to ensure that our ideation and final design could be properly aligned to our users' desires, values, and expectations. We crafted each of the rungs based on our interviews, inspirational analysis, and additional secondary research. I found this to be a unique method that helped me consider the implications of my decisions throughout the project.
Desire:
control & organization
Emotional Cues:
relaxed, powerful, effective
Product Cues:
unlock car, find car, know car health
Inspirational Analysis | with Design Feature Affinity Diagram
Goals
In order to be able to deliver on our original scope (redesigning FordPass to recreate a positive emotion that users have when using their favorite app) the team explored each of our favorite apps. I analyzed Spotify and SoundHound. These apps both rank high on my list of favorite apps because of their ease of navigation and exciting micro-interactions. I sought to discover and interpret the emotions, features, interactions, feelings, moments, or experiences centered within these digital experiences. After doing so, the team came together to create an affinity diagram in order to uncover the consistencies of our findings.
Takeaways
We highlighted five qualities of experiences that were prominent themes in each of our individual analyses, in which we wanted to incorporate and apply to our designs:
Efficient Organization
Being able to easily switch between screens within an app, knowing how to access the information you need, and minimal-clicks.
Visual Engagement
Using visual icons to convey meaning and reduce the mental load on our users' brains, and using captivating interactions.
Accessible
Following accessibility standards/guidelines, and making sure our user group is able to use whatever we design.
Reliabilty
Using Face ID for passwords & authorization for quick actions. We want our design to work well and to work rapidly.
Familiarity
Using consistent gestures and interactions eases adoption, thus, our design will be familiar and natural.
Feature Audit | of current FordPass app
&
Site Map | FordPass Information Architecture
Goals
In order to be able to redesign FordPass, the team needed a detailed and clear understanding of the existing FordPass app. I spearheaded these two portions of our research, and gave my teammates the rundown.
-
From our feature audit, we sought to identify the features that FordPass currently offered, and to identify areas for improvement
-
From our site map, we aimed to explore ways in which a new idea could be incorporated into the existing infrastructure
Takeaways
-
There are four distinct sections within FordPass: Move, Find, Guides, and Account
-
The "Guides" section was dense and included many repeated topics for directions
-
Organization was unstructured and confusing with no consistency between screens
-
Room for elaboration within "Maps"
-
Home screen may provide opportunities for an addition or restructuring
FordPass Site Map
Interviews | with FordPass users and older car owners
&
On-Site Research Visit | with local Ford dealership
Goals
-
The team conducted several rounds of interviews with four people who use FordPass. Our goal was to learn about their likes and dislikes with the app, and how these likes and dislikes impacted the emotions they felt when interacting with the app
-
We also visited a local Ford dealership in the Lafayette, IN area to talk with the salespeople about how they sell/introduce the app to their customers, and to understand a different user perspective of the app
Takeaways
These different forms of primary research proved to be very helpful during ideation and scoping. Our takeaways and insights were as follows:
-
Many users want to easily visualize certain car characteristics, such as oil level, fuel level, and tire pressure. Burying these features proved to be a point of confusion for many users
-
As key fobs are becoming a thing of the past, the remote start feature was seen as the "most relevant" feature
-
License plate and VIN numbers were looked at often
-
Liked that dealers can input maintenance information right into the app
-
Did not like that FordPass is only available to select cars in Ford's inventory. This limited the app's use
Ideation & Prototyping
As the team conducted research, we sketched based on specific insights from each method. My ideation became more targeted and specific as our insights became more focused. This was a fun and unique project because of the many different realms we were able to ideate within. Pictured below are a few of my sketches throughout the project:
FordPass Homepage v.2
FordPass Homepage v.3
FordPass Homepage v.4
One team consolidated sketch mockup
Sketching based on research insights
Consolidated sketch of the homepage
Mid-fi mockups in Figma
Interactive prototype in Figma
Concept testing
Iterations to specific features
Back to top.
FordPass Homepage v.1
Our ideation process was iterative, extensive, and exciting! Pictured below is the process the team went though before arriving at our final design. Although it seemed to be convoluted at times, it's what made our project challenging and rewarding.