SPA RK CAPSTONE FINAL REPORT
CAPSTONE FINAL REPORT
index
PAGES
03 15 31 49
Executive Summary & Introduction Research Summary & Idea Generation Concept Definition Paper Prototypes
69 81 93
First Interactive Prototypes Second Interactive Prototypes Concluding Remarks
01 introductio
n
EXECUTIVE SUMMARY PROJECT SCOPE THE TEAM HUNT STATEMENT
Executive Summary With the advent of the global community, facilitated by the internet and its connected devices, the way people interact and express themselves has changed dramatically. It was within this context that our sponsor Wow!Systems, a multimedia agency and software house based in Funchal, approached our Capstone team with the unique goal of creating a social online environment that contributes to the mental well-being of its users. Over the course of this year, our Capstone team set out to understand how mental well-being relates to the individual’s routines and how technology as a whole can help influence people to have better decisions or stronger motivation towards activities that will bring a benefit to their daily lives.
JAN JUN Research Phase
During our first semester we conducted literature reviews, expert interviews, competitive analysis and an online survey. These methods allowed us to explore a variety of topics within technology in an effort to understand how they influence people’s routine and their mental well-being. Our findings pointed towards the potential benefits of combining social networks to inspire positive attitudes and provide motivation by recording experiences. From these, our team generated a variety of ideas, that encompassed the breadth of knowledge we acquired in order to impact the individual and the community.
one
of our ideas, the daily challenges,
seemed stronger to both our team and our sponsor. It attempted to inspire individuals
towards breaking away from their established routines, by accomplishing specific daily goals and sharing them with an online community.
We decided to take a user-centered approach to evaluate and further explore this idea by designing a probe study that had over 20 participants sharing a common challenge everyday for over two weeks. The results were extremely positive, as our participants felt inspired and interested in incorporating these daily challenges in their lives. It served as the first contact and inspiration to what would become the application we further defined and developed over the course of our second semester.
SEP DEC Design Phase
At the beginning of our first semester, our team revisited the insights and ideas gathered from our concept probe to define a clear application concept. We sketched on paper hundreds of potential user interfaces, based on three metaphors we believed better conveyed the feelings and ideas behind the concept. These sketches were further selected and refined into three paper prototypes which we tested with more than 15 users in think-aloud sessions and interviews. Upon moving towards a higher fidelity prototype, we decided to combine the best elements of all prototypes into a cohesive, easy to understand and navigate design, which we prototyped directly for the iOS platform.
we
aspired to create an interface
that not only feels natural but also helps transmit the calm but action-oriented approach of our concept.
This prototype was tested with over 30 users in 3 European capitals, giving us a detailed and thorough awareness of our interface’s strengths and weaknesses. Finally, we refined and redesigned all of our prototype screens with the goal of perfecting the navigation and learnability of our UI. Our last user testing had 10 participants and was focused on the intricacies of usability.
Spark is a mobile application where everyone in the world participates in a single challenge everyday. This challenge prompts users to participate by sharing the result of their activities via pictures. This means that a single user can both participate on the day’s challenges and view the participations of other people around the world. The sharing community is firmly rooted on anonymity, by not identifying its users in any way. It is also meant to be non-competitive and free of feedback (positive or negative), allowing users to participate freely and express themselves without fear of judgment. These challenges are user created and user voted, encapsulating the variety of cultures and ideas of its users, making sure that the novelty and interest of the challenges is kept and maintained in the longterm.
our
goal with this concept is that challenges
surprise users in an effort to disrupt their daily routines.
By doing a challenge everyday people get out of their
comfort zone and experience things they would not have the motivation to pursue otherwise.
Project Scope Our client Wow!Systems, is a multimedia agency and software house headquartered in Funchal, Portugal. They develop mobile and computer applications as well as interactive multimedia installations for tourism, museums and brands. They approached our team with the intention of developing an application where users engage through a social network where they can share their emotions. This concept could leverage technologies that promote engagement in healthy activities or adapt to the users’ moods, with the overall goal of increasing their well-being and personal growth.
Collaboratively, we agreed on a tone and vision for the project that would be cemented in the following principles: Have a positive impact on people’s lives, while refraining from a mass consumption culture of emotional exploitation and sensationalism. Explore technologies that already surround us and are embedded within our routines. This means avoiding futuristic and highly conceptual ideas. With the project concept in mind, we decided to pursue research within the following areas: Social networks as a tool to share emotions and experiences; Artificial Intelligence to sense the user’s moods; Advice and suggestions to promote healthy habits; Mood-tracking with manual input to display user information over time.
“
We want to study how people's routines and social networking be relate to their emotional to design a solution that p daily mental well-being u
HUNT STATEMENT
“
ehaviors states in order promotes their using technology.
Team Spark
André Aguiar
Alejandro Machado
Our “Madeira local” was actually born in Porto, lived in Cape Town, South Africa, for 10 years, and has lived for the past 15 years in Madeira.
Born and raised in Venezuela, Alejandro always looks for an excuse to travel, go out in nature, and experience new things.
André has a background in Interactive Media Design, from the University of Madeira. He hopes to combine the best of both worlds and create simple, clean and memorable user experiences. His hobbies include cooking, gardening (herbs) and staying active by playing football, running or going to the gym.
Holding a Bachelor’s degree in Computer Science, he came to CMU and M-ITI to become an information designer after realizing that the most daunting challenges don’t lie in the technical process of building a piece of software, but in the understanding of people’s needs and the thoughtful refinement of an idea into a product that meets the user’s wishes.
Rui Marçalo
Trixy Basu
Rui was born in Portugal and holds a previous Masters in Medicine from the University of Lisbon, where he has gathered knowledge is the healthcare domain, but also experience in communication, problemfinding, analysis and solution.
Born in India and brought up in Dubai, Trixy’s past work has included creative and marketing strategy for digital and social media and pro bono design projects to aid and improve education in schools.
His personal interests range from entertainment media technologies to personal well-being and collaborative consumption solutions.
Her personal design interests involve shaping transformative educational experiences for children using storytelling and tangible user interfaces and advancing solutions for assistive technology.
R
esearch summary
02
RESEARCH INSIGHTS IDEA GENERATION CONCEPT PROBE
Research Summary Over the course of the first semester, our team focused on understanding how mental well-being relates to people’s routines, what dangers and recommendations we should be aware of, and what opportunities there are to leverage the use of current technologies to improve people’s lives. We conducted four research methodsliterature reviews, expert interviews, competitive analysis and an online survey. Their respective methods and insights will be further described in this section.
Literature Reviews
Expert Interviews
We read a total of 22 research papers and articles on the diverse topics we set out to explore. These articles consisted of 17 research papers, three medical journal articles and seven magazine articles.
With the goal of discovering more about mental well-being in its holistic view we approached 9 experts in the area. Our experts deal with people’s well-being on a daily basis and have in-depth knowledge of literature on psychology and psychiatry.
Our focus was to gather information about: • people’s well-being and practices that may influence them; • the impacts of social networks and sharing emotions on an online platform; • to get a sense of artificial intelligence technology available and its effects on mental well-being; • to study the implications of the act of recording experiences.
We conducted 7 hour-long semi-structured interviews with four Psychiatrists, three Psychologists and two researchers in the area of Human-Computer Interaction with previous experience with the topic. The interviews and their consolidation amounted to over 28 hours of research.
Competitive Analysis
Online Survey
To form a better understanding of the territory being explored in this project, we examined existing products and services in the market. We chose to study the areas that were strongly led by our previous research insights to comprehend what was unique about each. Our focus led us to evaluate 27 applications within 4 distinct categories; Journaling, Mood-tracking, Lifestyle/Habits, and Experience Sharing. We proceeded to evaluate these applications based on seven measurable characteristics and eight subjective metrics we considered relevant.
After getting valuable insights from the expert interviews, literature review, and competitive analysis, we decided to continue with primary research to have a closer look at people’s attitudes with respect to sharing their emotions and managing their wellbeing. We came up with questions that we wanted to ask social network users, based on the insights collected from the previous research methods. The questionnaire we designed was exploratory and its goal was to profile potential users and to reveal the broad features of people’s sharing behaviors.
JAN APR Research Insights
From the research methods we used, we gathered a broad number of insights which were summarized and grouped into 5 mains topics.
Artifical Intelligence After reviewing the initial guidelines for our project we decided to move away from solutions containing Artificial Intelligence elements. During our research we found that Artificial Intelligence algorithms for mental and emotional tracking seem promising in the research field, but are still not ready to be utilized in a mainstream application, which is one of the main intentions of our sponsor.
Mood Tracking
Recording Experiences
We considered Mood Tracking as utilizing manual input of emotions from the user, in order to provide him with statistics of his variances over time. Our research has discouraged this technique because users feel a disconnection from their emotional complexity and more than often cannot correctly identify their emotional state.
Recording experiences through tools like diaries and blogs is an important contributor to mental well-being in that it allows the individual to think, re-visit and interpret his struggles, leading to mental growth. However, these should not focus on negative emotions, since it was found that the exclusive recording of negative past experiences is not beneficial without cognitive processing of those experiences. The act recording experiences should not be limited to writing since it was found that images, drawings and sketches more accurately conveyed the thoughts of the recorder.
Giving Advices or Suggestions
Social Networks
Giving advices and suggestions was shown to have a unique potential to improve the user’s daily habits, as long as a discreet and unobtrusive approach is taken.
Social Networks allow people to share life experiences and to learn strategies to counter their daily struggles. One should pay caution however, that this sharing environment should not limited to explicit emotional exploitation and should not promote peer-to-peer judgment.
It was found that activities that involve social interactions, like talking with friends and participating in group activities are some of the most helpful things a person can do when undergoing a difficult emotional situations. Participating in outdoor activities and/or exercise increases self-confidence and brings people a sense of connection with nature and the environment.
We also found that Social Networks ease communication for people with social inhibitions, especially when done in an anonymous environment. Without anonymity people tend to create a fictitious self-portrait of themselves which can be damaging.
idea eneration Following our primary research phase, and the insights gathered from it, we proceeded to brainstorm ideas to try and create key concepts that could encompass everything we have done so far. The goal was to ultimately find one or more concepts that could define the direction for future research and visioning.
Experience Sharing for the elderly
Time Capsule
In this concept the main target users were the elderly. The objective was to create a social platform where elderly people could express themselves, share old stories and experiences, or talk about places they have lived or visited. By sharing there moments they would be sharing their experiences and wisdom with others, young and old alike.
This concept was thought to digitally mimic the actual physical concept of a time capsule. But in this instance the user would store a positive or happy moment, and then define after how much time that moment would reappear or be able to be seen again. This could be a personal time capsule or shared with other users in a network.
Location Based Moment Sharing
Daily Challenges
The idea behind this concept was that people would share a particular positive or happy moment, with a comment or photo, taken place at a certain geographic location. This geo-tagged “moment� would then appear for other users to see when they would pass by that particular location.
For this concept we imagined people all around the world receiving a daily challenge. This daily challenge would then require the user to participate by sending a photo, video or insert a text message and sharing them with other participants. The challenges would be based on positive activities or experiences for the user.
With the project scope and the research insights in mind, we chose to move forward with the concept we believed to have the most potential: the Daily Challenges.
APR MAY Concept Probe
Following our exploration phase of research, we embarked on a more user-focused research phase, in order to gather data from real users. We designed a concept probe study that encompassed elements from social networks, experience recording and activity suggestions, which were the most prominent approaches for the improvement of mental well-being according to our previous research. We wanted to focus on the experiences of real users, in an effort to obtain real opinions and feelings to further complement our findings with a user-centered approach.
the
probe study strives to combine the
longitudinal properties of a diary study, with the potential for inspiration of a cultural probe and the valuable subjective insight of storytelling methods.
METHOD METHOD In this longitudinal study, over 20 people around the world participated in a collection of daily challenges that would trigger them to break away from their daily routines. The challenges took place over 17 days and involved a recording element and were publicly shared between participants. Challenges were mainly divided into three types: social interactions, outdoors activities and introspective/creative activities. We wanted to understand our these different activities produced an impact to our users. Some examples of the challenges we implemented were:
SOCIAL
OUTDOORS
CREATIVE
Surprise someone with their favourite coffee or snack and share their reaction.
Go for a 10 minute walk and share something interesting you see.
Sketch something on a napkin and take a picture of it.
The perceived impact on their mental well-being and levels of engagement was collected via in-depth hour-long interviews with each participant, following the conclusion of the study.
INSIGHTS From our interviews with the participants we found that, in general, having daily goals added a positive value to the person’s established routine. We also found that both social and creative challenges gave people a more rewarding sense of accomplishment. However, user participation was found to be higher on challenges that required less effort, such as the ones performed outdoors. Although our participants experienced a variety of life events that influenced how they felt each day, they consistently referred to the challenges as something that brought them relaxation and positiveness. They found themselves revisiting participations from people around the world many times per day, expressing an interest
29
in seeing what others came up with and felt inspired to do even better the next day. The findings from our concept probe led us to create three visions that explored the core experiences possible within the same concept of daily challenges.
our
participants enjoyed taking surprise
breaks from their routines even if they sometimes worried that it would require too much time and energy.
concept definitio 03
n
THE CONCEPT CONCEPT STORYBOARD SPEED DATING
Concept Definition The fall semester started at the very beginning of September. Fresh out of our Summer experiences abroad, whether traveling doing voluntary work or internships in software companies around the world, our team reunited to discuss our past findings, and to define a plan for the design phase. Based on the success of our Concept Probe study and its findings , we realized that creating a social platform, where people participate in challenges that prompt them to get away from their routine, was an exciting idea. We defined rules and mechanisms that would allow the concept to work as a sustainable worldwide mobile application.
THE CONCEPT We defined an overall concept of an application where everyone in the world participates in a single challenge everyday. This challenge prompts users to participate by sharing the result of their activities (via pictures, video or audio). Users can both participate on the day’s challenge and view the participations of other people around the world. Our main objective with this concept is that challenges surprise users in an effort to disrupt their daily routines. By doing a challenge everyday people are getting out of their comfort zone and experiencing things they would not have the motivation to pursue otherwise. We designed the entire system to be supported by the users themselves, leveraging the imaginations of our potentially multi-cultural audience. The challenges could
therefore be more varied, interesting and cater to an infinite breadth of interests. An essential aspect of our concept was that this social environment should be based on anonymity. As we previously found, the biggest problem created by social networks is that they lead users to create a false image of their daily lives. Instead of sharing honest and real experiences, people often strive to give out a facade of perfection, which further impacts their personal problems.
we
wanted our social
community to be positive and transparent by removing any fear of prejudice, criticism and feelings of
competitiveness.
CONCEPT STORYBOARD
Erika is browsing the internet, watching time pass her by.
discover
She discovers an app where the entire world participates in a worldwide challenge every day.
She starts participating daily and is excited to do things she wouldn’t normally do.
engage
She is very involved with the community and contributes by voting on what challenges could be next.
involve
By voting on challenges, she finds out about the different passions of others and laughs at the clever ideas some people come up with.
In time, she also comes up with her own ideas and creates challenges that impact the lives of people around the world.
retain
SPEED DATING In order to keep our design user-centered, we took inspiration from studies such as the Speed Dating, to gather insights from potential users on how they felt these rules and mechanism worked towards the benefit or detriment of our application. We created a set of 8 storyboards, each exemplifying a moment in the usage of our application. The storyboards allowed users to put themselves in the shoes of the storyboard persona and comment freely on the problems and solutions presented. These discussions were followed by semi-structured interviews that further explored the attitudes and ideas of the participant.
we
chose this method because it allowed
us to gather insights from users at a very early stage in our design process and test ideas that were completely independent of any specific mobile design.
In total we conducted 10 forty-minute interviews with participants from around the University of Madeira (UMa) campus.
25-hour cycle While defining the frequency at which challenges should be sent to users we found that the experience provided in our Concept Probe study (a single challenge per day) was well received. Users believed challenges were provided with the right amount of time, without them turning into overwhelming tasks. Given that this concept is centered around worldwide participation, if we implemented a 24 hour cycle for challenge distribution we would find that different parts of the world would always receive the challenge at the same time. This would translate into a different experience of the application around the world. As a solution we envisioned that challenges could be sent out to users every 25 hours. This would create a rotation between time-zones and ensure everyone received the challenges at all different possible times in the day. This homogenizes the experience across all users, and contributes to the unexpectedness which is essential to our concept.
Erika is having breakfast at 7am, as usual. She receives a notification on her phone saying that a new challenge arrived.
She notices she is one of the first people to look at the challenges, because there are no posts from other participants.
Her challenge is to take a walk and record a 10 second video which she decides to do on her way to work. She is the first to participate.
2 weeks later, Erika is about to go to bed and receives a notification saying that a new challenge has just started.
During the following breakfast she browses through other people’s posts.
Inspired by all their contributions, she decides to plan a more ambitious submission to do later in the afternoon.
When we showed the presented storyboard to users, the overall reception was extremely positive. Our main insight was that the idea would indeed help create a fair environment for everyone, while making it more surprising and disruptive to the routine. However, the interface should strive to convey the time left in a clear but not invasive way.
Creating a challenge Before establishing that user creation should be the main drive behind the long-term sustainability of our concept, we wanted to gather insights from users to guide our decision making process.
Erika usually takes pictures of her food before she starts eating.
Today she finds herself wondering what others around the world have had for lunch.
She creates a challenge for the world: eat a typical dish for lunch and take a picture of it.
The reception of this feature was positive for all participants, as they believed it increases user engagement and interest.
Voting on challenges During our speed dating sessions, participants mentioned that the concept of voting would help users feel engaged in the experience of the application. However, by looking at the top trending challenges, people could anticipate what would be appearing in the future which may remove the surprise element of our concept.
AndrĂŠ has completed a challenge and is wondering what could be the next one coming up.
While browsing through a trending list of suggestions, he notices one that interests him and votes on it.
One day he receives a notification that the challenge he voted on has just been selected.
Hence, the voting mechanism should be less immediate and not allow users to see what is trending up. We decided that users will have access to a random selection of challenges that they can vote on, but will not be able to anticipate the next challenge.
“Ask who” mini-game The “Ask who” mini-game was thought of as a method of allowing friends to identify each other by playing a guessing game. In this game, people would try to guess who made a particular entry and if they were right, the user would get notified.
Erika is surfing through other people’s submissions from today.
For friend posts she is prompted to play a guessing game where she tries to name the friend who posted a certain participation.
She doesn’t know if she guessed right, but knows that if she did, her friend John will receive a notification saying he was busted!
However, upon showing it to our speed dating participants they felt the idea was unnecessary, as it muddled the concept of anonymity. We decided not to move forward with the idea in our consequent prototypes.
Sponsored Challenges The Sponsored Challenge concept was conceived as a way to monetize our application. In this idea, a daily challenge could be sponsored by a multi-national company that invited its potential costumers to do something in the topic of their product.
Erika receives a notification saying that a new challenge has arrived. Today it is a sponsored challenge.
The sponsor is SKIP. She is asked to take a photo of something stained and share it with others.
She completes the challenge. Despite the mention of the brand, she does not get any more ads for the product.
Our participants felt that the sponsored challenges should be separate from the daily challenges, as to not interfere with those who do not wish to take part in them. While this could become a potential idea for the application’s future, we decided that we would focus on an interface featuring only regular challenges and functionality.
Entry Filters While thinking about the users’ experience of browsing through global participations, it would be interesting to allow them to filter this content in different ways.
Erika is browsing through today’s entries from people around the world.
She filters the list to find what people have been posting in her home country.
She recognizes some of her favourite places in her city which rekindles her own memories.
We never intended users to spend hours of their day browsing through entries using hashtags and complicated filters. Instead, we decided to move forward with simpler, quicker ways of showing content, using sorting instead of filtering.
Content Flagging Since this concept relies entirely on the participations and creations of its users, we wanted to create a system that would help our sponsor look at all participations and judge their appropriateness. We decided that if users had the means to “flag” inappropriate entries, our sponsor’s team would be able to quickly disprove content.
Erika is surfing through the list of trending challenges. She finds one challenge which feels inappropriate.
She flags the entry and it automatically disappears from everyone in the world for a moment.
The entry is reviewed by a team which will decide if the challenge is suitable for its users.
It was suggested by our participants that the content could be quickly removed before most users had access to it. Hence, we pondered making entries automatically invisible upon “flagging” and only accessible again if our sponsor’s team re-approves it.
Collecting Badges Badges would consist of in-app rewards for the ongoing participation in the app’s different features. As the user participates, creates and votes on challenges, he receives badges that award him for his perseverance.
Today’s challenge asks participants to go for a walk outside and take a photo of something interesting.
Erika goes out for a walk in a garden nearby and takes a photo of a beautiful flower.
After submitting her photo entry she receives a “Shutterbug” badge for taking so many photos.
Our participants felt that Badges are usually more useful when users are able to “brag” about their achievements. However, to further test out this idea we brought this feature into our next phases of prototyping.
aper 04 prototypes
P
INITIAL SCREEN STRUCTURE THREE PAPER PROTOTYPES FIRST USER TESTING
Paper Prototyping After defining ideas for our concept and gathering insights from potential users we had a clearer idea as to what screens the application should have and as to how they should roughly be connected. We defined 6 main screens that would constitute our entire application. Our next phase was to start thinking about how the actual interface would look and feel like. We wanted our interface to have an underlying metaphor that would tie the concept together. We developed 3 paper prototypes, after ideating and iterating on interfaces that would be based on our most promising metaphors. These prototypes were then shown and tested out with users in extensive think-aloud sessions.
INITIAL SCREEN STRUCTURE Our initial application’s screen structure reflects our decisions on the features and rules that would define our application. The different screens were defined as an effort to cover the entirety of features we felt would be important to test with users.
Today’s challenge screen
Today’s entry screen
In this screen the user is informed of what the current challenge is and is able to participate in it. It also serves as the landing page whenever he opens the application.
The entry screen shows all entries from every participant around the world. For this screen we wanted to included simple sorting options, so that users have more interactivity with the content. Thus, we decided to include “near me” , “latest” and a “random” sorting, catering to different preferences.
Voting screen
Creation screen
Profile screen
In this screen users are able to vote on the challenges created by other users. As users state yes/no to these challenges, they are removed from the screen and replaced by other ones constantly.
In the “creation screen” we wanted to allow users to give their challenge a title that would be self contained and easily understood. At this point in time, we were also considering allowing to choose the type of media (photo, video or audio) as well as adding a first example of a participation.
Within the profile screen we wanted to include the three main menus that were directly related to the user personally: account settings, the personal record of the user’s participations, and badges.
SEP OCT Paper Interfaces
Before defining the specifics of our application interface, we wanted to select a metaphor that would serve as the unifying element of our design.
Our metaphors were related to time, exploration, novelty and challenge, informing or inspiring the user as they use the interface everyday. We selected three metaphors at the end of this session, based on three main criteria. Having the strongest message in relation to our concept, Inspiring us the most towards developing meaningful interfaces, Being clearly distinct from other applications in the field.
Linear Thread
Subtle Sunset
Our thread metaphor would serve as a visual element to signify the passage of time. By moving a piece of thread, time could be seen as a line, and knots could signify special moments, such as the ones provided by our daily challenges.
Looking at the sunset is one of the most basic clues of time passage understood by humans.
Exploratory Atlas When we thought of discovering and sharing this experience with the world, the atlas metaphor immediately came into mind. Going through the participations of others is in a way like traveling around the world, seeing how other cultures interpret the challenges in a different manner.
Since one of the ideas we wanted to incorporate into our app what that the challenges should both break and infuse the user’s daily routine, we believed it would be interesting to explore an interface that would accompany the user throughout his day. This made the metaphor of a sunset very appealing, as it had the potential to connect with the user’s emotions on a deep but surreptitious
THREE PAPER PROTOTYPES Our next step in the design process was to create a great variety of interface ideas that would reflect our metaphors. We wanted to create interactions that felt new and inspired while making sure they were easy to use and understand.
our prototypes were created to
We sketched a great number of ideas for the various screens mentioned on the site-map and discussed their strengths and weaknesses as a group. Following this process we selected our best ideas and created 3 cohesive designs we believe clearly demonstrated and complemented our metaphors.
The different screens were hand-drawn on paper and the elements of interaction were cut to fit the iPhone frames we created.
simulate interactivity, giving users the closest sense of exploration as possible for a static image on paper.
Thread Prototype Our thread prototype was meant to convey a linear sense of time. It is based on an horizontal navigation, in which time flows from left to right (from past to present). This is represented by a minimal navigation thread that runs from a yarn ball. Its knots signify the different days, each with a challenge and corresponding entries. The user lands on the present day and is able to see the challenge as well as other people’s entries. In this prototype we decided not to include sorting options. Sliding the screen to the left leads the user into previous days, while tapping the yarn ball will open a calendar. The calendar view was meant to allow the user to quickly move to a point in the past. None of our three prototypes included the “profile screen” because we wanted to explore only the basic functionality at this point.
Finally, swiping right from the present screen, led the user to see the “future screen”, where they are able to vote on the suggested challenges by dragging the thread along their respective pins, tying them to the overall timeline. There is also a create button situated at the bottom of this screen.
Atlas Prototype In our Atlas prototype, we wanted to allow the user to fully explore the world and discover participations from other countries and cultures. This overall map navigation was tied to a more conventional bottom-tabbed menu which we wanted to test with users. It was important for us to test both new and established navigations to cover as many ideas as possible.
We created an “entry screen” where users can easily pan a map and move towards any destination. Upon landing on a location, the feed of images below would change to only participations from people around the scope defined by the map area. Clicking on the date on top would bring a drop-down menu with all past challenges, changing the entries of the map to the selected date.
Today’s “challenge screen” could be accessed from the left of the tab, while the “future screen” could be accessed from the right. In this “future screen” the voting mechanism works by sliding the finger left or right (meaning “no” and “yes” respectively), with the create button sitting at the top of the menu.
Sunset Prototype Our sunset prototype was designed to capture the passage of time, by showing a moving horizon on the Home-Screen. The horizon is represented by a color gradient, that shifts from up to down over the course of the day. We wanted the user to experience time passing in a non-intimidating way, which would help us give the user a sense of connection with application.
The gradient shift happens on the HomeScreen, where the challenge is presented and the user is able to participate. We experimented with a timer that would let the user know specifically how much time he has left to complete the day’s challenge. In this prototype, time is represented vertically, with the voting and creation features on top and the past challenges on the bottom (in relation to the Home-Screen). The user moves up and down by scrolling fluidly, while the the screens “snap” to each menu’s frame to present the content.
To visit other participant’s entries, the user swipes right from the Home-Screen. Within this screen, the user has 3 sorting options available: random, by proximity and by latest.
FIRST USER TESTING For our first user testing we wanted our participants to use all 3 paper prototypes in sequece, with the least information possible about how they would work. We presented them with a short description of our application and told them to use the prototype as they would on a normal phone. We used the “wizard of oz” method, by changing and moving screens as users tapped and scrolled through the menus. We selected 14 participants from around the M-ITI offices, with an overall high level of comfort with smartphone interfaces (from PhD students, to management employees). The participants went through structured 45-minute think-aloud sessions, attempting to complete defined tasks when prompted.
From the think-alouds we took hundreds of notes which we consolidated by affinity. First we separated findings based on each prototype, pointing out the strengths and weaknesses of each interface. Afterwards, we grouped all of those insights together into overall conclusions, which would form the basis for our next phase of prototyping. Our main goals with this user test were to: Evaluate opinions and attitudes towards each metaphor, Uncover major navigation problems, with special attention to the user’s mental models, Assess the participants’ opinions about the overall concept and its specific features.
Overall Interface
Major Usability Flaws
Our participants were more comfortable with the conventional Map prototype interface because it was similar to other applications they had used. The Thread prototype on the other hand, provided the hardest learning curve of the three, with users showing difficulty when swiping from one screen to another or accessing the calendar with the thread ball button.
The biggest usability flaws we encountered were related to the voting mechanism in the “future screen” on all three prototypes. Users thought the term “Voting” was not appropriate for the intended user actions (voting does not have a direct influence on what challenge might come next, as they will still be chosen by the sponsor’s team from the overall list). Furthermore, the swiping motions required to vote were not instinctively performed.
In regards to the metaphor, participants felt the Thread and Sunset prototypes had more inspiring and interesting interfaces, and selected both more frequently as their preference.
Another problem found on all three prototypes was related to the different sets of icons used throughout the interfaces, which were not clearly understood by most participants.
Specific Functionalities Each of the three prototypes had specific features we wanted to test out separately: the map navigation (on the Atlas prototype), the calendar (on the Thread prototype), time passing perception and sorting options (on the Sunset prototype). We found that users deeply enjoyed using the map, and frequently pointed out its importance in giving the application interactivity and enjoyment. Participants generally felt comfortable and pleased using the calendar. However, after explaining the 25 hours rotation cycle, we quickly realized that specifying dates and associating them with the challenges was incompatible with our rotation cycles
Our participants demonstrated a good understanding of time passing and of how much time they had left to complete the challenge using the Sunset prototype. People found the concept interesting and the interface relaxing. In terms of the included sorting options, users showed interest in choosing specific times within the challenge duration, the same way they were able to use the map in the Atlas prototype.
1st
interactive prototype
05
PROTOTYPE SCREENS SECOND USER TESTING
1st Interactive Prototype For our second prototype we wanted to create something that users could interact with directly on a mobile phone. This gave us deeper and more accurate insights into our interface and ideas. From the beginning of our design process, it became apparent that each paper prototype had clear strengths and weakness and that we should find ways of combining the best parts of each into a cohesive whole. We decided on an overall interface that would feature the main metaphor of the Sunset prototype, coupled with the overall navigation of the Thread and including the Map functionality of the Atlas.
OCT NOV
First Mobile Interfaces we
thought it would
be beneficial for our project to build this prototype using
Apple’s Xcode IDE and test it directly on an iPhone device.
While the paper prototypes allowed to gather insights on the interface metaphors and general navigation, it was important for us to offer a more complex and accurate experience of interaction with a phone. We started from quick sketches on the whiteboard and paper, exchanging ideas and opinions for different design solutions to most of the problems we found on our first user testing session. These quick sketches were refined and translated into digital designs to which we added color and early visual elements. Our designs were also inspired by the iOS design guidelines, to maintain consistency with user’s mental models of the platform.
PROTOTYPE SCREENS Home Screen In this prototype, our Home-Screen is very similar to the Sunset prototype. The background features a gradient of colors (which by concept would get darker as the day progresses) with the challenge, timer and participate button at the front. An hamburguer button at the top left corner of the screen leads into the profile screen. Swiping up will lead to the voting screen, while swiping down will lead to the entries screen, allowing the user to see participations from other people.
HOMESCREEN
Entries Screen The “entries screen” features 3 ways of viewing content: a randomized list of entries, a map interface (incorporating elements from the Atlas prototype) and a time selector (in which the user is able to scroll through the different periods of time (a feature suggested by our participants). The user is able to press the tab called “Previous” which will only show entries from the previous day. This limitation keeps the focus on the present, by not letting the user spend a long time surfing through entries from challenges that happened a long time before.
RANDOM
MAP
Voting Screen This screen offers the same functionality as the previously defined “Future Screen”. Since the term “voting” was confusing to our users, we decided to name this menu “Wish-list” which reduced the sense of immediacy in the voting process. We wanted people to vote on the challenge they prefer, but not feel that the ones they selected for the near future are direct results of their own choices. The “creation screen” can also be opened from within this menu, by tapping on the “plus” button at the top.
WISHLIST
Profile Screen Since we hadn’t included the “profile screen” on any of our paper prototypes, we decided it was important to test the badge functionality and simulating its experience at this stage. To accomplish this, we coded an event upon creating a challenge, where the user receives a badge and is prompted to find it within the profile menu. The personal log was also moved to this profile screen in order to simplify the overall user journey and increase usability, by associating it with other personal information.
BADGES
PERSONAL LOG
SECOND USER TESTING The second user testing was designed to have a larger, more varied group of participants, with different backgrounds and level of technology awareness. In order to accomplish this, we felt it was important to travel to other cities in Europe. Since the user testing timing coincided with the NordiChi 14, we felt it would be relevant that part of our user testing took place in Helsinki and Stockholm. This allowed us to attend the conference and take feedback not only from users, but also from successful designers in the field. Simultaneously, the remaining part of the team travelled to Lisbon, grabbing participants from various areas of the city.
In total, we gathered insights from 31 users, each test consisting of fifteen minute ThinkAloud sessions and brief interviews, using the interactive prototype on the iPhone. This user-testing session allowed us to: Evaluate the overall navigation and usability of our menus. Test the understanding of the concept using the clues embedded in our interface. Gauge interest in the concept and its individual features.
Overall Navigation However, our participants did not think of doing swiping interactions without any UI clues pointing to them. Furthermore, because the hamburger button was the only UI element present on the Home-screen, it led participants to believe it was the only available interaction. A significant part (over half) of our participants had difficulty knowing how much time they had left to complete a challenge, based on the clues we offered (the time slider and the number timer below the camera button).
Apart from navigating between screens, the specific interactions within each showed overall positive results. All participants correctly understood and participated on the day’s challenge, navigated through entries without any difficulty and were generally able to comprehend the swiping motions required for the voting process on the “Wishlist screen�.
Specific Functionalities We found that people spent most of the session time navigating through the different entries, especially on the random and map sorting options. They felt engaged and interested in these screens, and spontaneously offered us positive comments on the designs. On the other hand, we had a great number of participants questioning the interest of using the time selector sorting option. People consistently asked us to see a few more days into the past, rather than simply yesterday.
We also found a disinterest in the badge system, which felt unnecessary given the simplicity of the interactions, and the lack of user identity to drive competition. This reinforces the feedback we got on our Paper Prototypes. When asked about what types of media they would like these challenge to be based on, most people advocated that taking photos provides the right kind of effort and convenience for them, and believe it to be the type of media they were most likely to enjoy sharing with others.
2nd interactive prototype
06
PROTOTYPE SCREENS SECOND USER TESTING
2nd Interactive Prototype The biggest goal of our third prototype was to fine tune the usability of the interface, so that the different elements of our concept were clear and engaging since the first time the app is launched. We redesigned the overall navigation of the app, based on the insights and suggestions we got from our second user testing. We also re-evaluated some of our assumed to be relevant functionalities, and improved the ones our users demonstrated to have a biggest interest in. Finally, this prototype was submitted to a third user-testing session, that further explored the usability and appeal of our interface.
NOV DEC
Second Mobile Interfaces
our
main goal for the
second interactive prototype
was to refine the usability, by making sure our screens were truly easy to understand.
Our second interactive prototype is the result of a deep group discussion on how the navigation could be made easier for our users. The design decisions were made based on quick sketches on the whiteboard which were then translated to higher fidelity mockups on the computer. Our Xcode code was also rewritten to allow for the new navigation and its new features, and to incorporate the new design assets we created using Adobe Illustrator.
PROTOTYPE SCREENS Home Screen, Log & Past Challenges Our new Home-screen allows the user to swipe from the sides providing an horizontal plane of time. Past challenges (up to 4 days) are accessible to the left of “today’s challenge” and at the very end we placed a permanent log of the user’s own participations. At the top and bottom ends of the homescreen there are now 2 buttons, one which leads to that challenge’s entries, and one which leads to the wish-list. The user no longer swipes to access content and automatically is made aware of the navigation options.
PERSONAL LOG
PAST CHALLENGES
We give more emphasis to the user’s own participation by placing it directly on the home screen. Feedback is also provided on the days the user skips a challenge, using a visual cue. Sketch something on a napkin and take a picture of it.
Based on negative feedback on the badges, we decided to remove it from our concept, thus removing the need to clutter the interface with a profile screen.
this challenge is over
SKIPPED CHALLENGE
PERSONAL LOG
Entries Screen The biggest change we made on the new entries screen lies with the random screen, and the time selector, both of which we removed and combined into a single sorting option, which displays all participations either from latest to first or the opposite. This goes in line with what our users felt the timer selector would be most useful for. The map sorting option was also tweaked to show a target indicator, which more clearly defines the area of the map from which the entries are selected.
ORDERED ENTRIES
MAP ENTRIES
Wish List We greatly improved feedback given upon swiping challenges left or right to vote. Additionally, by focusing on photos, and by removing the need for the challenge creator to add an example, we were able to simplify the creation process. When the user votes on a challenge, that vote goes into the sponsor’s database. Everyday, the sponsor’s team will look into this database and pick one challenge amongst the top list (which is based on a long-running vote count, and not just from the previous day) to be sent out to people the following day.
WISHLIST
SECOND USER TESTING Our final user testing session focused on the usability refinements we made on the third prototype design. We tested the application with 10 users from a variety of backgrounds, from across the M-ITI and UMa campus, for 15 minute thinkaloud sessions, followed by brief interviews. These user tests resulted in dozens of notes which we consolidated into findings and led to the final refinements of our interface, delivered at the end of the semester.
Our main objectives with this user testing were to: Find out how navigability improved with our new screen designs, Discover what further information should be included, Identify possible new problems we might have introduced.
Overall Navigation
Home & Entries screen
Our overall screen navigation was very easy to understand for our participants. Coming back to each screen when requested was done quickly, proving that a correct mental model of the application was correctly transmitted.
On the “home-screen”, our users reacted positively to the emphasis we put on their participation. It was clear where the participation was positioned and they understood how every challenge screen would contain the participation of that day.
However, some users manifested some confusion over the overall timeline depicted in the “home-screen”, where previous challenges are shown immediately to the left of today’s challenge.
When asked about their interest in displaying the entries in order they felt it was logical and something they expected to have available. Users were able to swap orders easily.
Since we did not want to assign a specific date to the challenge (as previously explained, because of the 25-hour rotation cycle), some users were unsure of when these challenges had occurred.
The map interface remained interesting and the screen they spent the most time in. However, some still did not notice the entries automatically updating, which led us to further improve feedback on the final deliverable.
Personal log & Wishlist The new positioning of the personal log proved to be successful for our users, who were able to both find and identify its funtion. The overall aesthetics of this screens were also largely praised. The voting interaction within the wishlist screen was clearly easier to understand than before. Users were able to perform swiping motions voting on the different challenges and creating possible challenges for the future. However, these interactions would only occur after an explanation of the voting system. Many participants thought that the term“wishlist” adds confusion to an otherwise simple screen.
For our final prototype, we decided to correct most of the problems we detected on our user testings while also including some new UI elements we did not consider relevant to test. The major changes were: Including date of submission on the user’s participations (to increase understanding of time passed between challenges); Option to re-submit participations; Ability to expand images; Report and Download options for the photos on the “entries screen”; “Wishlist was renamed to “Challenge Ideas”; A “first use” tutorial was included to teach users about
07
g
concludin remarks
Concluding Remarks Over the course of the capstone project, our team has kept the clear vision in mind of improving mental well-being by inspiring people to complete tasks that will bring novelty to their day-to-day routine. We strove to be non-invasive in our approach, nonpervasive with our message, a non-commanding with our challenge suggestions. We wanted to respect the user’s individuality, by maintaining anonymity without fear of judgment. It was with these principles in mind that we wanted to close our capstone project with a few recommendations/suggestions that could help maintain the focus of this application throughout it’s development.
Avoid mentioning “mental -wellbeing”
Consider additional interface elements
One of the stronger insights we had from our research was that it is essential that our concept is not labelled as something that will help people improve their mental well-being.
Even though we removed the Random feature from the final prototype, in order to focus on only 2 very distinguishable experiences of entry browsing, we consider that it might still prove to be relevant for future iterations of the interface.
People mostly do not want to be considered, or consider themselves to be in need of help or change, and are more likely to participate in something that is “just for fun”, realizing the positive effects of that participation on their own.
We also believe that when the application accumulates enough past challenges, the personal log might be enhanced by adding search and filter elements, to help the user find more specific partitipations from the past. If there are user accounts, these participations could also be stored in a server.
Pursue a “native monetization” model During our design, we believed that any attempt at monetization has the potential to hinder the experience of the user and discourage him from using the app freely. In order to avoid this problem, we came up with the concept of Sponsored Challenges, which is described in the chapter “Defining Concept”. In this idea, we allow a sponsor to create their own separate challenge, which should be fun and non-product dependent. This is a form of “native monetization” which we believe is the ideal way of supporting the application without getting in the way of the concept’s goals.
Another form of possible monetization, which would require cooperation and consent from users would be based on categorizing each challenge with a set of separators (such as hashtags), selling the images produced to third-parties as stock photos. This is not necessarily harmful to most users, if care is taken in avoiding images that are personal or identifiable (perhaps the user can choose whether or not to make photos public).
Rollout other types of media With our final prototype, and based on user feedback, we decided to focus our design solely on challenges that require the user to take a picture. We suggest a slow introduction of other types of media, which would allow a greater variety of challenges and promote other forms of creativity. As found in our Concept Probe, this may require more effort than most participants are able to invest. We recommend that challenges with other types of media should be sent less frequently and with more time in between than picture-based challenges.
THE END
a ppendix
UI SPECIFICATION Personal log & Wishlist Log of participations (Personal Log)
Future Ideas for Challenges Screen
Previous Challenges (Max 4 previous days)
(Tap)
Your Log
Home Screen (Swipe right)
(Landing Screen)
(Swipe right)
(Tap)
(Tap)
Entries Screen (Ordered)
Entries Screen (Map)
Home Screen Tap to navigate to “Future Challenge Ideas” screen.
Indicates what is the Current “Daily” Challenge. Tap to activate camera feature, and to take a photo to complete the challenge. Indication of how much time is left for users to participate in the current challenge. Indication of how many pages the user is able to scroll (swipe) back to, and of where in that sequence they are.
Tap to navigate to the current “Entries”/participations screen, and see participations from people all over the world.
Entries screen (ordered)
Tap to Navigate back to “Home� (Current challenge screen). Title bar indicates the Challenge to which the entries were submitted.
Tap to see entries by location, on a Map. The entries list is ordered by the time the entries were submitted. Tap to invert the order of the list, to show the first entries submitted. Tap to see options to Report inappropriate participations, or download the photo.
Report Photo Download Photo
Information about the participation/entry, where it was submittied from and how long ago.
Entries screen (map)
Tap to close overlay. Tap to see entries by ordered list.
Tap to report inappropriate image.
Tap, hold and drag to move map, to center map on the location you want to see participations from. You can also use the pinch gesture to zoom in and out. The feed will automatically update with entries from the centered “target area� of the map.
Challenge Ideas Screen
Tap to close overlay.
Swipe item right to agree with (vote for) a potential future challenges, swipe left to reject (disagree).
Tap to open the “create your own challenge� screen, which could potentially become a challenge in the future.
Tap to navigate back to home screen (Current Challenge)
Previous Challenges (max 4 days)
Tap to navigate to “Future Challenge Ideas” screen.
Indicates what the Challenge was that day. Shows what you submitted for the Challenge that day.
Tap to navigate to see the “Entries”/participations screen, and see participations from people all over the world for that days challenge.
Log of participations (personal log) Tap to close overlay. Tap to go directly back to Home screen (Current Challenge). X
Your Log
Tap to open and view your past challenge participation in a fullscreen overlay.
Indiciates the title of a previous days’ challenge, and partially shows your participation.
Your Log
Visual Specification Icons / Shapes
Typography Maven Pro Light 200, Maven Pro Light 300 Pop-ups Report Photo
Share Challenge
Download Photo
Retake Photo
Entrie Information Section Ericeira, Portugal
August 30
FIRST USER TESTING
EARLY DESIGN VARIATIONS
SECOND USER TESTING
PROTOTYPE SPLASH SCREEN Prototype Team Spark
⋆ ⋆ ⋆ ⋆ ⋆ (2,126)
⋆ ⋆ ⋆ ⋆ ⋆ (2,126)
FREE
Description Break away from your routine and discover delightful moments of people’s lives around the world. Every day, our community will encourage you to participate in a challenge that we all take part in, like going out for a walk in nature. You can share a picture, video or audio recording of the experience with others. Create your own challenges for future days, or vote on others’ challenge suggestions. Do you want to be a part of something greater? Everyone who does the daily challenge contributes a meaningful experience for the community, while remaining completely anonymous. Join us in this refreshing journey by participating in today’s challenge.
HOMESCREEN GRADIENTS
THIRD USER TESTING
THE END