Navdy mobile apps

Company
Navdy
Role
UX/UI Designer
Year
2016-17

What is Navdy?

Navdy is a head-up display for your car. It projects your maps, calls, text messages, car data, and more onto a transparent display.

The Navdy mobile apps

The iOS and Android apps serve three main purposes: as a marketing tool in the App Store, as a guide for installing Navdy in your car, and for managing trips and settings on your Navdy Display.

Updating the design

For several months I worked on designing a new mobile experience in order to make the apps easier to use. The new design provides a more reachable, consistent, and enjoyable experience.

Reachability

Because you might use the Navdy app while driving, reachability was a primary UX consideration while designing these screens. We wanted to be sure that we designed each screen with elements can be used with the tap of a thumb.

The green area represents the ideal place for interactive UI.

An interactive map

The map is a core part of the experience. Integrating a single map throughout the app as a constant feature reinforces navigation as a primary value proposition of Navdy. The map acts as a foundational layer for the app allowing for a consistent visual and interactive experience.

App sections

The app has four sections, represented by tabs in the app:

The start tab is where you manage your trips. You can search for new destinations, start trips to recent destinations, and interact with active trips.

In favorites you can view, add, and edit destinations. These can be accessed on the Display to allow you to quickly start a trip without using the mobile app.

This tab is a place to setup how you want to display information from your car and phone. It turns on and off the ability to view and hear calls, text messages, car information, and app notifications.

This is where you manage all of the settings for your Navdy Display and app.

Gestures and transitions

Tying everything together are the gestures and interactions. While designing the app I created prototypes that let our team to interact with transitions between defining sections of the app. This allowed the engineering team to see exactly how the designs could be implemented and gave us a tool for user testing.

This is an example of the diagram I created to communicate transitions and gestures to our engineering team.
 

Conclusion

Prototyping was an important part of this project. It allowed us to test and prove the effectiveness of interactions and flows. We have learned that looking at a static screen is usually not enough to prove the effectiveness of a design.

With an active community of Navdy drivers, we are happy to see how our updates to the app are received and are always working to make improvements to the Navdy experience.