Since joining the driving world, I have been looking at the car apps available for my phone, and have been somewhat disappointed with the ones I have tried. The UI didn't stand out on any, and more importantly the ease of use, which is essential whilst driving.
Therefore, I've decided to look at how I would go about designing a car app.
The first thing to consider is the user. I find it helpful to imagine who will be using the app and what they want to get out of it. Making a good range of case studies will help open my mind to what functions and features I need to include.
As a (user), I want (goal) so that (reason)
What is this feature?
An application to use my phone whilst driving.
What is it for?
I mainly use it for listening to music, and the occasional navigation function when I go on long trips.
Context / User story
I'm driving to the lake district at weekend, and want to use my phone to make sure I get to the right destination. I always listen to my music whilst I'm driving, so I want to be able to access the sat nav and my chosen music player easily and quickly so I am not distracted.
As it is a long drive, I expect to get notifications during the trip, so it would be useful to preview these to make sure there are no emergencies, but be able to dismiss them if not.
Once I have a clear understanding of what the application needs to do, I can start listing the data that I will need to consider. From here I can decide how the application will flow, the key screens needed, and potential gestures that may need to be used. This will evolve into rough mock ups of the key UI elements that will be needed.
For this example, I will only focus on the overview and music function described in the user case study. The full app design would be much more comprehensive.
I tend to start sketching ideas, with the seemingly old fashioned tools of pen and paper, exploring which screens/buttons will be needed and how the basic navigation will work.
Using these sketches I will finalise a flow of the app, and subsequently create a diagram to follow.
I then take the best ideas from my sketches and create rough wire frame mock ups, usually tweaking here and there to get a framework that works best.
The main things I needed to consider for UI is that the user will be driving so I needed to lay everything out very clearly for ease of use. Also, the icons cannot be cluttered together or too small as they need to be easily clickable.
The next step is to create some basic design guidelines looking at font choices, colour palettes, and an overview of how I want the UI to look, and work, taking into consideration the intended device, user gestures and the nature of the app.
The final product on my side before being passed to the developers. Fully designed mock ups showing how the app will work and what it will look like.