Thank you for being here. For a better browsing experience, please use computer to open this website:)
Interaction, Visual & Motion Designer
Pen + Paper, Sketch, Invision, Principle
Our target users are outdoor runners with smart watches.and for running and exercising is quite common among the runners which might lead them to easily give up, also the are also important concerns for outdoor runners.
Facing these problems, I present Nitefly, an apple watch application that provides interesting 'firefly-raising' experience to encourage them to achieve their running goal.
You can see your fireflies on your watch plate. They will fly away to indicate your recent laziness in running and exercising. Also, you can set yourself a reminder to run when receiving notifications.
Recommendation and suggestions are available for you to set challenging but attainable running goals. Tips from fireflies could also help you avoid danger and bad habits.
You can see fireflies collected while running. Several milestones will help you to achieve your running goal step by step. Every time they finished a stage, he will hear 'Ding' and feel the vibration.
The supporting APP will serve as an additional tool that enables you to see safety situation nearby and collect recommended routes to run.
It was WatchOS human interface guidelines and played around with the apple watch a lot. Also, It’s not easy but super interesting to explore and make an integrated product. Therefore I made many attempts such as applying psychological theories into design and conducting rapid iterations. Finally I learned a lot from it., so I read through the
I hereby declare that this project is my own work and to the best of my knowledge it contains no materials previously published or written by another person.
Our design started from an interesting finding in our day-to-day observation:. Therefore, we attempted to identify their needs and design a better experience.
We started our user research by 5 semi-structured interviews. Also, we followed 2 users and observed their behaviors during their outdoor running to know users’ detailed tasks, problems and motivations. What's more, an abstracted affinity map was made to summarize key insights about their characteristics, thoughts and habits.
But what are the most important pains? Who are our key users? Based on what we found before, I consolidated critical user journeys by getting quantitative data with a survey. Check out my survey framework and main findings from 42 responses.
With these evidence, I developed personas and a user journey map. I defined my target users as two groups based on their running patterns:; . Then I seperately concluded pain points from their user journeys and emotion flows.
Shown below is a summary of the important insights from former research and analysis. From the ultimate user goals of our 2 user groups, I summarized their user needs into 3 categories. Based on these user needs, I created 3 design principles as the goals to guide the following design.
From our survey data, we finalized 3 key user problems. Based on those, we defined the start point of the next stage: 3 key design challenges to solve.
Laziness is a common phenomenon in terms of body training. How could I help people to develop running habits? I conducted a competitive analysis to know about others' solutions and their pros/cons.
I explored the existing fitness and behavior-changing apps and clustered them in three attributes: gamification, notification and social influence. Below are the pros and cons of each method.
Inspired by these methods, I did a brainstorm session to explore a good way to help them overcome laziness. I tried to avoid the disadvantages of different methods and finally I got 30+ ideas. I converged them into 3 design concepts.
I walked through each concept with 5 potential users and invite them to compare these ideas to our competitors such as Nike Running app. Here’s the main feedback I got.
Based on the feedback, I combined option A & B and decided to design a gamified system with smart watches and phones. For my convenience, I chose to design for iOS and WatchOS. I applied ‘How Might We’ to explain the general idea and also, created a storyboard for the concept.
How Might We...
Enable runners to collect fireflies by outdoor running and keep them at their devices as pets?
After the general concept, I started to focus on the running experience itself. I tried to provide a more detailed solution to enhance runners’ experience from the beginning to the end.
From our user research data, I summarized an ideal experience with two elements:and . I tried to come up with suitable solutions to help users get the ideal experience.
After finishing all the ideation of possible solutions, I created a user flow chart to guide me to finish the wireframes of interfaces with multiple functions. Consider Design Principle 3.
I created a wireframe with the user flow above and conducted a rapid testing session. The objective of it is to help me quickly modify the user flows and main interfaces. Based on 5 participants' words, I made several iterations on the whole user flow as well as the interfaces.
Users love collecting fireflies, but one concern is that they don’t have a long-term motivation to keep it as a routine. Therefore, besides daily fireflies, there should be something that
I came up with 2 design alternatives and did a quick test on 3 runners, users feel that:
Also, considering Design Principle 1, I selected option 1 as a reward system for long-term achievements.
Runners are reminded of good habits when they open the Nitefly application. However, users feel that
Therefore, I revised the user flows and notify users these habits at the right moments.
Users feel that they need to click so many times to start a simple running every day, especially for goal-setting page. Therefore, I simplify the process with an easy start page and make goal-setting.
In wireframe, I designed the whole application with 2 devices: smart watches and phones. Smart watches are considered as the primary medium for users’ daily usage, a supporting phone app is also introduced to facilitate the running. After the user testing session, I did a systemetic design of Nitefly and tried to clarify the functionalities of each part as well as the data provided.
Font: Saira Semi Condensed
Saira provides the feeling of . It’s suitable for Nitefly’s visual branding and communicate our spirit.
I selected semicondensed version because . It especially apple watch.
Color Scheme: Fluorescent Lime
Dark background and fluorescent lime gradient is selected to provide and also align with our key theme: .
Also, we tried to provide a to , especially when users are running in strong light.
Sections and Buttons
Based on the font’s appearance, the radius of sections were set in a harmony of the font. Also, . To , buttons are stylized and highlighted in an obvious way. Also, the minimum size of a button was set as 64 ✖️64. Consider Design Principle 2.
With InVision, I created an interactive prototype. Nitefly went through usability testing and review it with design principles. The objective of it is to explore deeper through the interfaces and find usability issues so I incorporated think-aloud method and SUS questionaire.
Some AI-related features are introduced in Nitefly. In the test, some users asked: how could I know the challenge/route it recommends is good? This made me think of the problem that. Then I made modifications on several details.
01. Recommended Challenges
Add supporting truth and call-to-action phrases.
02. Find Good Routes Nearby
Details-on-demand of different dimensions to prove the route condition.
During prototype testing, users expressed strong interest in 'achievement sharing',. Therefore, I tried to increase users' fulfillment by actively notifying users to see and share their achievements in a more visually-pleasing way.
Users asked a lot on the game mechaism during the testing and. Especially users are confused about the functionality of the watch app and supporting phone app. Therefore, I tried to add a more smooth onboarding session for both phone and watch.
1. Users get to know
2. Users are in 'Apple Watch' app on their phone.(If not auto-installed)
3. After users successfully install Nitefly on their watch, they will and how this game works.
1. Incorporate with more social elements
In usability testing, more than one users said they expect more social elements and fun with friends. One big challenge is how to avoid too much social pressure, but still let them engage their friends in such an interesting gamified process.
2. Design for different stages in running
People have different feelings during the running process, for example they feel more relaxed and easy at beginning than after running for a while. What can be a better solution for that difference?
3. Universal design
It can be foreseen that users who do not run outdoor can also be motivated by the fireflies. Also, some people prefer to bring phones to run. Therefore, it would be better if the product can cover a larger user group.
4. HOOK Theroy
Recently I just started to read Nir Eyal's book called Hooked. His theory of habit changing could definitely be applied to runners and also help me modify current experience Nitefly provides.