Overview, Context and Objective
This personal UX/UI Design case study showcases how an integration of the mobile app Instagram into a car navigation system would look like. At the beginning of the project I asked myself, what features of Instagram need to be changed, how can the information be displayed, how would the UI and the user interaction look like, how do the controls work and are there any new use cases that were not possible on a smartphone.
Approach and Process
While approaching the tasks I relied on the iterative Design Thinking process. Below I listed all the steps that I’ve taken while solving the objectives. The following pages will give you an insight into the various steps.
Market Analysis
A short market analysis showed that all car navigation systems come with a variety of features. Setting up a comfortable seat position, displaying weather reports, radio and device playback, maps and navigation. All features can be accessed via touchscreen, touch-sensitive thumb pads on the steering wheel, a touchpad on the center console and a voice command system. It is also possible to use the apps Apple CarPlay or Android Auto to allow the user to connect their smartphone to the car interface and use apps like Spotify, Google Maps, Audible or WhatsApp. A quick research reveals that until now there is no integration of Instagram into a car infotainment system available. Also, I could not find any indications that it is possible to use Instagram in your car without jailbreaking the device.
User Interviews
I conducted six user interviews to learn more about the goals, need and pain points of a potential user.
User Persona
Taking everything that I learned from the interviews, I used the insights to create a user persona that would serve as my fictional user.
Problem & Hypothesis Statement
Problem Statement
Anna needs an integration of parts of Instagrams features to discover new points of interests like restaurants, cafés or landscapes. She also likes to send stories directly from the interior of the car or watch other peoples stories while waiting in the traffic jam or at a red light.
Hypothesis Statement
I believe that by creating a distraction-free integration of part of Instagrams features into the car infotainment system, it will enrich the driving experience for social media avid users.
Ideate
Now that I had an idea what the user wants, I started writing user stories to define the features of the integrated version of Instagram.
INSTACAR 01: As a driver (and co-driver) I want to use the Instagram feature „Nearby Places“, including the pictures, so that I can get an impression of that location and to hand over the place to my navigation system.
INSTACAR 02: As a driver (and co-driver) I want to watch other peoples‘ Instagram stories on my car infotainment system, while the car is standing, so that I can pass the time.
INSTACAR 03: As a driver (and co-driver) I want to automatically create and upload an Instagram story with the click of just one button, so that I can share my driving experience and my location with my followers.
User flows
Wireframes
With the basic user flows sketched out, I started working on the wireframes and compiled them into a mock-up.
Control Concept
Using an app while driving or being in a car is a challenge, due to the risk of being distracted. So I had to think about how to navigate through each screen and feature while avoiding too much distraction for the user.
User Tests
To verify my assumptions and my design I conducted usability tests. Based on these results I made changes to the wireframes to increase the usability.
Final thoughts
As outlined in this case study, only a reduced and barebone version of Instagram makes sense in a car. Editing and uploading images, liking and commenting, searching for hashtags or people or just endlessly scrolling through the feed aren‘t features that can or should be used while driving. Research also shows that users don‘t want this feature – mainly due to safety concerns. As already mentioned in the user stories and shown in the wireframes, basic functions like watching stories or a preview of nearby locations can stay the way they are, but only if the car is standing.
Working on this task has been very interesting, while providing a good challenge. Implementing a visual app like Instagram into a car infotainment system is not only a technical task and leads to a lot of design changes – it also provokes a lot of questions about how distracting the integration could be.
As stated in the user interviews, participants would rather use an audio source for entertainment, mainly to avoid any unnecessary distractions. None of the participants were particulary enthusiastic about the idea of integrating the app and the benefits are very small. I believe that the three use cases that I‘ve implemented in this case study do provide a nice benefit and can be a nice addition to the standard navigation system.
Also, I strongly believe that safety and focus while driving are more important than social media and that the well-being of the driver, all co-drivers and pedestrians have to be protected from all unnecessary distractions. So I decided in this prototype, that you can only use the app if the car is standing. In the end I can firmly say that I‘m happy with the result of this short case study and
that the overall design and the use cases strike a good balance between utility, usability and safety.
Tools
