PROJECT TITAN DASHBOARD
Professor Jason Occhipinti IXDS6123 Data Visualization Master of Arts Degree in Interactive Design Lindsey Wilson College, Columbia, Kentucky
By Atif Nagi Presented in M.A. Interactive Design project. Dec 10, 2015
TABLE OF CONTENTS EXECUTIVE SUMMARY PROJECT OVERVIEW
3 4
RESEARCH 5 DEMOGRAPHIC & BEHAVIOURS 6 PERSONAS 7 RESEARCH BOARD 9 MOOD BOARD 10 COMPETITIVE ANALYSIS 11 USER INTERVIEWS 13 USABILITY TESTING 14
EXPLORATION 16 INVENTORY AND TAXONOMY
17
IDEATION 19 SCHEDULE 21 MIND MAP 22 USER JOURNEY 23 SKETCHES 24
SOLUTION DESIGN
28
DESIGN PRINCIPLES 29 WIREFRAMES 30 HI-FI WIREFRAMES 39
CONCLUSION 53 USER CENTERED DESIGN PROCESS 54 REFERENCES 56 22
EXECUTIVE SUMMARY Semi-autonomous and autonomous cars are a rapidly evolving technology, which only a few years ago was still considered science fiction. We have reason to believe through initial research* that it’s coming - the Apple car. Known as Project Titan in the industry and throughout the media, the Apple electric car is the most awaited automobile-related launch in decades. It is expected that Apple will place great emphasis on user-experience and emphasize new world thinking.
*References (page 56) 33
PROJECT OVERVIEW My goal was to research user experience in the automobile industry through competitive analysis, users’ interviews, persona development, target audience, solution design, prototype, and usability test interviews. During research, I uncovered that almost all major players of the industry are already working on electric semi-autonomous cars and heading toward fully autonomous vehicles. The real challenge would be to apply Apple’s legendary user experience and take driving experience to the next level. There is a need to design on-demand UI that only shows when the user needs to see it. This is not an airplane cockpit so we need to make a simpler and easier driving experience. Later in this document, you will discover that my primary and secondary personas, Jason and Elena are design savvy, early adopters and looking forward to the breakthrough experience in automobile industry. Semi-autonomous and smart safety technology already exists in the current automobiles. My challenge would be to utilize the technology to design a user experience through UI, voice control, and haptic feedback to make an easy and intuitive experience for Jason and Elena. Based on my findings, I am proposing to extend Apple’s OS experience to the dashboard to increase the usability and user experience of the vehicle.
4
RESEARCH
5
RESEARCH
DEMOGRAPHIC & BEHAVIOURS Primary target audience: Business executives and entrepreneurs
Secondary target audience: Working professionals
Gender: Male and female
Gender: Male and female
Age: 35 – 55
Age: 25 – 38
Income: 150k+
Income: 65 – 100k
Background: Successful baby boomers/
Background: Gen X/Gen Y young
Gen X business executives and
professionals who are looking for an entry-
entrepreneurs who are also city dwellers that
level luxury electric autonomous car. These
are tech savvy and green friendly. These are
people are tech savvy and looking for eco-
wealthy and early adopters, whose income
friendly luxury vehicles. The echo-friendly
levels put them in the upper-middle class
electric car’s interior really attracts tech
segment. They are suitable for the high-end
savvy people. These young entry-level
Titan product line.
users will lead to future sales of high-end Titan product line.
6
RESEARCH
Primary persona: Jason Bradford Age: 40 Occupation: Entrepreneur Income: 150K Status: Married Location: Palo Alto, CA Goals • Stress-free commute • Save time and make commute time productive • Take right choices to make world greener
“I WISH THERE WAS A GREEN ELECTRIC VEHICLE WITH INTUITIVE Technology IT and Internet Software
USER EXPERIENCE SO THAT I DON’T HAVE TO STRESS ON THE ROAD. INSTEAD, I ENJOY MY COMMUTE EXPERIENCE.”
Jason Bradford
Mobile Apps Social Networks
Frustrations • Few electric car choices in the market • Lack of in-car intuitive user experience Bio Jason is a successful entrepreneur. He is the co-founder of successful mobil analytical app company based in Palo Alto, CA. His passion is technology and Internet of things (IoT). He is a heavy user of email, chat/IM, social media, health bands, smart products, and smartphones. He is an early technology adopter and he is not afraid to try new ideas. Jason lives in a suburb with his wife and a daughter. His daily commute is 45 miles from home to his downtown office. His drive can be a nightmare in rush hour traffic.
7
RESEARCH
Secondary persona: Elena Rose Age: 32 Occupation: Marketing Income: 80K Status: Single Location: New York, NY Goals • Safe driving experience • Stay connected while driving
“I WISH TECHNOLOGY COULD HELP ME KEEP CYCLISTS AND Technology IT and Internet Software
PEDESTRIANS SAFE ON THE ROAD. I WISH THERE WERE AFFORDABLE SELF-DRIVING VEHICLES AVAILABLE IN THE MARKET. ”
Elena Rose
Mobile Apps Social Networks
Frustrations • Expensive electric car choices • Lack of in-car intuitive safety features
Bio Elena is a successful marketer. She works in a leading advertising agency in Manhattan. She works and lives in downtown. She never hesitates to learn something new. She is a design savvy and eco-friendly person. She appreciates clean design in decor, architecture, technology, products, and appliances. She interacts with technology, i.e., solar devices, (hardware) MacPro, iPad, iPod, iPod mini, iPhone, smart tv, (apps) Songza; Allrecipes, Lose it, Maps, Netflix, Weathernetwork; Whatsapp on a daily basis. Elena enjoys the downtown lifestyle but she doesn’t like to drive in downtown. One has to be mindful of pedestrians and cyclists on congested roads. She wants a stress free driving experience. Her secondary goal is to get extra help from technology, which enables her to drive safely and stay connected online while driving to enjoy quality time with her family and friends. 8
RESEARCH
RESEARCH BOARD I researched current and future automobile concepts. I also explored data visualization through multiple digital devices of the physical world. Pinterest board links: •
www.pinterest.com/atifnagi/auto-dashboard
•
www.pinterest.com/atifnagi/automobile-dashboard-2/
9
RESEARCH
MOOD BOARD The mood board consists of Apple’s OS UI elements, typography, concept sketches, nature, science fiction and history. I want to continue Apple’s legacy but I am also inspired by science fiction concepts of the movies such as Minority Report and Tron, and nature, i.e., the transparency of jellyfish and depth of a deep sea. Pinterest pin link: •
www. pinterest.com/pin/427982770818046504/
10
RESEARCH
COMPETITIVE ANALYSIS I used qualitative research interviews and
Tier 1 competitors
Tier 2 competitors
online search to uncover strengths and weaknesses as well opportunities and threats to Project Titan. After an online search, I uncovered that Tesla, Google car, BMW, Mercedes, Audi, Cadillac are the major players in luxury semiautonomous and autonomous automobiles. Industry leaders are forecasting that most of the major brand models capable of autonomous highway driving will be available to the market by 2020. Source: www.driverless-future.com/?page_id=384
11
RESEARCH
Competitor comparison
Brands
Autonomous
Semi-autonomous
Electric
Safety
Titan
X
X
X
X
X
X
X
X
X
X
X
Mercedes
X
X
X
BMW
X
X
X
X
Tesla
UX X
X
SWOT Based on research and competitive analysis I uncovered strengths, weaknesses, opportunities and threats: Strengths: Apple’s strong user experience design background. Weaknesses: Newbie, Apple is entering first time to the automobile industry. Opportunities: There is a gap of intuitive user experience in automobile industry. Threats: Big players in the automobile will catch-up to Apple’s vision very quickly. 12
RESEARCH
USER INTERVIEWS NEIL
I would like to see information that helps me on my current journey: notifications of accidents/ road closures up ahead and then suggestions for alternate routes. If I am low on gas directions to the nearest gas, station would be helpful if I am in an area I am not familiar with. If I am heading into an area that is experiencing bad weather alerts could be helpful.
SONIA
DEAN
Quick, at-a-glance interface showing my speed, fuel level and any important notifications that could affect the performance of my vehicle.
I would like all my diagnostic information available to me ondemand, so they would all need to be factored into the design e.g. gas gauge, engine temperature, tire pressure, RPMs, odometer etc. I would also like to be able to control when they would appear on the screen, i.e., gas gauge would appear at the half mark.
CHRIS
The ones I focus on the most are speed and fuel. I rarely find myself paying attention to the temperature gauge or battery voltage. While these do have their place, it would be nice if I only saw them if something was going wrong.
13 13
RESEARCH
USABILITY TESTING NEIL
95%
SONIA
100%
I am a design savvy person and I loved the simplicity, consistency, colors, affordance of the interface.
80%
DEAN
100%
I like the simplicity and learnability of the interface. The interface is self-explanatory and intuitive like my personal iPhone.
90%
FARAH
100%
I am so comfortable with overall Apple OS familiarity, icons, color, on-demand driving and engine process feedback.
Low fidelity prototype results
100%
100%
I can’t wait to see Apple’s Titan in action. I wish I could drive one soon.
Hi fidelity prototype results
14 14
RESEARCH
USABILITY TESTING
The evaluator selection criteria were based
I recommend the following improvements for
on primary, secondary persona and
Hi-Fi wireframes:
availability of evaluator resources. I selected
• Improve overall icons of the interface.
Usability research goals
7 evaluators based on their previous
• Reduce elements from information cluster.
Goal 1
experience with Apple products and driving
• Make “Siri” icon prominent on center plate.
skills. Each user was given a list of tasks to
• Improve data visualization, make them
complete. They were scored based on their
intuitive and easy to understand on
ability to complete the task. Participants were
information cluster.
family, friends, and coworkers of
• Full function phone screen will only appear
Goal 2
this researcher, therefore, no recruitment
in parking mode on center plate.
To determine if the user interface is intuitive,
techniques were employed.
• Reorganize apps hierarchy list in the central
To determine if there are any major usability issues. Research should identify usability pain points.
providing the appropriate affordances for
display unit. Outcomes
• Add seat heating and on/off button in
I arranged user testing in two phases --
climate control.
Lo-Fi paper and Hi-Fi interactive prototype
• Add vertical seat controls.
evaluation.
• Enlarge mirror control buttons.
cluster, center plate, and the central display
Lo-Fi evaluation
Hi-Fi evaluation
unit.
User testing through Lo-Fi paper prototype
After applying Lo-Fi evaluation
revealed major pain points in usability
recommendations, I achieved 100%
and enhanced interface features of the
effectiveness, efficiency, and satisfaction
information cluster, center plate, and central
through user flow interactions, intuitive UI,
display unit. Based on evaluator’s feedback,
labels, and icons of the website. There were
ease of use. Goal 3 To determine if the users are satisfied with the information delivered through information
Research methods and usability procedures The research method used was micro usability testing by observational research.
no usability issues found in Hi-Fi evaluation. 15
EXPLORATION
16
EXPLORATION
INVENTORY AND TAXONOMY
Google Docs: https://docs.google.com/spreadsheets/d/18mzKByZbumHhz-QF2-VH_cRTld8liQoeG0Eqn-9qIYU/edit#gid=0
17
EXPLORATION
INVENTORY AND TAXONOMY
18
EXPLORATION
IDEATION
performance. (Predictability, Synthesizability,
Initial thoughts
- Flexibility
Familiarity, Generalizability, Consistency)
The multiplicity of ways the user and • IxD = A + B
system exchange information. (Dialogue
Group “A” represents the human presence
initiative, Multithreading, Task migratability,
and properties. This is fundamentally the
Substitutivity, Customizability)
“user- experience” - these include: 1) Cognitive (COG)
- Robustness
2) Sensual (SEN)
(Observability, Recoverability,
3) Physical (PHY) 4) Emotional (EMO)
Responsiveness, Task conformance)
Group “B” represents the devices, systems,
• Norman’s 7 principle
services, products and so on - these include:
1. Real-world knowledge, 2. Simplify tasks,
1) Environmental (ENV)
3. Make visible, 4. Mapping, 5. Power of
2) Systems (SYS)
constraints, 6. Design for error, 7. Standardize
3) Communicative (COM) 4) Industrial (IND) • Nielsen’s ten heuristics • Usability principles
• Universal design principle
- Learnability
• Four golden rules
The ease with which new users can begin
1. Where you are 2. What you can do 3.
effective interaction and achieve maximal
Where you are going 4. What will happen 5. 19
EXPLORATION
Where you’ve been
- What user wants to achieve - Actions user performs
• Demographics
- Decomposition of a goal into sub goals/
Primary persona: Male, 30-45, hi-tech, CA
operators
Secondary persona: Female, 35-50, family, NY
- Means of choosing between competing methods.
• Physical devices Controls, Display, Output, Feedback
• Features - Innovation
• Competitive Analysis
- Intelligent drive
Tier 1 - Google
- Performance
Tier 2 - Tesla, BMW, Audi
- Convenience - Design
• Task Analysis
- Safety
Task decomposition
(Active lane assist, blind spot assist, pre-
HTA (Hierarchy task analysis)
break, satellite vision, seat-belts, airbags, attention, environment.)
• Taxonomy GOMS (Goals, Operators, Methods and Selection)
20
EXPLORATION
SCHEDULE
Phase 1 Phase 2 Phase 3 Phase 4 Phase 5
Phase 6
26-31 Oct
3-9 Dec
2-8 Nov
9-15 Nov
Research
Ideation
Wireframes 1
Personas
Inventory
Usability Testing 1
Mood Board
Taxonomy
Research Board
IA
Competitive Analysis
Sketches
16-25 Nov
Prototype 1 Visual design
26 Nov -2 Dec
Wireframes 2
Design document
Prototype 2
Presentation
Usability Testing 2
User Interviews
21
EXPLORATION
MIND MAP
22
EXPLORATION
USER JOURNEY
23
EXPLORATION
SKETCHES
24
EXPLORATION
SKETCHES Applied 20-80 rule to cut down the unnecessary options and focused on persona needs. Users can find critical information controls on center plate and information feedback on information cluster. Non-critical and luxury information controls are available in the central display unit. Voice-activated Siri is always available as a primary source of navigation. Users can find important information through intuitive explicit, pattern, hidden and metaphorical affordance interface which gives learnability, predictability, flexibility, and robustness to the users.
25
EXPLORATION
SKETCHES
26
EXPLORATION
SKETCHES
27
SOLUTION DESIGN
28
SOLUTION DESIGN
DESIGN PRINCIPLES CLEAR
AFFORDANCE
CONSISTENT
The information of the system is straightforward & understandable with clear interface buttons, navigation, simple language (labels), and icons.
I used explicit affordance signaled action buttons by language, negative affordance, contextual menu, mtaphor affordance by using real-world menu icons as a metaphor.
The consistent use of Apple OS affordance, navigation, labels, language, colors, icons and user interface patterns.
FOCUS
ACCESSIBILITY
WAYFINDING
The UI is singular and focused. It is intuitive because it focuses on basic tasks of persona e.g. speedometer, RPM, battery and on-demand alert feedback.
Applied W3C standards e.g. high contrast, B/W design, font size readability and visual hierarchy.
Users can find their way by landmark icons, well-structured paths, and fewer choices. They know where they are, what they can do, where they are going and where they’ve been through navigation.
29
SOLUTION DESIGN
WIREFRAMES
30
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE Start engine
I converted sketches into digital wireframe by using Axure. I simplified central plate to 3 basic options: 1. Comfort 2. Eco 3. Sports So that user can only have necessary choices for an easy cognitive load. If the user doesn’t choose an option in a few seconds then system will select most frequent/ recent/default mode. Voice activation is the primary source of command, however, a user has a choice to use touch UI or Siri for voice commands for all features and functionality.
31
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE Comfort mode
Simplified central plate to 3 basic options: 1. Cruise 2. Autopilot 3. Phone So that user can focus on driving and road, not on the central plate. Separated volume and option buttons from central plate unit to steering for easy access. It also makes central plate much simpler and safe. The focus is on the speedometer (users interview feedback) with smart road scan, battery life, and mileage to end information.
32
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE Eco mode
Sports mode
The focus is on battery load, consumption, speedometer with smart
The focus is on speedometer and RPM with smart road scan and
road scan. Although users can switch optional side small dial to
battery life status. Users can switch optional side small dial to other
other options e.g. time, RMP (revolutions per minute) etc.
options e.g. time, temperature etc. 33
SOLUTION DESIGN
WIREFRAMES Autopilot mode
LAUNCH PROTOTYPE Cruise control
Information cluster’s focus is on smart road scan, which gives 360 road
The central plate will give users options to set or cancel the cruise.
information with speed and battery life status. The central plate will
Users can accelerate or decelerate from left up/down buttons.
give users access to cancel autopilot at any time for safety reasons.
Cruise icon will display as a feedback on information cluster. 34
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE
Phone mode
Apple OS phone full features will only be available through voice activation or in park mode. In drive mode user can access favorites, recent and receive calls. 35
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE Dashboard
Climate
A compact view of most used four apps for quick access. The user
Added more details and gave users option to control temperature,
can adjust the preferences from system settings.
fan, directions, dual/single and settings. 36
SOLUTION DESIGN
WIREFRAMES
LAUNCH PROTOTYPE Seat
Mirror
Users can adjust seat setting for multiple profiles by using Front-
Users can adjust mirror setting for multiple profiles by using Front-
Back and Up-Down controls.
Back and Up-Down controls. 37
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
I applied paper prototype usability test recommendation to improve the user experience by: • Improving overall icons design of the interface. • Reduced elements from information cluster. • Made “Siri” icon prominent on center plate. • Improved data visualization, made them intuitive and easy to understand on information cluster. • Reorganized apps hierarchy in the central display unit. • Added seat heating and on/off button in the climate control.
38
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
START ENGINE
39
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
COMFORT MODE
40
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
ECO MODE
41
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
SPORTS MODE
42
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
AUTOPILOT MODE
43
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
PHONE - COMFORT MODE
44
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
CRUISE - COMFORT MODE
45
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
PHONE - PARK - COMFORT MODE
46
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
PHONE - PARK - COMFORT MODE
47
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
DASHBOARD VIEW
48
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
CLIMATE CONTROL
49
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
SEAT CONTROL
50
SOLUTION DESIGN
HI-FI WIREFRAMES
LAUNCH PROTOTYPE
MIRROR CONTROL
51
CONCLUSION
52
CONCLUSION
USER CENTERED DESIGN PROCESS
1. Research & ideation
4. Information architecture
2. Persona and task analysis
5. Concept evolution (2-3 iterations)
3. Competitive analysis
6. Design evolution
(2-3 wireframe iterations) 53
CONCLUSION
Conclusion A full UX interactive design process was explored in the project Titan interface design from research, ideation, exploration, define, design, prototype and usability validation. The three-cycle interactive process with paper and interactive prototype usability 7. Concept & design validation (Paper prototype usability testing)
8. Hi-Fi design evolution (2-3 visual design iterations)
validation refined the product. After multiple iterations, I achieved 100% effectiveness, efficiency, and satisfaction through user flow interactions, intuitive UI, labels, and icons of the interface, which was supported and validated by usability tests. To extend the Titan’s interface design to the next level, we will need to build on this research with detailed features and
9. Hi-Fi design validation
(Interactive prototype usability testing)
10. Hi-Fi design
conceive the whole user interface design of the vehicle. 54
RESEARCH
REFERENCES • www.driverless-future.com/?page_id=384 • www.google.com/selfdrivingcar • www.mercedes-benz.com/en/mercedes-benz/innovation/innovation-overview • www.bmw.com/com/en/newvehicles/i/i3/2013/showroom • www.bmwusa.com/bmw/BMWi • www.teslamotors.com • www.youtube.com/watch?v=TsaES--OTzM&list=PLc2496NnT82vRe1dXzsfK1gsFiGEu_ty8&index=4&feature=iv&src_ vid=bOdHf2qiPoc&annotation_id=annotation_1513127645 • www.youtube.com/watch?v=TsaES--OTzM&list=PLc2496NnT82vRe1dXzsfK1gsFiGEu_ty8&index=4&feature=iv&src_ vid=bOdHf2qiPoc&annotation_id=annotation_1513127645 • www.theguardian.com/technology/2015/may/22/uber-self-driving-car-pittsburgh • www.nytimes.com/2015/09/02/technology/personaltech/google-says-its-not-the-driverless-cars-fault-its-other-drivers.html?_r=0 • www.technologyreview.com/news/539731/how-to-help-self-driving-cars-make-ethical-decisions • www.bbc.com/news/technology-34423292 • www.technologyreview.com/view/542626/why-self-driving-cars-must-be-programmed-to-kill • www.macworld.co.uk/news/apple/will-apple-make-icar-project-titan-rumour-roundup-bmw-3425394 • www.macworld.co.uk/news/apple/report-apple-and-bmw-started-talking-about-an-icar-collaboration-last-year-3621644 • www.ibtimes.co.uk/project-titan-apple-car-story-so-far-1515835 • www.engadget.com/2015/10/23/Tesla-autopilot-regulators/ 55