top of page

FordPass Find

EXPL_FordPass_HandHoldingPhone.jpeg

When FordPass was conceived and released, the focus was on allowing owners to interact with their vehicles and locate vehicle related services such as fuel and maintenance. 

When it came time to redesign the app and create version 2, the goals were to increase the number of users, increase user engagement with FordGuides, and give the users an experience that would encompass all mobility options in all markets worldwide. This meant enhancing the app to include locating additional modes of transportation as well as future needs such as electric vehicle charging stations. 

The redesign also needed to be a more consistent experience throughout the app with design that allowed for future additions without restructuring.

The Problem

HIGH LEVEL TIMELINE

 

Approximately one year to complete high fidelity designs with complete user flows and annotations.

THE TEAM

 

The team consisted of a creative lead, as well as several art directors, solutions delivery managers, product managers, and UX/UI designers.

.

KEY GOAL

 

To redesign an entire app with considerations for future features as well as simplifying the interface while adding additional features.

I worked as part of the team responsible for the Find pillar of the app. As part of this team, I collaborated with Product Owners and Feature Owners from around the globe to determine all additional features that would be added.

 

Additionally, I created user flows for all elements of the Find feature, which were translated into low fidelity screens and presented along with annotations to the product managers for preliminary approval.

 

I then worked with two art directors to create high fidelity screens for both iOS and Android and presented the completed screens along with annotations for product manager and feature owner approval. These were then presented by our creative lead for L3 and L2 approval within Ford.

My Role

Understanding The User

It was important for us to understand the wide variety of users that would be using our app as Ford owners span all adult ages and locations. Because of this, users had different goals and needs when using the app. 

We started by developing several user personas to cover a wide variety of users. We tried to define a background for each as well as determining their basic transportation needs.

Defining the users and what they would be using the app to find allowed for us to divide find items into categories and then prioritize the categories. 

Because this was version 2, and the app had many users, we were also able to access a huge amount of data in the form of reviews and comments in the App Store. While most users don't typically write a detailed comment when they are happy, those users that are unhappy with something are likely to write about it. The insight into the things that were not working was invaluable. 

We learned that users did not want separate experiences for each type of location they were searching for. They wanted one experience which would allow for them to switch categories within the experience while maintaining their existing searches within each category. 

The previous version of the app was a flat design consisting of one long menu.

 

Below is the home screen from the original app.

fordpass1.jpeg

Breaking down the process

After the team completed our research, we brainstormed how to structure the app to make it easier to navigate even with additional features being added. We reached a consensus that the app should be divided into four major pillars; Move, Find, Guides, and Account.

Once this was decided, we divided up into smaller teams with each assigned a pillar. I worked on the Find pillar.

I started the process by listing all things that the user would need to be able to search for now and in the known future. Once I had defined each item the user would search for from the Find landing page, I could then define what the flow would be for a search. This user flow is shown below.

ezgif.com-gif-maker (1).jpg

Once the basic user flow was defined, I started to create the design of the Find Landing screen. All searches would originate from this location. The user should have the option to just start typing, select a category, and then search. Additionally, the user should have access to previous searches and favorites. The user is shown a search input box with a map below and a panel of categories that can be swiped up into a drawer.

SKPortfolioPres.021.jpeg

The next step was to define the workflow of what would happen for each destination category. When tapped, these category CTA's would each execute a search for destinations that fit the category. The search results would be shown on the map represented with pins.

 

The challenges here were defining how the search results should be shown relative to the number of results. Searches need a standard boundary area but it should adjust based on the number of search results so as not to overwhelm the user with too many results or present them with no results. Rules were defined which expanded the boundary if needed. In addition, some categories were automatically filtered and it needed to be obvious to the user that filters were applied. The product owner also wanted to show fuel prices within the map view.

Below is an example of a Fuel station search which shows how these issues were addressed.

Fuel stations shown on the map with pins containing prices. Default filter is shown below the location input and is highlighted to indicate it is active

List view can be toggled and shows more information as well as the ability to change the sort order

When a fuel station pin is selected, the user is shown a tile with more information. The user can tap another pin or swipe to the next tile

Screen Shot 2021-07-01 at 1.03.40 PM.png
Screen Shot 2021-07-01 at 1.04.08 PM.png
Screen Shot 2021-07-01 at 1.04.24 PM.png

Each category search was defined with specific filters that could be applied as well as filters applied by default. 

Sort orders were also defined along with the default sort order to be used for each category.

The information to be shown in the detail pane or in the list view for each destination category was defined by the product owners. I then laid out basic templates for each category type with a focus on a consistent experience for the user. 

Screen Shot 2021-07-01 at 1.23.55 PM.png

Deliverables

Annotations for specific screen:

SKPortfolioPres.024.jpeg

Prototype video of pinning parking spot:

Learnings

Global collaboration

Designing for global regions requires an increased focus on communication. Boundaries defining what can be changed must be set up front to avoid inconsistency across global regions.

Map results

Showing search results for different geographic areas presents an increased level of detail. These interactions require more detailed definitions for development teams as well as involvement throughout the design process.

bottom of page