This case study is aimed at creating a new app with the intention of providing functional support for a car owners to utilize their iPhone’s daily. The objective is so this results in car owners opting to use this product in their everyday lives as a replacement to physical keys. This means this new car app needs to be able to provide the upmost clarity and functionality to achieve this objective.
- Age 24–60
- Mid-range to high end car owners
- Casual driver that uses their car for commuting to work and social endeavors.
Smart keys were first introduced by Renault in 1982 with their Fuego. The car had a remote keyless system with central locking. Since then, smart keys have been replaced by apps with car manufacturers including BMW, Mercedes and Tesla. Car users can now unlock and lock their car with their smartphone, making it a lot more convenient in this day and age. However, keyless cars do come with huge security risks as thieves have been able to use technology to steal cars without a key. This is a very common issue with a lot of keyless cars and is why people tend to avoid them. Lexus is one of these manufacturers and my aim is to increase security measures to allow more people to feel safe and purchase Lexus’s keyless cars.
My role: As a UX/UI designer, my role in this case study is going to be re-designing Lexus’s app to ensure car owners feel more secure with the security functions of the app as well as the overall user experience to lead to car owners replacing keys with their smartphone.
Hypothesis: The changes made in my app will lead to more of an influx in people opting for keyless cars and increased revenue for Lexus. It will also lead to increased user satisfaction of current Lexus car users and an overall better user experience.
With Tesla’s app, I like how sophisticated the black gradient background makes the app feel for car users. Colour psyhology was definitely used here. The photo of the car stands out and makes it feel a lot more personalised for users which is something the Lexus app could adopt. To go even further with helping car owners connect to their apps, they should be able to change the name of their car on the app to maybe use a nickname if they wish. The menu section looks like a long list which can make the app’s user experience feel tedious. It also doesn’t adhere to hierachy of information as functions such as controls and charging come in the middle of the list whereas media comes first? Ensuring a good user experience where car owners can easily and quickly navigate through the app is what will encourage them to replace their car keys for a smartphone app.
BMW’s app also has a very dark background with orange accents. One very useful feature they have is the car’s fuel level and mileage are displayed. This is definitely a feature Lexus could adopt. The charge level for electric cars would also be useful information to electric car users. Instead of the car name, BMW’s app focuses on a personalized message targeting the car owner. Also, the icons under the remote tab might probably do better with labels? In terms of accessibility, i feel like some users may accidentally click unlock when they meant lock since it hasn’t been made explicit. The grey font against the dark background is also very difficult to see and car users with accessibility problems should be considered here.
I like that Mercedes’s app has labels for each function instead of just letting an icon suffice. I noticed in the top right corner there was a speech bubble. In-app support is an excellent feature that allows for Mercedes to display premium service along with their premium price. I think car users would feel a lot more secure and supported if there was the option to chat to an advisor in app should they have any issues. Mercedes also has a function where you are able to plan your journeys in advance. They also add extra useful information such as Tyre pressure so car users can keep track as well as how long away your next service is. Collision detection is also a fantastic function especially if it sent notifications to your phone letting you know if a car has hit yours while you have been away. I also like the simplicity of the bottom navigation bar as too many icons can feel like a lot for users to process.
One feature i like from this Ford app is how prominent the remote start and lock/unlock functions are. I also noticed a drop down option which may be for other Ford cars the user owns. I’m not a fan of the ‘vehicle details’ button as users should be able to see important details about their vehicle clear on the homepage like some of the other car apps. This app gives weather updates which is useful for remote climate control and also shows the status of the car, for example, ‘P’ for parked.
Red Route analysis
I asked 7 car owners ( 3 females and 4 males all between the ages of 19 and 43) what their top features would be in a car app. I used the top features i compiled from all the apps i included in my competitor analysis.
From this, i noticed that features such as locating your vehicle isn’t something of a priority however all the other features i presented to my participants were popular.
I asked the following questions to 10 car owners. They comprised of 6 males and 4 females. All participants were between the ages of 19 and 43 years of age. I made sure to use open questions and avoided leading questions in order for all the answers to reflect their truest feelings towards this subject.
- If you could pick, would you choose a traditional car key or a car app on your smartphone?
- What do you like the best about your car key?
- Do you ever lose your car key? If so, how often?
- What things would worry you about depending on a app for your car?
- Do you always remember to fill up/charge your car?
- How often do other people drive your car?
- What are your favourite music apps?
- 6 out of 10 of my participants said they would choose a car app. They happened to be on the younger end of my selection of participants while the ones on the other end preferred traditional car keys. When asked to explain why they’d pick a traditional car key, they said it’s what they’re used to and they don’t trust or feel secure with apps alone.
- Things that worried my participants about using apps included a fear that doors are not actually locked as well as software issues that may arise. I think a live support chat would be useful in solving any issues and making car users feel more secure.
- Most participants said they don’t really forget but they ignore it till its running very low. In this case, i think an app that sends you reminders of your fuel/battery level is useful. For electric cars, you can charge in-app.
- Most of my participants have lost their car key at some point and 7 participants have lost their car key more than once. This makes me believe a digital car key would be easier to manage.
- Only 4 of my participants have other people driving their car at least once a week. A feature for guest access makes sense.
- My participants mainly use Spotify and Apple Music so it would make sense to incorporate that into the app so they can access their music from within the app. Guests can also connect their music to the car this way too.
Ideation technique 1- Mind maps
I did this technique with 1 other person to help and we tried to come up with a plan for each screen on the app.
Ideation technique 2: Worst Possible Idea
The Worst Possible Idea is a lateral thinking method which is very much about standing back, looking at the big picture, and understanding concepts. It also requires that you focus on the parts that have perhaps been overlooked, challenging assumptions, and seeking alternatives.
- Small lock/unlock buttons
- No buttons for opening windows
- No easy access to music
- No live support chat in app
- No option to book or change appointments
- No start/stop button
- No voice recognition
To start with, I decided to create 4 screens and I would have ended up with 5 but I made sure to try my best to avoid unnecessary screens that might overwhelm car users. In order — it goes from the home page, journeys, maintenance and driving analytics. From my user research, these were popular among my participants and that is why I’ve incorporated them into my app.
I made quite a few changes from my low-fidelity wireframe. I changed a lot of the positioning and realized some things from my ideation techniques so added them in. I added the option for users to have a live chat with the Lexus support team. This would encourage more users to the app if they knew they could contact someone and get help right away especially car users that are hesitant about the security and use of a car app in replacement of a physical key. I also added a start/stop button for users wanting to start their car remotely. However, after doing research it seems that this function isn’t actually legal in the UK unless it’s on private land but I’ve added it anyway for concept purposes. For booking a maintenance service, I added an option to change your booking with a calendar of dates in that month as well as the car users last and upcoming services.
The main differences on my final wireframe were the addition of the apple music and spotify logos to signify the integration of Lexus’s car apps and peoples favourite music apps. I created a screen for users upon entering the app to help users feel more secure with the service as their entry is based on voice recognition. It was also important that guests can access the app when they need to through the icon next to the car name. Users can also use the same app for different Lexus models which encourages car users to purchase more.
I used the color black as a background as it creates a luxurious and premium feel which I learnt from my competitor analysis. It’s only right that Lexus car users are accompanied with a luxury app to match the premium price. The third primary colour was taken from Lexus’s logo as I wanted to also stick to their brand identity by using a colour that Lexus users are used to. For my secondary colors, the green used was to make it clear to users when anything was on or when the car had started. Green is a universal colour for anything that is in an active state.
My designs met the WCAG guidelines with no less than AA which means the app is accessible to anyone with accessibility issues. The colours I used also help to avoid confusion of people with Autism or other learning disabilities as they can identify what is in a passive state and what is in an active state through the colours used e.g. green. I’ve also added labels for the bottom navigation bar as I noticed some of the other apps didn’t have any.
Apple Human Interface Guidelines
Branding — I made sure to stick to Lexus’s colors throughout in order to sustain their brand identity.
Colour — Apple talks about avoiding using the same colour for your interactive and non-interactive elements which i think i stuck to by using a colour from my secondary palette. It’s also mentioned to use a limited colour palette that coordinates with the app logo which I have done.
Adaptivity and layout — The case study brief mentioned to design the app on an iphone SE which is a very small screen so this design would be easily translated onto a bigger screen for the iPhones and iPads with larger screens.
Launch screen — Apple states the importance of using a launch screen for all apps as it gives the feel of a very fast and responsive app. For my launch screen, I kept it simple and used the app’s logo.
Law of common region: Elements tend to be perceived into groups if they are sharing an area with a clearly defined boundary.
I added vehicle health info such as the mileage and the gas level around the image of the car in order for users to be able to easily associate the information with their car. I also added whether the car is locked or not underneath the photo then a lock and unlock buttons in the same section which makes it much easier for users to navigate through the app.
Miller’s law: The average person can only keep 7 (plus or minus 2) items in their working memory.
Hicks law: The time it takes to make a decision increases with the number and complexity of choices.
I made sure the navigation bar didn’t have too many options in order to retain the simplicity of the app without it being too simple. I made sure to only add what was necessary in order for users not to be overloaded with information.
Laws of proximity: Objects that are near, or proximate to each other, tend to be grouped together.
On the home screen, I made sure to group the start/stop button as well as the lock/unlock button as you can’t start the car without unlocking it first. The car’s status is also above showing the car as locked with the lock/unlock buttons just below. This makes it more convenient for the user as elements are near to each other or grouped.
I found this case study a lot more difficult than the last but a lot more enjoyable. I think I enjoyed the UI stage a lot more than the UX research stage so from this case study I’ve realised that I’m leaning more towards UI design.
What I think went well:
- Competitor analysis
- User research
What I think could have gone better:
- Ideation techniques. I found it hard but that was definitely because I didn’t have enough people to actually carry them out with.
Overall, it was a very interesting task and I will be practicing a lot more to improve my UI skills.