Enjoying the Outdoors, Together!

Using storyboards and wireflows to continue iterating on methods to increase the motivation to go outside

After completing our brainstorming session, our team decided to develop a prototype that focuses on leveraging social motivation to go outside and enabling greater transparency around tracking users’ “progress.”

In order to further understand our users’ motivations, we decided to create storyboards and wireflows that focused on the prototype goal of social motivation and transparency.

Motivating questions 🤔

After refining our prototype’s goal, we discovered a few questions that needed to be addressed before beginning the next prototype iteration. We centered around the most pressing questions given the focus of our project:

  • Does caring for a cute avatar provide enough social motivation or do users need to be connected to friends or other real people?
  • Our initial intervention study revealed that the nudges were not very effective. Our initial prototype excluded nudges altogether — should we be looking for a middle ground?
  • Our default weekly outside goal is set to 120 minutes/week. Should users be able to adjust this goal? Should we implement a minimum time goal?

Considering these questions, our team each created individual storyboards and wireflows in an attempt to address the question from many perspectives.

Storyboarding ✏️

The storyboard focuses on the “Product as Hero” which highlights our product helping a user fix a problem. I made the following storyboard about a user referred to as “Social Wanderer” who is motivated to go outside in order to take care of her avatar.

Storyboard for the Team Refresh’s outdoor app (template from “Storyboards Help Visualize UX Ideas” by Rachel Krause)

Upon completing the storyboard, I reviewed the structure with one of our interviewees who strongly influenced our “social wanderer” persona (See “Personas and Journey Maps for Outdoor Engagement” for a more detailed description). The social element of the story resented with her: “I would do anything for my friends, so taking care of myself is easier when I feel like I’m connecting with my friends.”

The interviewee also gave her own perspective on one of our central questions. She shared that although the avatar is motivating, she would be most sustainably motivated by connecting with other friends on the app.

Initial Wireflow 🌀

Given the feedback received from one of our participants regarding in-app social interaction, I began reflecting on different elements to include in our initial wireflow. I knew including an external social component and a flexible weekly time goal would be important after receiving interviewee feedback. In order to gain more clarity on the potential wireflow, I created a task flow to better visualize the various moving parts:

Task flow including social motivations and a flexible weekly time goal

After creating the initial flow, I was able to translate the chart into a low-fidelity wireflow sketch. The wireflow included additional options for external social connection:

Wireflow including the additional social element and flexible goal setting

Notes from this wireflow:

  • Each week, users can choose their weekly time goal with a minimum of 30 minutes ⏰
  • The user can choose to complete an individual goal (i.e. only accountable to the avatar) or a social goal (connected to others in their network) 🥅
  • Users can choose from a network of friends to create a shared goal together (note: both users must accept the shared goal) 👭
  • In the social setting, users can view the entire group’s progress 📈

Next Steps 👠

This wireflow addresses the question of social accountability. The user has the option to choose a social or individual goal depending on personal motivation needs. Regarding the social component, we have to determine the various dynamics at play, such as the mutual acceptance of a proposed goal, how many users can participate in a shared goal, and the synchronous constraints of a whole network starting the week at the same time.

Finally, although this wireflow addresses many of our original questions, the next step is to determine how to best incorporate nudges, or if we want to incorporate them at all.

Image by Dmitry Gladkikh (source: Unsplash.com)

stanford symsys & hci