Yihan Hsia MFA Thesis project
Discover >
1
2
< IdleTime
Discover >
3
4
< IdleTime
MFA Thesis project 2014â&#x20AC;&#x201C;2016
Discover >
5
6
< IdleTime
Discover >
7
MFA Thesis project: IdleTime Yihan Hsia Academy of Art University Fall 2014— Fall 2016 Instructors: Phillip Hamlett, Bob Slote, Anthony Jagoda, Carolina De Bartolo
8
< IdleTime
Contents Ch.1 Discover 1.1 Background & problem 12 1.2 General investigation 16 1.3 Focus group 22 1.4 Online survey 28
Ch.2 Define 2.1 Five top insights 38 2.2 Defining a goal 44 2.3 Related Facts 48 2.4 Similar competitors 54 2.5 Target audiences 56 2.6 Strategy charts 58 2.7 Materials matrix 60
Ch.3 Design 3.1 The first approach 64 3.2 Logo development 72 3.3 Illustration development 80 3.4 User experience 84 3.5 User testing 132
Ch.4 Deliver 4.1 Brand Identity 154 4.2 The IdleTime Application 168 4.3 The IdleTime Website 178 4.4 The Facts posters 188 4.5 Promotion video 194
Discover >
9
10 < IdleTime
Chapter 01. Discover 1.1 1.2 1.3 1.4
Background & problem General investigation Focus group Online survey
In this chapter, I will describe the background of my thesis and my investigations through an online survey, focus group and reading materials such as books, website articles and videos. During the process, I found some interesting insights to support my thesis statement.
Discover > 11
12 < IdleTime
1.1 Background & problem Personal motivations for slowing down vary, but often stem from a sense that all of the more in our lives has not made them better. Overwhelm, stress, and a sense of disconnection are common symptoms of trying to deal with too much in a fast–paced, commodity– filled, and highly technological culture. Slow Living addresses the desire to lead a more balanced life and to pursue a more holistic sense of well being in the fullest sense of the word. This is the initial reaction for most people when they being told to slow down. Chances are you would really benefit from more of it. The first thing is to put your smartphone and any technological device away, try to cook a good meal for you self, or read an novel for an hour without any bother. You may feel anxious when you do them in the first time, and you may feel like you are wasting time. The reason is that we are so used to the speed and fast world. Once you do it, you will find out that time become your friend because you have more flexibility to use it. Slow Living means structuring your life around meaning and fulfillment. Similar to “voluntary simplicity” and “downshifting,” it emphasizes a less-is-more approach, focusing on the quality of your life. Slow Living addresses the desire to lead a more balanced life and to pursue a more holistic sense of well-being in the fullest sense of the word.
Discover > 13
I would like to promote the idea of softer life style, and educate people how to slow down their steps in order to have a better life. This is my starting point.
14 < IdleTime
Slow down. Be present. Be mindful. Reflect. Reconnect.
Discover > 15
1.2 General research
16 < IdleTime
Books
The Power of Slow: 101 Ways to Save Time in Our 24/7 World 2010 by Christine Louise Hohlbaum ISBN-13: 978-1250058591 In Praise of Slowness: Challenging the Cult of Speed 2005 by Carl Honore ISBN-13: 978-0060750510 Mindful Tech 2016 by David M. Levy ISBN-13: 978-0300208313 Slow Is Beautiful 2014 by Tsuji Shinichi L’art de la simplicité 2014 by Dominique Loreau
Discover > 17
18 < IdleTime
Websites
psychologytoday.com Psychology Today by Sussex Directories, Inc. zenhabits.net zen habits: breath by Leo Babauta digitaldetox.org Digital detox by Digital Detox LLC mindful.org mindful by Foundation for a Mindful Society www.ted.com TED Talk by TED pewinternet.org Pew Research Center by Pew Research Center gallup.com Gallup by Gallup, Inc. huffingtonpost.com The Huffington Post by TheHuffingtonPost.com, Inc. scientificamerican.com Scientific America by SCIENTIFIC AMERICAN, A DIVISION OF NATURE AMERICA, INC. techland.time The TIME Mobility Poll by TIME, in cooperation with Qualcomm
Discover > 19
20 < IdleTime
Discover > 21
1.3 Focus group Goal Uncover insights through the conversation with target audience. Date 11/04/2014 Participants 9 young adults
I created a house event and invited my friends to discuss about my thesis topic. I treated the meeting just like a casual home party because I want to make my guest comfortable and relaxed to share their experience about their life paths. I also designed invitations and brochure to get guests into the topics. It was fun and during the meeting, everyone was willing to tell others their feelings toward their personal daily lives.
22 < IdleTime
Discover > 23
Participants & their thoughts
24 < IdleTime
“We want to do million things in one time, and that is impossible.” “Don’t force yourself to slow down, it will come naturally if you are involved in it”
“Having my own time and doing what I like help me control my emotion, which leads to a calm mind.” –Joy Pa,
“I just want to get everything done. It makes me feel secure and calm.” –Jack Chu, game designer
web designer
–Rolfuson Chung, game designer
“For me, slow lifestyle doesn’t mean that slowing down my daily schedule, it means slowing down my mind.” –Aria, illustrator
“Spending time on finding a right way is more important than try to finish it fast.” –Louise Tsai, graphic designer
“In that 5 minutes break, I don’t think anything about my work, anything.” –Zoey Lin, graphic designer
Discover > 25
26 IdleTime > 01 Discover >
Discover 27 > 27
1.4 Online survey Goal To investigate modern peopleâ&#x20AC;&#x2122;s thoughts about the pace of their lives. Date 02/28/2015â&#x20AC;&#x201D;03/06/2015 Participants 97 people invited online To gain more thoughts from different people, I conducted an on-line survey to reach wider audiences. Besides my friends from 20Âto 30 who is main the internet users, I also asked my elder friends to take the surveys and spread it among their social networks. I got 97 people taking my survey and observed the difference between comments from different ages.
28 < IdleTime
Questionnaire General Questions 001. What is your age? 002. What is your gender? 003. What’s your job? 004. Which country are you from? 005. Do you have kids? Do you live with them?
Questions about lifestyle 006. What takes the most part of your life? 007. Please describe the pace of your life in general. 008. How often do you take a rest during a workday? 009. What activities makes you feel calm and relaxed? 010. What places make you feel calm and relaxed? 011. Do you agree that “slowing down” can improve the quality of modern people’s life? 012. Do you want to slow down the pace of your life? 013. If you want to but can’t slow down, what may be the reasons? 014. If we separate slowness into inner perspective and outer perspective, what kind of person are you? 015. Tell me about your understanding of “slow life,” please describe not only the lifestyle but also emotional performance. 016. Do you believe slow life can happen in this modern world? why? 017. Tell me about your impression of “slowness.” (For example: I think slowness is a bad thing, because it... or I think slowing down is good because it...)
Discover > 29
Highlighted results
Q: Do you agree that “slowing down” can improve the quality of modern people’s life?
No, I don’t agree I am not sure.
3.3%
15.2%
Yes, I agree.
81.5%
30 < IdleTime
Q: How often do you take a rest during a workday? (Taking a rest in here is defined as a conscious behavior.)
More than two hours
Every two hours
Only when I need to go to bathroom
Every each hour
Others
10
20
30
40
Discover >
Q: Please describe the pace of your life in general.
Normal
32%
Slow
10.3% Very slow
1%
Fast
42.3%
Very fast
14.4%
32 < IdleTime
Q: If you want to but can't slow down, why might be the reasons?
I am too busy and don't have time
I am afraid of being judged by other people I don't know how to slow down
Other
10
20
30
40
50
Discover > 33
Highlighted answers Q: Tell me about your understanding of “slow life”, please describe not only the lifestyle but also emotional performance.
“Be it not just a pause of action and mind, but at times even lead to a detour in one's thinking process. “Slow” is an applicable term as in contrast to the drumming pace dominating the lives mostly of those heavily exposed to business and commerce.”
“For me, I believe that slow down my life means to spend time for myself, talk to the people who I love, and embrace the quality.”
“Slow life means that we can have good control of our daily lives.”
34 < IdleTime
Q: Do you believe slow life can happen in this modern world? why?
“No. Modern life purposefully puts you into debt so you constantly have to work. This leaves little time for relaxation/slowing down, and the times we do have to slow down are marred by stress.”
“I think people are trying to do that but it seems a bit hard to make it happen. Right now people are more demanding about prompt reply and always put their personal needs in priority.”
“Why not? This is a world where people have benefited from standardized procedures, regulations and even thinking models. People believe in what has proved useful and effective, thus, people believe in the good of being quick, saving time, and doing more. When over-simplified, one might think that fast is good, so slow is bad. In my opinion, living a slow life is not adopting an entirely opposite approach to the good notion of fast, however, slow life is merely not entirely fast. There is a whole spectrum of possibilities between the extremes of fast and slow, and who can prove that they are all improbable ways of living? As long as you have a choice.”
Discover > 35
36 < IdleTime
Chapter 02. Define 2.1 2.2 2.3 2.4 2.5 2.6 2.7
Five top insights Defining a goal Related facts Target audiences Similar competitors Strategy charts Materials matrix
After researching widely, I picked several important insights and even chose three out of them to develop my design strategies. Since slowing down is a vague definition, I tried hard to set a realistic goal and statement of my thesis. This chapter describes my decisions about further thesis directions and target audiences.
Define > 37
2.1 Five top insignts I chose five top insights from my wide researches. Each insight shows different point of views around my topic. I also considered about the design opportunities of each insights and how can I leverage my design capacity on them.
38 < IdleTime
01 Distractions such as digital devices and trivial thoughts keeps people not being mindful and present. We live distracted lives and our ability to focus, create, and accomplish suffers significantly. It is increasingly clear that distractions are not going away on their own. Being connected all the time means weâ&#x20AC;&#x2122;re subject to interruptions, weâ&#x20AC;&#x2122;re constantly stressed about information coming in, we are at the mercy of the demands of others. Instead, the responsibility is ours to live attentive, intentional lives in a world of distraction. This is a goal we must continue to seek. Source: The Power of Slow by Christine Hohlbaum
Define > 39
02 Creative ideas happen when you stop checking your phone. “You come up with really great stuff when you don’t have that easy lazy junk food diet of the phone to scroll all the time.” — Sandi Mann New Tech City’s Bored and Brilliant is a week of challenges that will guide you to less phone time and more creativity. The average mobile consumer checks their device 150 times a day, and 67 percent of the time, that’s not because it rang or vibrated. Forty-four percent of Americans have slept with their phone next to their beds. Sandi Mann, boredom researcher of the University of Lancashire of the U.K, said Idle minds lead to reflective, often creative thoughts. Minds need to wander to reach their full potential. Source: www.wnyc.org
40 < IdleTime
03 Unhappy people feel more rushed, yet watch more TV and than happy people. TV is gradually replaced by smart devices now.
68
mins
17
mins
Time perception can have a significant impact on well-being. For instance, in a quality of life study by the General Social Survey drawing on data collected for 34 years and 45,000 participants, sociologists John P. Robinson at the University of Maryland reported television viewing was most frequent in unhappy people, indicating that TV consumption overall has no lasting benefit. Clearly, what we do with our time has a long-term effect on our level of happiness. Since smart devices came out of markets, watching TV is gradually replaced by reading and checking smart devices such as smart devices or tablet. A study from Northwestern University revealed that the more time people spend on their phones, the more likely they are to be depressed. The average use for a depressed person was 68 minutes, compared to just 17 minutes for someone who has better mental health.
Define > 41
04 Technological advances as a possible explanation for our collective sense of urgency. According to British psychologist, Dr. Richard Wiseman, the overall pace of life has increased by 10% worldwide since the mid-90’s. In some places, it has even increased by 20%. And in the case of Singapore, it has increased a whopping 30% in the last decade and one-half. Wiseman points to technological advances as a possible explanation for our collective sense of urgency. The immediacy of communication has informed our time perception. At present, ‘now’ has become the new yesterday. As a result, we are left time-crunched, stressed, and overwhelmed. Despite the rise in stress-induced illness, we continue to pound the path in a furious race to our imaginary finish line. Source: Psychology Today
18 v=
Ac 42 < IdleTime
tu
al
d
a ist
6 ,0
nc
e
0
i 0m
8 :3
4 ,4
/s e
0
c
m 1k
=2
3
5 8,8
6m
i
05 Even some digital users admitted that they are addicted to their smart devices, they don't know how to deal with it. Usually, people won’t consider themselves addicted to smart devices. However, through my interview with one of my friend, she is seen as heavy phone users, she stated even she knows using phone overly affects her mental and physically healthy, it is hard for her to quit this habit. She said, “Because it is so easy to access my phones, and things are going on it all the time.” She tried not to pay too much attention to it, but once she noticed that she tried to ignore it, she pays more attention to it. She also said she prefers to connect people by texting instead of calling them or meeting in person. She couldn’t explain the reason. “It naturally becomes like that.”
How can I use you wisely?
Define > 43
2.2 Defining a goal Because the term"slowing down" is too abstract and vague, which can mean many different things, it is hard to define the goal of my thesis project. Without a clear goal, design solution will eventually fail. So I used abstraction laddering to find the right point of view and tried to restate my thesis topic and go in a solid direction.
44 < IdleTime
Technology constantly competes for our attention and urges our time perception. Why?
Fast-pace decreases the quality of life. Why?
Slowing down the pace of our lives.
How?
Being mindful and present. How?
Use our smart devices consciously and wisely. How?
Be aware of our digital behaviors and set up the environment with fewer distractions and do things really matters.
Define > 45
Goal: To encourage people to use their smart devices more consciously and wisely. 46 < IdleTime
Define > 47
2.3 Related Facts 1. Forty percent of Americans prefer to engage with people online than in person. Performics released the results from their 2012 Study, which asked nearly 2,000 Americans social media users about their use of social media across devices. 49 percent of would rather text than call a person. 40 percent feel more comfortable interacting with people online rather than in person. These new participants are comfortable increasingly replacing real-time communications with social media interactions. Source: Performics Hello!
...
40%
~!@
#
~!@
#
Hello!
2. Fifty percent of teens feel they are addicted to their mobile devices. According to the poll, which was conducted for Common Sense Media, a nonprofit focused on helping children, parents, teachers and policymakers negotiate media and technology. A larger number of parents, 59%, said their teens were addicted. The poll involved 1,240 interviews with parents and their children, ages 12 to 18. Source: CNN.com
Save me!
50%
48 < IdleTime
%^ &*
~!@ ()_ # %^ +@ &* #% ^% ^# % %
%^ &*
~!@
#
~!@
#
Sen
%^ &*
d
%^ &*
3. One third of Americans tend to do multitasking with their mobile devices. To better understand attitudes about mass mobility, TIME, in cooperation with Qualcomm, surveyed 4,700 people online and 300 by phone in eight countries. One of the results shows that there are one third of American participants tend to do multiple tasks with their mobile devices. 32% of them use mobile devices while driving a car, 35% while playing with children, 37% while attending a party, 36% while eating at a restaurant and 61% while watching TV. Source: TIME Mobile Poll 2015
32%
35%
36%
Define > 49
4. Younger users more likely to use their phone for preventing boredom, avoiding others and getting somewhere.
Percent Of smartphone owners in each age group who used their phone for the following reasons at least once over the course of 14 surveys spanning a one-week-period. 18—29 30—49 50+
Avoid being bored
Avoid others around you
Find a good way get somewhere
82
55
15
33
32
93
47
37
57
Nothing to do... So bored...
Source: Pew Research Center: US Smartphone Use in 2015
50 < IdleTime
5. Text messaging is the most widely-used smartphone feature but voice/video calling remains popular.
Percent Of smartphone owners in each age group who used the following features on their phone at least once over the course of 14 surveys spanning a one-week-period. 18â&#x20AC;&#x201D;29 30â&#x20AC;&#x201D;49 50+
100 98 92
Texting messaging
Internet use
80
?
www.
93 91 94
Voice/video calls
91 87 87
SNS
77
55
Video
Music
97 90
!
21
75
46
31
39
91
64
Source: Pew Research Center: U.S. Smartphone Use in 2015
Define > 51
“Electric communication will never be a substitute for the face of someone who with their soul encourages another person to be brave and true.” —Charles Dickens
52 < IdleTime
Nice to see you! Hello!
Define > 53
2.4 Similar competitors There are many applications, websites, even services that help people to use their smart devices more consciously. However, each of them has different features, I visited these websites and downloaded some applications to be my references.
Moments Moment is an iOS app that automatically tracks how much you use your iPhone and iPad each day. If youâ&#x20AC;&#x2122;re using your phone too much, you can set daily limits on yourself and be notified when you go over. Pros: It has Family mode that parents can monitor their children's phone usage. Cons: The user interface is confusing and visually dull.
Checky Checky answers a simple question: how many times a day do I check my phone? By giving you insight into your phone checking habit, Checky helps you become more aware. Pros: Single function makes this app simple to use. Cons: Numbers of checking phones sometimes doesn't reflect users' digital behavior. It is not a strong insight to change digital habits.
54 < IdleTime
Forest Forest is an app growing trees while you are not using your phone. Once you want to use it, the growing tree will die immediately. Pros: It is great to connect gaming with quiting, the visual illustration is also adorable. Cons: It is too cute so that it doesn't urge people to stay away from their devices.
Flipd Flipd makes all of your apps disappear when you use it. There is no way to get them back. Pros: It is a strict app for people who want to quit their phones. Cons: There is not flexible area people can adjust based on their personal daily routine.
Offtime Offtime allows you to customize your connectivity in different situations such as family time, work time, my time and so on. The appâ&#x20AC;&#x2122;s intuitive analytics make it easy to identify your habits and take action to change them. Pros: Customized mode function is useful and smart. Cons: It may get too complex to use these features since there are too many things going on and may get user spend much time on it.
Define > 55
2.5 Target audiences Primary People who are overly connected to their smart devices and lack self control. Secondary People who are overwhelmed and tired of digital clutter.
56 < IdleTime
Define > 57
2.6 Strategy chart Topic area The digital behavior of modern peopleâ&#x20AC;&#x2122;s digital behavior Goal To encourage people to use their smart devices consciously and wisely. Target audience Primary: People who are overly connected to their smart devices and lack of self control. Secondary: People who are overwhelmed and tired of digital clutter.
58 < IdleTime
01
02
03
INSIGHT
INSIGHT
INSIGHT
Unhappy people feel more rushed, yet watch more TV and play more games than happy people. They didn’t use their free time wisely.
Distractions such as digital devices and trivial thoughts keeps people not being mindful and present.
Addicted digital users aren’t aware of the negative effects brought on by improper behavior. Even they admitted, they don’t know how to deal with it.
»
»
» STRATEGY
STRATEGY
STRATEGY
Create personal bucket list to motivate people to put down their devices and to connect with people in real world.
Provide an environment with fewer distractions to people so they can be mindful and present.
Notify how unconscious digital behavior effects users mood and daily life badly and teach them how to deal with it.
»
»
» DELIVERABLES
DELIVERABLES
DELIVERABLES
An application that allows people to create their “bucket lists” and track their mood when accomplishing these lists.
An application that helps people to not be distracted by digital devices.
A series of illustrations to depict how digital behavior shapes our lives differently and to provide tips to stay away from smart devices.
A website to provide application information and a download link.
Define > 59
2.7 Materials matrix
iPhone application IdleTime is an application that helps people understand their digital using patterns and encourages them to use their smart devices more consciously. (3 points)
App promotional video An promotional video to introduce IdleTime applicationâ&#x20AC;&#x2122;s feature and teach people how to use it in their daily lives. (2 point)
This video will be put on website to provide more details to users.
60 < IdleTime
LEAVE YOUR DEVICE. LIVE YOUR LIFE!
Campaign Advertising posted on public and social media ads to promote the website and IdleTime application. (1 point)
This is the entry to introduce IdleTime to public audience.
Website IdleTime website provides the information of IdleTime app, facts of digital behaviors of modern people, and tips for people who want to stay away from their smart devices. There is a motion graphic video to promote IdleTime app as well. (2 points)
The content of the posters will also be on the website.
Facts posters A series of posters that depicts how different digital behavior shapes peopleâ&#x20AC;&#x2122;s daily lives and tips to stay away from smart devices. (2 points)
Define > 61
62 < IdleTime
Chapter 03. Design 3.1 3.2 3.3 3.4 3.5
The first approach Logo development Illustration development User experience User testing
Once I decided my design strategies, it is time to think about its look and feel. In this chapter, there are my visual explorations and identity development. For my deliverables, I will show the structure of the application and website. I also invited some friends to use my first prototype of the application and give their opinions. The user testing helped me to refine the user experience.
Design > 63
3.1 The fisrt approach At the beginning of the design process. My original idea is creating an app-controlled product that can filter signals around the users. So people can be more mindful and get good rest. I would like to show the process of the first stage of the project. It includes the IDLE app, the Home IDLE product, a promotional website and an app opening video.
64 < IdleTime
The IDLE app The main function of the IDLE app is to manage the settings of the Home IDLE product. It includes only three functions: Call lists, Scheduling, and Settings. People can edit the call lists to pass some emergency calls. People can schedule their IDLE time regularly. People also can set up more preferences in the Settings.
Design > 65
66 < IdleTime
Design > 67
The IDLE Home product I asked my friend who majors in industrial design to help me build the 3D model of the product. All the model shapes were remained simple and clean.
68 < IdleTime
IDLE Website I built a rough website to introduce the app and provide an access to the app and store of the product.
Design > 69
The IDLE App opening animation For the first time user, I made an animation to show how to use the product and application.
70 < IdleTime
However, through user interviews and user testings, people mostly think that it is redundant to have another item around. Just turning off the smart devices can solve the problem. So I changed the point of view of my thesis project. The insight I got from this process was that to make people do such things spontaneously is more valuable than just providing the product. Instead of a complex product with many settings, I want to provide a tool simply helps people practice mindfulness and being present. Before that; I also need to address how the practice is related to people's digital behavior. I didn't change my central concept; I changed the design strategy.
Let's regroup everything and reform the project.
Design > 71
3.2 Logo development I changed the name of my project many times, even after I started designing the logo, I wasn't sure which one described my project the best. When I started logo design, I used IDLE. During the exploration, I decided to change IDLE to IdleTime because I think â&#x20AC;&#x153;Timeâ&#x20AC;? is the key point in my project.
72 < IdleTime
Brand naming ideas
Mind Nap
Offline
Downtime
Pause
Smarter
Wiser
IDLE
IdleTime
Ideal Idle
Breathe
Simplicity
SLOWDOWN
Minimal
Moment
Digital Declutter
Design > 73
Chosen direction
Idle time Idle time
74
< IdleTime
Idle time
When I was in my app interface design process, I incorporated the closing eye icon to indicate that the smartphone is on its relaxing/ idling/ inactive mode and the lock icon represents the locked screen. So I used the eye to be the main icon of my project. I spent some times trying different typefaces and modified my workmark. This section will show the design process.
Idletime Idletime
Design > 75
Wordmark development [ Clone Round Latin Bold ]
76 < IdleTime
[ Clone Round Latin Regular ]
[ tschicholdarchitype normal ]
[ Tondo light ]
[ Filson Soft ]
idletime
Design > 77
I chose tschicholdarchitype normal to be the original structure of the IdleTime workmark. Because it's unique type form is really playful and goes well with the closing eye icon. However, to make it more special I modified the letter forms, made the stroke rounded and thicker to match the stroke of the icon perfectly.
78 < IdleTime
Design > 79
3.3 Illustration development To communicate with my target audience, I decided to use humorous illustrations instead of realistic pictures as my visual system. People avoid reading dark messages so I chose a bright and friendly illustration style to depict my thesis project to be attention grabbers I also created two characters and used them across all of my illustrations.
80 < IdleTime
Design > 81
Character development Boy faces & figures
82 < IdleTime
Girl faces & figures
Design > 83
3.4 User experience Each of my deliverables has a goal to achieve. The facts posters is for people to reflect their digital behavior and lead them to the website. The website is for people to more facts, tips and the infomation of the IdleTime application. The promotional video is for people to understand the project and the app. The IdleTime app is for people to pratice being present. In In this section, I will show the user experience design process of the IdleTime app and the website. It includes user flow development and user interface design. I will also describe the ideas behind the facts posters and the production of the promotional video.
84 < IdleTime
To reflect—
To access—
The facts posters
The IdleTime website
To understand—
To practice—
Promotional video
The IdleTime app
Design > 85
86 < IdleTime
The IdleTime App
The IdleTime app is an useful tool to help people understand their digital behavior and use smart devices more consciously and wisely.
Design > 87
88 < IdleTime
Design > 89
App user flows chart(1) Sign up IdleTime
Facebook account
Tours
Create a new account
Schedule
Set up IdleTime duration
Choose the time period you want to idle regularly
Click key button
Set up unlocked lists
Choose how regular it operates daily/ weekly/ specific weekdays
Set up
Click start
Save
Save
Screen locked
The screen will be locked during your scheduled IdleTime
Start
Time's up
End
Input mood
90 < IdleTime
Another round
Reminders
Statistics
Bucker Lists
Set up reminders of using certain Apps for too long
Statistics charts let users know their digital behavior patterns
Create a buket list to motivate users to do what they always wanted to do.
Choosing how long after using the Apps the reminder appears ex. 15 minutes
Choosing what Apps operate the warning reminder ex. Facebook, Pokeman GO
Save
Once you use Facebook or Pokeman Go over 15 minutes, the reminder will pop out: “You have used fa for 15 minutes, did you benefit from using the App?”
Resent data
Average data
Daily phone usage and mood
Average time spent on your phone
Week (Phone usage ,mood and comparison)
Average daily use frequency
Average device usage,
Add
Check
Typing
Input mood
Save
Save from “I will” to “I did”
Choose if sharing to social media
3 most used apps
Once user understand their digital behavior, they can use ‘Schedule’ and ‘Reminders’ to change their digital behavior.
Design > 91
App user flow chart(2) Setting
Auto replay
Turn on/off
Edit
About
Achevement
Log out
Share
When users reach certain amount of accumulated Idletime, the user gets one achievement card. Share IdleTime app with friends through email, messenger or social media
Save Choose sharing tool
Choose contacts
92 < IdleTime
Facts
Tips
Terms & conditions
Infographic about how digital behavior shapes modern peopleâ&#x20AC;&#x2122;s lives
Tips on how to get away from your digital devices
Privacy Policy
Design > 93
App interface development In this section, I will display the interface design development of the IdleTime app. As the process went on, I changed the visual expression several times based on class critique and feedback from people outside. I also refined my user flow in its details so the contents of interface were changed along the way.
94 < IdleTime
1st version
Design > 95
2nd version
96 < IdleTime
3rd version
Design > 97
User flows I developed six user flows to describe how the IdleTime app works in different functions. I will also display the finalized interface design in these user flows.
User flow 01: Log in/ sign up and see tours
98 < IdleTime
Design > 99
User flow 02: Edit unlocked lists and use IdleTime
100 < IdleTime
Design > 101
User flow 03: Schedule IdleTimes
102 < IdleTime
User flow 04: Set reminders for certain apps
Design > 103
User flow 05: Add a new bucket list item: ”Learning pour-over coffee”
104 < IdleTime
User flow 06: Check the accomplished bucket list item: ”de Young Museum”
Design > 105
User flow 07: Review statistics
106 < IdleTime
User flow 08: Manage settings
Design > 107
108 < IdleTime
IdleTime Website IdleTime website provides the information about the IdleTime app, facts about digital behaviors of modern people, and tips for people who want to stay away from their smart devices. There is a motion graphic video to promote the IdleTime app as well.
Design > 109
110 < IdleTime
Design > 111
Site map
IdleTime Homepage
App promotional video
App features introduction 1. IdleTime 2. Schedule 3. Reminders 4. Statistics 5. Bucket lists
Download link
Facts
Fact illustration (1)
Fact description (1)
Fact illustration (2)
Fact description (2)
Fact illustration (3)
Fact description (3)
Fact illustration (4)
Fact description (4)
Fact illustration (5)
Fact description (5)
Fact illustration (6)
Fact description (6)
Download link
112 < IdleTime
Tips
About
Download
Tip(1) Wear a real watch and get an alarm.
Project statement
Download link
Tip(2) Turn off your push notifications
Contact area
Tip(3) Unfollow people who arenâ&#x20AC;&#x2122;t your real friends.
Tip(4) Unsubscribe from unwanted mail lists.
Tip(5) Delete apps that waste your time.
Tip(6) Call people, just call.
Tip(7) Go out for dinner, and leave your phone at home.
Download link
Design > 113
114 < IdleTime
Design > 115
116 < IdleTime
IdleTime facts posters
A series of posters that depicts how different digital behavior shapes peopleâ&#x20AC;&#x2122;s daily lives and tips to stay away from smart devices.
Design > 117
Content development Then I came up an idea: for each moment, I will create two different scenes, one is using smart devices unconsciously, and another is using smart devices wisely. These sets form a normal day of a person. After all, life is composed of these small moments.
118 < IdleTime
To create content for facts posters I started to think about different situations that poor digital behavior affect people's daily lives. Not surprisingly, there are many things people would execute with digital tools. If people don't use them mindfully, it will lead to bad results. There were so many such situations so that I made them in daytime order. Then I came up an idea: for each moment, I will create two different scenes, one is using smart devices unconsciously, and another is using smart devices wisely. These sets form a normal day of a person. After all, life is composed of these small moments. People can understand the concept directly. I also create one main character to tell the story.
Design > 119
120 < IdleTime
Design > 121
I also did more research on the facts and studies are related to each situation and reinterpreted them in illustrations of my style. I came up this idea when I started to put them on the website. For the posters, I used question headline to make people curious about the answer. Although I did place the short answers at the bottom, people have to go on the website to see more descriptions and other situations.
Poster
122 < IdleTime
The completed illustration on the website
More descriptions on the fact happening in the illustration
Design > 123
124 < IdleTime
IdleTime Promotional Video IdleTime promotion video presents the concept and features of IdleTime app. Animating makes characters alive with humorous sense. People can understand IdleTime easily in a short time by watch this video.
Design > 125
Story development
126 < IdleTime
Design > 127
Storyboards & script As technology advances, communication between people becomes more convenient and faster. However, an overload of information and instant notifications distract you more easily and keep you away from being present and mindful. In addition, people are creating this habit of scrolling without any significant purpose. Using your smart devices unconsciously consumes a lot of time and can even lead to addiction problems. Although technology is invented to enhance the quality of peopleâ&#x20AC;&#x2122;s lives, how you use it makes a big difference.
128 < IdleTime
IdleTime is an app to help you use smart devices more consciously and wisely. It locks your screen for certain apps to make you take a break when using your devices too much. It helps you to schedule off-screen times to build a better daily routine. It sends reminders when you accidentally overuse certain apps. It tracks your phone usage and mood, which allows you to understand your digital behavior. It allows you to create a bucket list to motivate yourself to accomplish what you always wanted to do. Leave your device. Live your life. Create your IdleTime today.
Design > 129
130 < IdleTime
Design > 131
3.5 User testing After a long design process, it was time to hear people's opinions. After I designed my user interface and user experience, it was important to get people to use my app and see my website. I set up several tasks based on those important functions of the IdleTime app and told users to complete those tasks. I also revisited those interviewees who were heavy smart devices users and had them test my app because they were my main target audiences. Having people look and test my work was uncomfortable.However, I got so many useful comments and found some blind spots of my project.
Tasks 1. Set up IdleTime and edit unlocked lists, start to use IdleTime. 2. Schedule IdeTime regularly. 3. Set up reminders for 15 minutes for specific apps. 4. Review statistics, describe your understanding of those charts. 5. Add a new item to bucket list: “Learn pour-over coffee.” 6. Check a finished bucket list item: “de Young Museum.” 7. Manage settings
132 < IdleTime
Design > 133
134 < IdleTime
User no.1 Gwen Lai Freelancer, age 31 Digital habits 1. She checks her phone after waking up and before bed. 2. She tends to do two things at the same time, for example, cooking and watching TV or eating and checking phone. 3. When there is nothing to do, she would just be checking her smartphone. Comments 1. It would be better if there are dates in "I did" list.
Design > 135
User no.2 Edward Liu Industrial designer, age 26 Digital habits 1. He is a heavy smartphone user. 2. He mostly likes to scroll social media, read feeds and watch videos. 3. He is easily distracted by his smartphone even if he isn't using it at the moment. Comments 1. The homepage of website is clear, but it would be better if there were more interactions on tips page. 2. He likes the reminder function. It will really help to alert him about how much time he spends on social media. 3. The visual design of the application is a little bit flat. 4. The function of IdleTime should be more clear. Maybe having a hint to help people know where to adjust the timer. 5. Recording the mood rate every time is cool. The statistics will help people know the relationship between them and their smart devices
136 < IdleTime
Design > 137
138 < IdleTime
User no.3 Joy Pa Web designer, age 26 Digital habits 1. She usually checks her phone while commuting. 2. She hates that people keep checking their phones during parties or meetings. 3. Instead of checking feeds and posts, she uses her smartphone to contact people when she needs to. Comments 1. It seems there are too many functions in the app. This may decrease usage if it is too complicated. 2. It's not clear how to use some functions. Maybe add some hints for the first time users. 3. The statistics data users see should be more clear. Device usage and IdleTime usage is messed up. 4. The emojis are really cute!
Design > 139
User no.4 Joyce Lin Industrial designer, age 26 Digital habits 1. She had no Internet service on her phone for a long time. She just upgraded her mobile plan to 4G service recently. 2. She rarely checks her phone because she thinks there is not much to read or see. 3. She uses her computer to watch TV programs, but she said it increases her work efficiency. 4. When she is with friends, she rarely pulls out her phone and scrolls even if her friends are all checking their phones. Comments 1. I like those fact illustrations. They are presented in a humorous way but related to a serious fact. There are many details in them. It is fun to look at them. 2. About the app, I think it is an interesting idea. Although I don't have such problems, I will definitely recommend that my boyfriend use this app because he spends too much time on his device! It annoys me if he keeps checking his phone when we are together.
140 < IdleTime
Design > 141
142 < IdleTime
User no.5 Louise Tsai Graphic designer, age 27 Digital habits 1. She only checks her phone when there is missed call or if she has an appointment with someone around that time. 2. She won't reply or check messages right after she sees notifications. 3. She rarely scrolls in front of others because she think it is not polite. She wants to connect with people at her side. 4. However, she spend a lot of time watching movies and TV shows on her phone, especially before bed. Comments 1. It is good to have hints for first-time users. It was confusing about how to set up the IdleTime duration. 2. It is better to use the same visual hint for setting up time for the IdleTime and the Reminders. The icon for Reminders doesn't indicate it is editable.
Design > 143
Strangers hunting I refined those issues pointed out on all of my deliverables after the user testing. To get opinions from someone have never heard what I am working on, I started talking to strangers in cafes randomly, and ask them to use my website and app. Here are their comments and reactions.
144 < IdleTime
Design > 145
“This website is clear and easy to understand. The comparison of illustration is fun to see. More details provided make it even more convincing. ” —Frank Fullem, sofeware engineer
Other comments 1. It is surprising there are animations in the tips page. 2. The visual design looks like it is for kids. More lifestyle photos would be better.
146 < IdleTime
â&#x20AC;&#x153;The illustration depicts the horrible reality in a cute way and makes me laugh. Although I don't think I will use the app, I believe many people need it to practice focusing and being mindful.â&#x20AC;? â&#x20AC;&#x201D;Paola Romano, graduate student
Other comments 1. Great job on those illustrations! 2. I want to recommend this app to people, especially those who are sitting with their friends but keep facing their phones.
Design > 147
â&#x20AC;&#x153;It is interesting that people usually think they don't need this kind of ap. The truth is that you see many people are use technology improperly. Personally, I like the Reminders and the Bucket list function the most." â&#x20AC;&#x201D;Alisha Hieb, college student
Other comments 1. The time buttons on facts page don't make me think they can be clicked. Maybe put some bar or underline them to give a hint to users. 2. The app interface is clear, but there are many functions in this app, I probably will only use Reminder and Bucket list.
148 < IdleTime
“This concept is great. Actually I just deleted my facebook account today. I think the Reminder is a great function because it reminds me to be present again.” —Dominic Baldin, senior SCM engineer
Other comments 1. The navigation bar is clean and nice. May show something more engaging in the homepage. A blank green is not that attractive to me. 2. I like the animations on the tips page. It makes me read through each one tips. However, it's a little bit too much scrolling for the facts page.
Design > 149
“It is all about focus. Be focus on everthing you are doing. No matter it is talking, playing learning, working, or even thinking, just focus.” —Stefano Maldini, traveler
150 < IdleTime
Design > 151
152 < IdleTime
Chapter 04. Deliver 4.1 4.2 4.3 4.4 4.5
Brand identity The IdleTime App The IdleTime website The facts posters Promotional video
This chapter will display all deliverables of my thesis project, which including an application, a website, a promotional video, and advertising. I also included final visual standard guide to give the clear visual hint to target audiences.
Deliver > 153
4.1 Brand Identity Identity system plays an important role in a good brand. A completed visual identity system will be displayed in this section. These is also visual standard guide that others can follow if they use in their cases.
154 < IdleTime
Our logo The IdleTime logo is composed of an closing eye icon and a modified wordmark. The closing eye icon represents that the smart devices are in â&#x20AC;&#x2DC;idleâ&#x20AC;&#x2122; mode. With the rounded corner shape, the wordmark gives friendly and warm feeling to viewers.
Deliver > 155
Logo anatomy Signature y
17y
y
y=1.2x
9y
8y
y=1.2x
27y
156 < IdleTime
Wordmark
x x
y= 1.2x = the diameter of
Note: x= the diameter of
Secondary signature 4x
16x Note: x= the diameter of
Deliver > 157
Clear space Signature x
x x = the height of the wordmark x
x
x x
x
x
Seconday signature x
x x = the height of the wordmark
x
x x x
158 < IdleTime
x
Wordmark x
x
x = the height of the wordmark
x x x x
x
Icon z
z
z
z
z
z z
z = the diameter of
z
Deliver > 159
Colors Primary colors 100%
75%
50%
25%
IDLE GREEN
LIVELY YELLOW
RELAX BLUE
CYMK (79, 6, 60, 0)
CYMK (7, 0, 78, 0)
CYMK (64, 0, 26, 0)
RGB (0, 171, 138)
RGB (245, 242, 84)
RGB (51, 204, 204)
160 < IdleTime
Secondary colors 100%
75%
50%
25%
MINDFUL GREEN
WARM ORANGE
ENGAGING RED
CYMK (29, 0, 64, 0)
CYMK (0, 35, 88, 0)
CYMK (0, 75, 85, 0)
RGB (186, 232, 128)
RGB (251, 176, 59)
RGB (255, 102, 51)
Deliver > 161
Typography I used Clone Rounded Latin for all typography in my thesis project because of it unique letter form. Its playful looks is appreciated and recognizable and bring lively feeling into the visual system of the project. The stroke is oblique with special angles and match my illustration styles. There are eight weights in the typeface set, and I only use Semibold, Medium and Regular. Semibold and Medium weight are used for website page, posters and promotional cards. Medium and Regular weight are used in smaller typography in the application and book.
Clone Rounded Latin Semibold Clone Rounded Latin Medium Clone Rounded Latin Regular
162 < IdleTime
Clone Rounded Latin Semibold Clone Rounded Latin Medium Clone Rounded Latin Regular
ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 1234567890~!?@ #$%^&*| _( ){ }[ ]<> Book Title Subtitle
Reverse Emphasize Highlight
Clone Rounded Latin Semibold ABCDEFGHIJKLM NOPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 1234567890~!?@ #$%^&*| _( ){ }[ ]<> Deliver > 163
Clone Rounded Latin Medium
Clone Rounded Latin Regular
ABCDEFGHIJKLM
ABCDEFGHIJKLM
NOPQRSTUVWXYZ
NOPQRSTUVWXYZ
abcdefghijklmn
abcdefghijklmn
opqrstuvwxyz
opqrstuvwxyz
1234567890~!?@
1234567890~!?@
#$%^&*| _( ){ }[ ]<>
#$%^&*| _( ){ }[ ]<>
164 < IdleTime
Deliver > 165
Photography style Bright and light Except for illustrations, I decided to add real photo in to my design. I chose lighter photography with happy atmosphere which expresses the positive of lives. People in the photo seem enjoying their moments and be present.
166 < IdleTime
Deliver > 167
4.2 The IdleTime app
168 < IdleTime
Deliver > 169
170 < IdleTime
Deliver > 171
172 < IdleTime
Deliver > 173
174 < IdleTime
Deliver > 175
176 < IdleTime
Deliver > 177
4.3 The IdleTime website
178 < IdleTime
Deliver > 179
180 < IdleTime
Deliver > 181
182 < IdleTime
Deliver > 183
184 < IdleTime
Deliver > 185
186 < IdleTime
Deliver > 187
4.4 The facts posters
188 < IdleTime
Deliver > 189
190 < IdleTime
Deliver > 191
192 < IdleTime
Deliver > 193
4.5 Promotional video
194 < IdleTime
Deliver > 195
196 < IdleTime
Deliver > 197
198 < IdleTime
Deliver > 199
Leave your device. Live your life!
200 < IdleTime
Finally only us!
Deliver > 201
Thank you Thanks to every instructor who guided me during the thesis developing process, especially to Phillip Hamlett, Bob Slote, Anthony Jagoda, and Carolina De Bartolo. Thanks to all my classmates in classes who went through this long journey with me. This course was not easy, but we worked hard together and didn't give up. I can finish this project because of your kind support and helpful suggestions. Thanks to my families and friends who gave me your kind mind and always cheered me up when I feel frustrated. Without you, this thesis project wouldn't be completed.
IdleTime Duration: Fall 2014â&#x20AC;&#x201D;Fall 2016 Designer: Yihan Hsia Contact: iamyhsia@gmail.com
Book title: IdleTime Typeface: Clone Rounded Latin Book Bindery: Blurb.com Copyright@ Yihan Hsia
202 < IdleTime
Deliver > 203
204 < IdleTime
Deliver > 205
Leave your device. Live your life! www.idletime.today
206 < IdleTime