paper sketching

I wanted to make sure that each of my screens made sense. I find it quickest and fastest to sketch by hand first.

high-fidelity mockups

The design philosophy for this user interface was to create an application that was functional for both new and returning users. New users are interested in the most basic functionalities of the interface and are not likely to dive deeper into the UI. Returning users are likely to have already learned from their first voyage and may be more willing to find nested features. As a result, it was vital to ensure that most of the basic functionality is easily accessible and prominent. From my user research, I learned that trip progress and music are the two most important features of the application. As a result, those two parts are almost always visible and accessible across the different parts of the interface. Additionally, as this is an autonomous boat, users will be unfamiliar and likely distrustful of the concept. To compensate, I included an emergency button with three important options in an easily accessible way across most screens as well.

In addition, I simplified the user interface as much as possible. Every user-interactive button is color coded to the primary color of orange to stand out from the background and to accent the design. I wanted the map, which is a familiar design pattern across the Lyft app and its competitors to be the main screen and for the primary navigation to impose itself on top of that such that the map is always visible. In the quest to make the interface as simple as possible from the beginning, to minimize the need to learn the interface, I borrowed common patterns from successful designs from well-known companies. For example, I partnered with Spotify to integrate their music streaming platform into adryft. As such, I reconfigured, but rely heavily on, positive transfer of skills from the Spotify UI as it appears on desktop platforms for our interface. I make the most important parts of Spotify easily accessible in the interface (queue and popular music discovery). Additionally, I partnered with Google to create our maps. I borrow elements from Google Maps, such as their explore buttons, to help users understand their surroundings and add useful stops.

For our three additional screens beyond the map screen, I included only the most vital and fun functionality. I included boat information to gain user trust through increasing transparency. I show the user what the boat sees, such as the obstacle detection and lidar views. I also included common streaming platforms such as YouTube and Netflix in case users are bored on the trip. Lastly, I have comfort screens to adjust high-level parameters to make the ride more comfortable. While I could have chosen to include more detailed and granular controls, I understand that users are using these boats as transportation, and that level of control would overwhelm first time users.