Vitality

A conceptual iOS app that encourages a sustainable lifestyle by creating everyday habits

Overview

It’s hard to imagine that your actions can actually have a positive impact on the world and help to combat global warming, which is why many people don’t put much effort towards a sustainable lifestyle. I certainly understand this mindset, being a 90’s kid that grew up in a rural town surrounded by cows and cornfields. How could it make any sort of difference on a large scale if I decided to recycle that bottle, or just throw it out?

However, if you were to influence 10 people around you to live more sustainably, and each of them were to influence 10 people, and each of them were to influence 10 people… The impact of your actions starts to spread and have a profound impact. After just 5 layers of this influence, 100,000 people would be living more sustainably. It’s like a pyramid scheme, except everybody wins.

It is becoming increasingly more important to act against global warming. I want to create an enjoyable way to show people that they really can make a difference and that it’s not as inaccessible as it may seem.

Tools Used

  • Framer X – Prototype
  • After Effects – Interactions
  • Sketch – Logo
  • Photoshop – Photo Editing

Objective

Show people that they really can make a difference by taking action against global warming and that it’s easier than they may think.

Target Audience

People who are concerned about the effect of global warming on the environment, but aren’t actively changing their lifestyles to combat it.

Competitor Analysis

I found 2 competitors to review based on the shared goal of helping users to live more sustainably. Each app has existed for at least 3 years and is unique in its features while sharing the main goal of sustainability and making a positive impact on the earth.

What it does well

  • Visualizes actions and encourages repeat actions
  • Explains why each action is important to the environment
  • Makes actions seem enjoyable and easy to do

What it could do better

  • The impacts that the user is making could be better visualized
  • It requires a lot of work to perform repeat actions
  • The user statistics are broken up into points, buzzes, actions, badges, and medals, which is a lot to comprehend

What it does well

  • Decent job of visualizing the impacts that users are making
  • Provides good descriptions of why each action is important

What it could do better

  • Onboarding questions are very difficult to answer (how much electricity does your household use in kwh/month, etc.)
  • Total impact screen has confusing visualizations
  • Take this action button isn’t very visually actionable or able to be used multiple times (once the user takes all actions, they are done with the app)

Survey Analysis

While I don’t have the resources to perform a widespread study on global warming, there are many reports from credible sources that contain data which will be helpful for me to create personas and feel informed enough to continue through the rest of the design process.

70% of Americans age 18 to 34 worry about global warming and 75% think that global warming is caused by human activities.

65% of participants believe that citizens should do more to address global warming

Survey participants seem to care less about global warming affecting themselves personally, and more about harming plants and animals, future generations, people in developing countries, and people in the US.

66% of global respondents say they’re willing to pay more for products and services that come from companies that are committed to positive social and environmental impact, up from 55% in 2014, and 50% in 2013.

Hypothesis

Turning small sustainable actions into everyday habits will encourage people to take bigger actions and adopt a more sustainable lifestyle.

Brain Dump

After brainstorming many sustainable activities and tasks, I organized them into 3 main categories: daily, occasional, and long-term tasks.

These daily tasks will become daily habits inside the app. Users will be encouraged to select a handful of them to commit to each day and will be asked to mark which ones they’ve completed towards the end of the day. Each task will be given points based on the environmental impact that it has.

  • No single use plastics
  • Coffee travel mug
  • Turn off electronics
  • Recycle
  • Compost
  • Turn off lights
  • Lower thermostat 3 degrees in winter
  • Raise thermostat 3 degrees in summer (change automatically based on location and season)
  • Bring lunch in a reusable container
  • Use refillable water bottles
  • Eat vegetarian
  • Carpool

These will be treated as extra points on any given day since most of them are not things that we can expect people to do every single day, but maybe once or twice per week. They will be placed at the bottom of the “today” screen so that people hopefully see them while they are feeling motivated to do more after completing their daily habits and seeing their points rise.

  • Choose paperless bills
  • Buy from environmentally conscious companies
  • Take leftovers for lunch
  • Buy secondhand
  • Bike instead of drive
  • Donate old clothes/goods
  • Carpool
  • Use washable metal straw
  • Air dry dishes
  • Shop local
  • Air dry clothes
  • Recycle old electronics
  • Plant trees
  • Borrow from library

These are tasks that are either much more expensive or much more labor-intensive. Either way, they take much more motivation from the user so I’ve decided to split them onto their own screen, “actions”, and nudge users towards them once it seems like they are somewhat invested in their daily and occasional tasks. These actions are also more impactful, so I plan on giving them recurring daily points since they all do continue to run on autopilot and have a positive impact on the environment daily.

  • Install solar panels
  • Install LED lights
  • Install a water saving shower head
  • Buy an electric car
  • Weatherstrip doors and windows
  • Better insulate house
  • Rain barrel for watering plants
  • Grow vegetables
  • Refer friends
  • Farm CSA program

Wireframe

Before jumping into any high-fidelity designs, I wanted to sketch out each of the main screens to wrap my head around what should exist on each screen, and what order it should all be in. I like to start by creating a list of every item that needs to exist on each screen to help prioritize and stay organized when working on the layout of each screen.

The main priority and the screen that needs to be completely frictionless is the Today screen. This will be the first screen the user will see after opening the app, and will hopefully help to form new habits. These daily habits need to be very quick to complete, but also enjoyable so the user looks forward to logging in each day and is motivated to add more.

User Flow: Sign Up

I wanted to keep the sign-up flow as effortless as possible, which is why I moved things such as turn on notifications, connect smart home devices, add friends, and add a photo into the onboarding portion after the account was created. This will hopefully reduce the amount of dropoff before the actual account creation.

Combining these steps will also allow the app to explain the importance of completing each task while they are being educated on how the app works. Without context or reasoning, a person may be understandably skeptical about connecting their smart home or adding their photo.

User Flow: Log In / Main Screens

There’s nothing revolutionary about this login flow, but I did want to include it along with the main screens. The Today screen will act as the home screen. This will be the first thing users will see after logging and it will be where they will complete their daily habits and accrue their points for the day. Team, Actions, and Profile will all have tabbed sections on them, which are listed below.

Long Press to Complete Daily Habits

To ensure that users only complete the tasks that they intend to, I’ve decided to require a long press for those buttons. The screen may get long depending on how many habits the user has selected, so this will avoid any accidental presses while scrolling.

Imagery

I believe imagery is important in humanizing the app and making it feel more personable, but I didn’t want the images to overshadow the content that is on each screen. The duotone image with a gradient overlay complements the content above without distracting from what is most important.

Today – Main Screen

The Today screen will be the first one that users see after logging into the app. It is where they will see and quickly complete their daily habits for that day, and up to 2 days previous. I limited this screen to the 3 most recent days to reinforce the idea that they should make a habit out of checking in each day and marking what they have done.

Welcoming Messages

These will change each day and show words of encouragement, praise, or just a friendly hello. This will help to build a positive emotional connection to the app.

Selected Habits

These will be chosen during the onboarding process, but new ones can be added at any point. Once the app detects that the user is consistently completing most of their habits, it will challenge them to add new ones. The idea is to start small, build consistency, and continue to build on what they have started.

Smart Home Automation

If the user connects their smart home devices, the app can detect things such as how many lights are on and what temperature their thermostat is set to. This way, it can put certain habits on autopilot.

Extra Points for Occasional Tasks

After completing their habits, they may see that they are only a handful away from their record number of points. This section is located right below the habits so that they can accomplish that and also feel encouraged to take one or two additional sustainable actions each day.

Actions

The action screen is made up of long-lasting tasks that usually require more of an investment of time and money. Users will earn recurring daily points for each action, and these generally have a bigger impact on the environment than habits.

Categories

The actions are split into 5 categories: Energy, Food and Drink, Transportation, Water, and Shopping.

Recurring Daily Points

The bigger the impact on the environment (in terms of CO2 savings), the higher the daily points. Since these actions make an impact daily, they are automatically added to the total points on the “Today” screen.

Community Engagement

Showing users how many other members will hopefully make each action feel more accessible and encourage them to give them more of a serious consideration.

Team Engagement

If the user’s friends have taken an action, it will be listed instead of the community engagement message. This should be even more encouraging.

Separate Completed Actions

After each action is completed, It will be moved to the bottom of the screen and shortened. Instead of the description, it will show the total number of points accrued to give them an overview of how impactful it has been.

Describing the Importance of the Action

Some people may not have a full understanding of why things such as “Weatherstripping your doors and windows” are so important. In this overview, a quick explanation can be made and an estimate of the CO2 savings will be included.

Putting the Savings Into Context

Listing the potential CO2 savings is great, but unless you study science, the numbers may not mean much to you. Here, we can use beautiful imagery to help explain the savings in comparison to more tangible things.

Trusted Companies

Users may be interested in installing solar panels, but may not have any idea where to even start. Trusted companies can be listed here, and affiliate discount codes can also be included to give users an extra little nudge to take action.

Team Encouragement

Reinforcing what was shown on the actions screen, users will be able to see if any of their friends have completed the action.

Team

The main purpose of the team page is to give users an overview of how their friends are doing. If they see that their friends are consistently completing all of their habits, it may encourage them to do the same or even top them.

Leaderboard

Based on points earned, the top 3 users of a friend group will be shown here.

Daily Summary

There’s nothing revolutionary about this login flow, but I did want to include it along with the main screens. The Today screen will act as the home screen.

Link to Profile

Anywhere that friend’s photos and names appear will link to their profile.

Profile

The profile page will serve 2 functions – The “All Time” tab will serve as their public facing profile, and the “Week, Month, Year” tabs will contain data to show the user their personal progress.

Statistics

These will show a quick overview of the user’s friends, habits, actions, and total points. These will all open a modal to give more context.

Progress and Timeframe

This section will update each day to show how long the user has been a member, and an estimate as to how much impact they have made.

Weekly Progress

The user’s habits will be shown in this tab with a visualization of how many times they have completed each one out of 7 days.

Monthly Progress

A similar visualization of the habits will be shown here, along with a summary of the user’s impact per month.

Yearly Progress

This tab will start with a summary of the user’s impact for the year, as well as any standout statistics such as Longest Streak and Actions Taken.

Comparison to Average

This graph will show how they are doing each month of the year as compared to average. It’s difficult to comprehend CO2 emissions data but as long as they are in the green, that is what is most important.

Impact

The Impact screen will show the overall impact that all of the app’s users have made combined. The numbers will continue to grow, the comparisons will update, and new slides will show as important milestones are reached.

Some More Projects

Dive Pool

Southtowns Dental

The Giving Project