UNIVERSITY OF COLORADO DENVER | DIGITAL DESIGN THESIS PROCESS BOOK | MICHAEL ELDRIDGE
CONTENTS.
Introduction 04 Thesis Question 05 Timeline 06 Research 08 Target Persona 16 Initial Concept Development 18 User Flow 20 Wireframes 01 24 User Testing 26 Wireframes 02 28 Prototype 32 Deliverable 36 Special Thanks 38
THE BIRTH OF VELOWATCH
INTRODUCTION. As an avid bicycle commuter I began to notice areas of my daily commute that had room for improvement – most of them involving safety. When riding many routes in Denver there are times when there is no bike lane or times when you are in what is called a shared lane – a route designated for bike traffic but does not have any dividing line between traffic and cars. When on these routes I would find myself always checking for approaching traffic by looking over my shoulder – a dangerous task for any rider. It forces your body out of position and takes your eyes away from the road in front of you. For inexperienced cyclists it may even cause them to swerve into traffic when they turn their head.
On a cold winter evening I was riding home through Downtown Denver on a street with no designated bike lane. Since it was dark and I was riding in traffic, I was on high alert for approaching cars that may not be paying enough attention to see me, constantly looking over my shoulder.
As I turned my head to see what was behind me – boom – I hit a large pothole. The impact was hard enough to blow my left hand off the handle bars but I was lucky enough to avoid an accident. That was close enough for me – I decided then and there I wanted to design a solution for bicycle commuters to be aware of their surroundings without causing a potentially catastrophic distraction.
4
THESIS QUESTION
How can proximity sensor technology be used to create a safer experience for cyclists on the road?
5
TIMELINE.
6
2/3
2/10
2/17
2/24
3/3
3/10
3/17
1/22
1/29
2/5
2/12
2/19
2/26
3/5
3/12
3/19
01
02
03
04
05
06
07
08
09
SPRING BREAK
1/27
3/31
10
11
12
13
14
15
16
SPRING BREAK
week #
1/20
3/31
4/7
4/14
4/21
4/28
5/5
5/11
4/2
4/9
4/16
4/23
4/30
5/7
5/13
4/7
4/14
4/21
4/28
5/5
5/11
4/2
4/9
4/16
4/23
4/30
5/7
5/13
10
11
12
13
14
15
16
Conduct General Research Formal Draft of Research Paper Survival Style Video Pitch Logo Development V1 Process Book Development SME Interview Finalize Research Paper Prepare Pitch Presentation #2 Mock Up 3-5 Watch Screens Render 3D Watch With Screens Wireframes – Phone & Watch Vision Demo Storyboards Wireframe & Storyboard Apply Skin to Wireframes Vison Demo Shoot 01 Prepare Pitch Presentation #3 Vision Demo Animatic Vision Demo Shoot 02 Wireframes in Process Book Script VO For Vision Demo Record VO For Vision Demo Vision Demo Shoot 03 Final Locked Rough Cut Motion Graphics / App Demo Final Vision Demo Edit Finalize and Print Process Book Final Live Presentation Design Wall Vinal or Posters Print Wall Graphics For Install Install @ Redline Thesis Crit De Install
01
02
03
04
05
06
07
08
09
1/20
1/27
2/3
2/10
2/17
2/24
3/3
3/10
3/17
1/22
1/29
2/5
2/12
2/19
2/26
3/5
3/12
3/19
RESEARCH & FINDINGS
RESEARCH.
8
RESEARCH & FINDINGS
Before diving into research it is important to be aware of the question: How can proximity sensor technology be used to create a safer experience for cyclists on the road?
car is approaching as long as the rider looks back at a consistent rate – but there are some negative side effects of looking over your shoulder that many people don’t think about.
The current state of safety technology for bicycle commuters is antiquated and does not take advantage of the current innovations that many industries rely on to keep their customers safe. My research will examine the following: The current safety technology for cyclists on the road, automotive technology that keeps drivers more aware and alert of their surroundings, current cycling apps on the market, and some concepts for app enabled complete bikes. By researching these different areas of cycling and road safety technology I will determine the best possible solution for implementing an advanced safety system that can be used with any bicycle.
When a rider looks over their shoulder it does a few things that can be potentially hazardous. First of all, it completely takes your body out of the proper and safe riding position. The proper position when riding is to have your shoulders square to the handlebars, back straight and your chin up looking forward. As you turn your head when riding your shoulders become off axis in relationship to the handle bars and your eyes are no longer pointed in the direction of travel. This can cause a rider to swerve away from the direction they are traveling – often into the path of vehicle traffic. This is potentially deadly if a rider turns to look for a car right as a car is about to pass. The goal of VeloWatch is to provide a solution to that problem using technology.
Lets start by examining the ways in which one may stay safe when commuting on a bike. First and foremost a helmet is the best device to protect yourself in the event of an accident, but a helmet does nothing to actively prevent a collision. There are a few things that can be done as a cyclist to prevent a potentially deadly collision with a motor vehicle. Wearing bright reflective clothing and having lights will increase a riders visibility to approaching motorists. Installing rear facing mirrors will allow the rider to see approaching traffic, but mirrors have blind spots and don’t work that well on a bicycle. Also, mirrors don’t look cool at all – how many riders do you see with a set of mirrors installed on their bikes? Not many – because many riders are concerned about being cool and trendy rather than safe. The method used by most cyclists for being aware of approaching traffic is simply glancing over their shoulder to check for cars. This method is fairly effective in terms of knowing if a
There are many new technologies currently in use in the space of automotive safety including: lane departure warning systems, automatic braking technology, night view and blind spot assistance. Each of these systems utilize multiple proximity sensors and/or camera systems combined with algorithms that allow the software to be aware of the vehicles surroundings. Since these awareness based technology systems exist – the problem is packaging them into a system that is small enough to integrate with a bicycle – a topic we’ll discuss more in the following pages. Almost every major automotive company is innovating in this space and they all utilize a different system that provides results that are similar, lets take a look at what’s out there...
9
BICYCLE SAFETY • Helmet • Mirrors • Reflective Wear / Lights • Safety Training • Awareness
AUTOMOTIVE SAFETY • Seat Belts • Air Bags • Traction Control • Anti-Lock Brakes • Laws, Sinage, etc. • Roadway Design • Lane Departure Warning • Automatic Braking • Night View Assist • Blind Spot Assist
CYCLING APPS • Strava • Cyclemeter • Coach My Ride • Map My Ride • GPS Cycling Computers • Cycling Power Meters
AUTOMOTIVE PROXIMITY TECHNOLOGY Almost all automotive companies are innovating in the space of driver assisting systems. Some of the top innovators according to Auto Trader are: Ford Blind Spot Information System With Cross-Traffic Alert, Volvo City Safety, Honda Collision Mitigation, Audi Lane Assist, and Mercedes-Benz Night View Assist PLUS.1 All of these systems utilize similar technologies – some rely on radar emitting proximity sensors, some utilize cameras and the best systems seem to be equipped a powerful combination of both. Radar is an electronic system that can detect and track objects, they can provide a highly accurate measurement of the distance, velocity and direction of the detected objects. Depending on the space between radar pulses and frequency of the sensor the range can vary.2 Determining the correct range sensor is critical to providing proper alerts to the user. Many auto manufactures are also using the data gathered from these systems to create informative Heads Up Displays (HUDs) that are capable of providing information on the dashboard and even project semi-transparent information onto the windscreen. Jaguar and Land Rover seem to be leading this race in concept development with a prototype system that can not only paint lines and directions on the road, it can project camera data onto the hood and A/B pillars to make them appear transparent.3 This system is still in the development stages but when it’s complete it will no doubt change the way people drive and think about automotive safety. The current hang-up with the technology is accurately determining where the driver is looking at all times – this is a critical part of the design because the projection needs to be mapped onto the surface based on the drivers head and eye position. All of this technology is extremely advanced and has been in development for years. VeloWatch plans to harness the concepts and technology from these systems in order to create a safety system for bicycle commuters. Since we know that the technology exists the problem becomes it’s size. How can we package adaptive proximity sensor technology into a piece of hardware small enough to mount to a bicycle without being obtrusive to the rider or atheistic of the bike?
Infinti Lane Departure
Volvo Adaptive Cruise Control
Cars are equipped with large ECUs that control many aspects of the vehicle, from engine electronics, to lights and the safety technology the vehicle is equipped with. Jamming that complex of a system onto a bicycle is far fetched – but how small could the processing equipment get if the only task it needed to complete was measuring proximity and transmit that signal to a phone via bluetooth? 1. “5 Top Car Safety Innovations.” Auto Trader. http://www.autotrader.com/research/article/car-tech/212820/5-top-car-safety-innovations.jsp. 2. Jain, Vipul, and Payam Heydari. Automotive Radar Sensors in Silicon Technologies. New York, NY: Springer, 2013. 3. “Your Future Windshield Will Look More like a See-through TV than a Window.” Digital Trends. August 28, 2014. Accessed February 19, 2015. http://www.digitaltrends.com/cars/jaguars-augmented-reality-laser-hud/.
10
JLR 360º Virtual Urban Windscreen
CYCLING – MOBILE APPLICATIONS
Even though there is no widespread technology solution for bicycle safety there are however many cycling apps currently on the market. Apps for iPhone & Android as well as full on cycling computer systems that can be mounted to the bike are available from many different companies. The iPhone & Andriod apps do a fantastic job of tracking fitness data such as overall distance, speed, elevation and more. Some of these phone applications even have the ability to integrate with health tracking devices to pair your cycling data with your health data – for example: seeing your heart rate change over the period of your ride based on things like speed and elevation. These sorts of data sets can be vital for hard core cyclists or athletes that need specific information about their training. According to BikeRadar.com the top five cycling apps for mobile devices are: Strava, MapMyRide, Google Maps, CycleMeter and Wahoo Fitness.4 Since Strava seems to be the most popular we’ll dive into the workings of this popular app to see why cyclists love it. What makes Strava stand out in my opinion is not it’s ability to track your stats and progress but how the app allows you to challenge your friends and other people that ride the same routes as you. Strava uses the tag line “Prove It” in order to get their users to push themselves – not only to prove it to themselves, but their friends and other people using the app. I believe this is the core reason that Strava is arguably the most successful cycling application on the market today. By fostering a community of riders that all have the desire to track their cycling stats and share them with others they’ve created a product that people not only love to use but rely on. Strava combines top notch data gathering with an intuitive and beautifully designed experience. For a new user it’s easy to setup and use for the first time. The dark UI is sleek, consistent and does a great job of making the data quick and easy to navigate at a glance. It’s not over-designed but still has a unique look and feel that makes the UI stand out as part of their brand. When designing the UX/UI of VeloWatch I will rely on Strava as my main reference. VeloWatch will provide all of the main functionality of Strava but include one more function that will set it apart and create a class of its own – safety. VeloWatch will be the only cycling app where the number one mission is to increase safety for cyclists on the road. Although it is clear Strava is the best-in-class cycling mobile app, there are a few concepts floating around the internet for innovative technological solutions for cyclists that go beyond tracking data and attempt to enter the space of safety.
4. “Best IPhone and Android Apps for Cycling - BikeRadar.” BikeRadar. Accessed February 19, 2015. http://www.bikeradar.com/us/ gear/article/best-iphone-and-android-apps-for-cycling-35227/.
11
CYCLING TECH. – COMPLETE BIKE / APP COMBINATIONS
A few concepts seen on KickStarter integrate navigation solutions onto existing bikes or offer a complete bike solution – an app/bike combo anywhere from $1200 –$3000. After talking to many people in the cycling industry I’ve found the main problem regarding why these complete bike solutions never make it past the concept stages or into the widespread bike market. No true cyclist wants a bike designed by an industrial designer or concept artist – they just don’t work and ride like a bike designed and built by a bike company does. Chris Oliver, owner of Plus Size BMX and Evolve Action Sports park here in Denver said, “Every year at Interbike (the annual international cycling trade show in Las Vegas, NV) there are always a couple booths with some industrial designers trying to change the cycling industry with their space age looking bike designs – they never work. Industrial designers don’t think about the needs of cyclists and their bikes always ride like trash.”5 This is why VeloWatch has the opportunity to be a successful solution to the problem of integrating sensor technology with a bicycle. Since it would be a bolt on solution – any rider could adapt it to any bike on the market. This changes the number of potential customers from a handful of wealthy tech-hipsters to almost every cyclist that takes a spin on the road. That is a game changing difference from the standpoint of investors looking to turn a profit. Even though we believe that the majority of these new age complete bike concepts are mostly unsuccessful at changing the way people ride, lets look at one concept that is in midst of development. A company by the name of VanHawks is creating a complete bike system that integrates sensors to provide haptic feedback on the handlebars – providing danger alerts and navigation information to the rider.6 VanHawks also is marketing their product by claiming it will create a network of commuters that will share information about potholes, delays and other hazards. They also have a “lost” feature, where you can report your bike stolen – when another VanHawks rider is in the vicinity of your bike they will get an alert. Their concept and overall product is spot on and very similar with what VeloWatch is going to do, but it has a major flaw that will prevent it from changing the way the majority of people commute on their bikes – cost and not being adaptable an existing bike. The VanHawks connected bike system starts at $1200 and gets more expensive as you upgrade the bike. First of all, that is out of the price range for many bike commuters so there is a huge loss in customer base there. Secondly, the people that do spend anywhere from $1000 – $5000 on a bike most likely do not want a bike like this. People dropping the big bucks on bikes pick out every single part, and often have frames custom built to the dimensions of their body. 5.”Recent Posts From All Categories.” PSBMX. Accessed February 19, 2015. http://psbmx.com/. 6.”Vanhawks.” Vanhawks. Accessed February 19, 2015. https://www.vanhawks.com/.
12
CYCLING TECH. – ADD ON HARDWARE
In my opinion they’ve created a product that is a double edged sword. It is such an amazing concept that has the potential to improve the commutes of thousands of people, but the product they’ve created isn’t for the masses. It’s for a select group of consumers. The next class of cycling technology is what I would consider add-on tech. This is a hardware and technology system that a user can use with or on any bike. Cycling power meters could also be grouped into this category but I included those with the general cycling apps because the main goal of power meters is to track data for training – not comfort and safety during a commute. The first product is something called MindRider.7 It is a helmet equipped with sensors that monitors stress levels for riders throughout their rides. They don’t really dive into how they are getting this stress data from the riders head from the helmet, but I would assume they are using heart rate data combined with things like speed and location to estimate the stress level. The goal of MindRider is to make commuting a stress free and safe activity for cyclists. By determining where riders are stressed they gather data on what routes are unsafe and can have other riders in the network avoid those routes. The problem I see with MindRider is the fact that it is a helmet that is quite frankly – extremely ugly. Another example of industrial designers trying to make their mark on cycling style. I don’t think any true cyclists would buy a helmet that looked like this. Beyond looks, the helmet has no air ventilation – who wants to get to work with a sweaty head? Another bolt on hardware solution for innovative bike tech is a product called SmrtGRiPS.8 SmrtGRiPS is a vibrating grip you can install on most bikes – it pairs with an app to provide navigation and other alerts via haptic feedback. Their crowd funding isn’t going so well so it most likely wont go into production – this is another example of a great idea with a product that the cycling community doesn’t feel fits into the culture. 7. “”Mind-reading” MindRider Bike Helmet Wants You to Have a Sweet Ride.” “Mind-reading” MindRider Bike Helmet Wants You to Have a Sweet Ride. Accessed February 19, 2015. http://www.gizmag.com/mind-reading-mindrider-bike-helmet/32543/. 8. “SmrtGRiPS: World’s First Connected Bike Grips.” Indiegogo. Accessed February 19, 2015. https://www.indiegogo.com/projects/ smrtgrips-world-s-first-connected-bike-grips.
13
CONCLUSION – USER CENTERED DESIGN
By focusing on the user experience, the design will be optimized for ease of use and prioritize the most critical information. Since the primary goal of VeloWatch is to provide users with alerts about their surroundings we must be careful to provide that information in the best way possible. “The goal of the alert is to give users the ability to recover from important events.” – says Johhny Holland, a UX designer that designs tablet based defence applications for the military. The goal of sending a user notifications is to trigger an action allowing them to correct or recover from certain events. The last thing you want to do is provide an alert that makes the user panic – that would be unsuccessful.9 When working on these types of notifications there is a fine line that must be ridden. The number one reason people un-install mobile applications is annoying notifications.10 There are many things that will shape the process of developing the concept that is VeloWatch into a user experience that will deliver outstanding alerts. “UX is not only about human-computer interaction (HCI), usability or IA, although usability probably is the most important factor that shapes UX”.11 By leveraging all of these processes it will be possible to create something that people not only love to use, but rely on in their daily life. In conclusion – using a user centered design approach in combination with the technologies previously outlined – the opportunity to improve cycling with technology is there. With a strong dominate selling idea VeloWatch has the opportunity to rise to the top in the space of cycling safety.12 At VeloWatch we believe that a safe ride is a relaxing ride – increasing the safety for riders will result in an overall better experience for everyone riding on the road. 9. “Designing Alarms and Alerts.” Johnny Holland. Accessed February 19, 2015. http://johnnyholland.org/2010/08/ designing-alarms-and-alerts/. 10. “Quora.” What Are the Best Practices of IOS Push Notifications? -. Accessed February 19, 2015. http://www. quora.com/What-are-the-best-practices-of-iOS-push-notifications. 11. Smashing Magazine Editors Choice. Freiburg, Germany: Smashing Media, 2013. 12. Schley, Bill, and Carl Nichols. Why Johnny Can’t Brand: Rediscovering the Lost Art of the Big Idea. New York: Portfolio, 2005.
14
WE WANT TO CHANGE THE WAY CYCLISTS STAY SAFE ON THE ROAD.
CAUSES OF CYCLING ACCIDENTS
ROAD HAZARDS
DANGEROUS INTERSECTIONS
DISTRACTED DRIVERS
15
WEATHER
TARGET PERSONA. Personas are a core aspect of a user centered design approach. It is a way of determining potential users of your product and allows you to pinpoint the core user of your product. By determining who is most likely to use your product, it allows you to design for those people in mind.
16
ANDY MOTIVATIONS
GOALS • To make advancements in career oriented goals such as moving up into higher paying and more powerful positions
Incentive Safety
• Stay healthy by means of outdoor activities
Achievement
• Have fun as much as possible
Growth
• Live life on the edge and to the fullest extent possible
Power
• Save money by eliminating wasteful spending such as gas and parking when fees driving in urban areas. Save car miles for heading to the mountains on the weekends
Social Financial Innovation
AGE OCCUPATION STATUS LOCATION
27 Developer Single Denver, CO
BIKE EXPERIENCE Intermediate HELMET USER No ARCHETYPE The Creator
TECHNOLOGY
BIO Andy is a Jr. Developer at a small startup tech company in Denver, CO. He Lives downtown just 2 miles from his office so riding to work is faster, cheaper and easier than driving. Andy does own a car that he drives to work when the weather is bad, but he prefers to ride as much as possible.
IT & Internet Software Mobile Apps
Not only does Andy ride to work daily, he normally always rides when going to hang out with friends around town. Since he is a craft beer enthusiast, riding allows him to enjoy as many beers as he pleases when winding down after a long week at work. Andy is also an avid adventure sport athlete but his busy work schedule makes it hard for him to hit the gym during the week. Riding around town allows him to squeeze a short workout in every day.
Social Networks
17
INITIAL CONCEPT DEVELOPMENT
1
2
3
Using a rear facing proximity sensor we can alert rides of vehicles approaching from behind. Giving riders the information to ride defensively in traffic could save lives.
Transmit the proximity data from the sensor to the iPhone then to the Apple Watch if the rider is equipped with one.
Alert the rider of potential hazards via haptic feedback using the Apple Watch, audio alerts will be used if there is no watch connected. By crowd sourcing potential hazards such as potholes, busy roads, and dangerous intersections from our application users we can alert riders so they can be alert or avoid the area all together. 18
4 The rider can now ride defensively based on the hazard information provided by VeloWatch. VeloWatch alerts will be different for different types of hazards – this way riders can respond differently to different alerts.
INITIAL CONCEPT DEVELOPMENT
“A smartphone demands your complete attention, which interrupts your real-world activities.” – Jonathan Kohl Software product management consultant
19
USER FLOW. Mapping the user flow is a way of quickly brainstorming and iterating the different process and interactions of an application. This process defines the different screens and how they are related. It also ensures that information will be organized and compatible with the mental models of the users.
20
USER FLOW
21
KEY
START
App Screen
Launch App
User Input Next
Program Decision
Setup Overview Screen: Will show the steps required to get the app setup and working
Enter Profile Information: Will auto fill info if user chooses to login with FB
PHONE
Sync App With VeloWatch Sensor: “Press & hold sensor power button for 5s and hit pair”
WATCH
Return User
New User
Congratulations! Sensor has been found and paired
Sensor Paired
Pair
Next “Please press & Hold the sensor power button for 5s and hit pair”
Cannot Pair
Skip
App Home Screen
Share Ride
Do you have an Apple Watch? If so download the VeloWatch Watch App Now!
Skip
Download VW App
Launch VW App
Please allow watch pairing for VW in phone settings
Lets Roll! Twitter
Next
Would you like to share your ride data on any social networks?
Google Plus
Strava
Fill out login info for social network API
Done
Congrats! Your setup for safe rides with VeloWatch
Phone
Settings for dB, tone and alert specific based tones Watch
Sound
Ride!
Power (slider)
Sensitivity
In-ride Dashboard Elapsed Time
In-ride Dashboard Overall Distance
Pause Ride
Sensor Off
Resume Ride
Sensor On
Speed
Distance
ON/OFF
Time On, Always On, Auto On, Off
Blink
Frequency (slider), Adj freq. based on car approach distance
Sensor
Settings for default in ride dashboard
Done
Safety
Detail Stat Dashboard
Save Ride
(slider)
Watch
Finish Ride
Dashboard RideIn-ride Overview Dashboard
Distance
Settings
Avg. Speed Safety Rating
Adjust settings based on danger of current location, traffic, etc.
Elevation
WIREFRAMES. Wireframes are a low fidelity way to define the overall layout, key elements and navigation of a design. It shows what goes where, providing a visual overview of how everything is organized and interlinked. By utilizing paper wireframes it allows for rapid user testing and the ability to quickly iterate on the functionality of the application.
24
WIREFRAMES
25
USER TESTING
26
USER TESTING
KEY FINDINGS Using a user testing and research approach discussed with Ryan Gaddis I discovered the following...
• Riders are not interested in way-finding but rather route planning • Seeing hazards on map is critical for pre route planning • There is interest in safety alerts but only if it requires minimal interaction • Knowing when cars are approaching from behind is important especially on roads with high speed limits • Controlling app via watch is intriguing to people • Wouldn’t buy a watch for this app, but would use app if they had a watch
27
WIREFRAMES
28
WIREFRAMES
29
WIREFRAMES
30
WIREFRAMES
31
PROTOTYPE. Rapid prototyping is a cynical approach towards design that focuses on quickly creating a functional, interactive prototype of an application. The prototype was then tested with potential users to check how the concept, usability and viability of the app were received.
32
PROTOTYPE
33
PROTOTYPE – UI LOOK AND FEEL
Marvel was used to create a prototype of the app in order to test the basic flow from screen to screen. Information was gathered regarding the style of the interface – especially the readability and usability when looking at the screen while outside. The information gathered from user testing in this stage informed decisions made when creating the final vision demo of the application. These are just a few important screens from the prototype.
34
PROTOTYPE – UI LOOK AND FEEL
35
DELIVERABLE. 36
The process outlined in this book informed my decisions when crafting the vision demo video that demonstrates the core functionality of VeloWatch. Since this application utilizes technology that is both expensive and time consuming to develop – a vision demo provides the best way to demonstrate the concept and capabilities of VeloWatch.
37
SPECIAL THANKS
This journey would not have been possible without the help of countless amazing people in my life. From family, friends, professors and mentors – I cannot thank you all enough. I am so grateful for the endless opportunities and education I have received over the past few years. The completion of this project marks the beginning of a new, exciting chapter of my life and professional career in design.
TAYLOR NEWHALL TODD & DINA HARRIS DR. MICHAEL & TREVA HARRIS MARK NEWHALL DON & NANCY HATCH
GARY & JANET BASILEU MICHELLE CARPENTER VANCE GERARD RYAN MAST RYAN GADDIS
38
A SAFE RIDE IS A RELAXING RIDE.
Michael Eldridge 720.839.3686 Michael@AspectNine.co www.aspectnine.co