The Capstone Project (process)
icos
Intelligent Car Operating System
For the capstone project, I chose a car interface, which was one of my interests industries. I have done the research, brainstorm, and sketch out the brand itself, and also UX/UI Design for the car interface. Moving forward, I’m going to update my final outcomes and simulation of the work.
One of the biggest changes in the automotive industry in a near future is that car interface is increasingly important for competitive product development. The users are going to purchase not only a physical product itself but also services, so product experiences extend and appear in both physical and digital forms. For the capstone project, I’m going to explore and develop a car interface UX/UI for increasing the usability and safety of drivers and passengers.
Date: Fall 2020
Project Type: Automotive UX/UI
Note: This project is initiative
01 Research: Survey
The survey asks 15 questions to 48 participants aged 18-45 about their interface usability and multitasking functions. 64% of the participants answer a car interface is one of the key elements that make their decision to purchase. Bluetooth is the most used feature, and navigation and backup camera are the following. 44% of the participants responded that they have multitasking functions on their car interface, and 38% of them respond they always use the functionality. For the future generation of cars and interfaces, most participants want to have self-driving, such as autopilot, parking, and speed control.
02 Research: Interview
Interviewed Bianca Lacopelli, a Creative Designer at General Motors about the potential to develop a digital car interface in a near future.
03 Research: Observation
Observed the three drivers’ driving habits and interface use. Define the issues that current car interfaces have and find solutions for improvements.
04 Research: Mood Board & Visual Research
Researched some example of digital car interfaces’ and mobile applications’ User Interfaces for references categorized by concept, hierarchy, icons, and dark mode.
05 Branding: Mind map
Named a car operating system as icos (intelligent car operating system) and explored to find visual ideas for branding by its function, characteristics, and purpose.
06 Branding: Mood board
Inspired by mindmap that found brand identities such as smart, intelligent, and controlling system. Researched and found visual references in the relative industry.
07 Branding: Sketch Logo
Explored logo drafts with world marks and abstract logotypes referenced by visual research.
08 Scenario
Wrote two scenarios separated by driving on weekdays and weekends to demonstrate the use of the system in different purposes and situations to highlight usability in everyday life.
09 Flowchart
As self-driving technology has been developed, the functionality of a dashboard has been minimized so that drivers are no longer required to check the instrument cluster during driving so then it is combined with a car interface on a single screen.
10 Prototype: Parking mode
The single-screen brings a 2-up vertical that allows multitasking and responsive design.
11 Prototype: Driving mode
The responsive design supports that a browser can be resizable for performance that differentiates between driving and parking mode that gives a priority of information in a short moment, which increases the safety of driving by elevating navigation efficiency.
12 Prototype: Icons
The visual language and icons enhance communication with users to provide better understating and visualizing the function of in-car systems. Successful icons convey the message effectively, quickly, and accurately for fluent communication in human-computer interaction (HCI) while driving.
Icons are symbolic and recognizable that should have simplicity, concreteness, clarity, and good contrast for providing the most direct visual experience. For that, it requires accessibility colors and scales graphic images that can be readable with a brief in-car glance. Thus, this paper provides fill-up color icons rather than strokes with accessibility colors.
13 Prototype: Infographic
Infographics is another strong visual language and visual representation of data, which can be used for battery or gasoline use, low and high temperature, and Overspeed warning signatures. The information and data in the car interface will be updated rapidly, and infographics will respond to the changes depending on driving status. The differentiation of color and shape use is an effective visual language that requires less time compared to read the written information on a screen.
The research the three main colors to indicate the conditions of a car. The author pick green, yellow, and red, which are the traffic signal colors so that drivers’ eye cohesive.
14 Prototype: Typography
Typography and hierarchy support navigation and understand the page easily that catches up with the most useful information in a short moment. Successful typography reduces the risk of accidents that shorten the time that users’ eyes are driven into the screen and increase the time to concentrate on the roadway. Differentiate to typography on print, typeface design in the automotive interface should be considered on a screen that has a risk of clashing or blurring. Thus, here are some considerations to find a successful type of design for the project.
15 Animated Prototype
Simulated the program under the situation of Overspeed and navigation use.
16 Conclusion
The purpose of Automotive UX/UI design is to find methods to reduce the time that users’ eyes are driven and navigate the screen so that drivers can focus on the road conditions and traffic by increasing usability and legibility. Therefore, this research works for improving hierarchy and visual languages to find an effective design for driving.
17 Next Step: icos (outcome)
The project continues and will be updated by June 11.
1. Develop and finalize prototype for UX/UI
2. Finalize logo and brand systems
3. Develop and finalize prototype animation
4. Create a program promotion video
