Case Study: Sustainable
You’re at your local grocery store about to check out when the cashier asks, “Would you like to purchase bags?”. You regretfully accept, knowing yet again you forgot your reusable grocery bags at home. How many times and how many instances does this happen in a day, and how much waste do we actually produce?
Sustainable is an iOS app that helps eco-conscious consumers practice sustainable living by competing with their friends in various challenges.
To preface, this is my capstone project as I am just wrapping up my 12th week at BrainStation’s UX Design full time program. This has been an incredible experience and I cannot wait to get my hands dirty in the tech industry. Get ready world, I’m coming for ya!
Starting with the first section of the double diamond: Research + Discovery
Key Research Insights
77% of people want to live more sustainably, however, there is a gap when it comes to practising. Why is that?
More secondary research shows that 34% say that they lack the knowledge while 53% say that affordability is a key factor.
Problem Space Refinement
What were some constraints, goals, and measures of success I had to outline for this course of this project?
Technological Constraint
- Incentive to keep a digital solution regarding sustainable living when articles and forums litter the internet
- Technically quantifying an individuals total waste
Business Constraint
- Sustainable living is an expensive investment; single use waste is designed to be convenient and cheap
Sociocultural Constraint
- Sustainable living is a small community that needs support
- People are lazy and sustainable living requires proactive planning and action
- Lack of knowledge regarding proper and attainable waste-free living
Goals
- The goal is for individuals to properly dispose their consumer waste by adopting sustainable living practices.
- It is imperative to show users qualitative and quantitative information about how their waste directly affects the environment and their future.
Measures of Success
- When users log their sustainable efforts and reveal how their practice has impacted the environment.
- When users compete with each other to manifest sustainable habits
Target Audience
- Young professionals with disposable income
- Proficient in technology
- Eco-conscious
Taking all of this into consideration I developed my first proto-persona. Someone who is based off of assumptions prior to UX conducted research.
Please meet Courtney:
Market and Competitors
What is working on the market? What isn’t working on the market? On a broader “birds-eye” scale, there are a lot of habit building apps, and a lot of apps that map sustainably conscious businesses to support but not a lot of sustainable guides.
I smell opportunity!
Primary Research
My job as a UX designer is to start with why — this is where I conducted my personal UX research including in-person interviews as well as an online survey. This would help me further develop my persona. I confirmed at the beginning of each interview and questionnaire that the interviewees fit the following criteria (my target audience).
Interview Criteria:
- 18–35 years old
- Eco-conscious consumer
- Struggles to maintain a sustainable lifestyle
- Has disposable income
Interview questions varied from general What does sustainability mean to you? to more specific What efforts have you made towards reducing your personal waste?
Moving onto the second section of the double diamond: Synthesis
A plethora of data was collected from the online surveys that was combined with the in-person interviews. Two questions I asked outside of the scope were, “What apps do you use the most on your phone?” and “How much would you spend on starting a sustainable lifestyle?” to understand how my users interact with mobile apps and how dedicated they were to making this change. The results are as follows:
This information will play into later decisions when looking into UI inspiration. 95% of users have social apps on their phone — this told me that people like to be connected.
I categorized relevant content from the interviewees into users behaviours, motivators, and pain points. Further organization allowed me to see these grouped in themes and insights.
The top three themes and insights are below with the main insight being planning:
People struggled to plan ahead of time which led to personal waste. Actions such as forgetting your reusable water bottle, running late and averting carpooling, etc.
This is where I experienced my first major pivot.
After analyzing my data I realized I interviewed users who already practice sustainable living, however struggle to maintain the lifestyle. Who I should have interviewed were people who have a desire to be eco-conscious, but don’t know where to start. Because of the time constraint and the nature of BrainStation’s course, interviewing a new group that fit the modified criteria was not an option so the direction of my design had to pivot.
Meet Jessica:
I’d also like you to meet Jessica’s friend Dustyn:
These two make up my primary and secondary persona. As you can see, both users encompass the wide range of levels of sustainability.
This brings me to my “How might we…” statement:
How might we guide users who want to live sustainability so that they ultimately reduce their waste.
In order to ensure both personas fit within the scope of the how might we, I used the term guide to help direct users in their sustainability journey while leaving it open ended and free to interpretation ~ambiguous, am I right?~.
The next stage in synthesis was the experience map. This is Jessica’s journey of her commute to work and forgetting her travel mug at home. You can see that there are two areas of opportunity: when Jessica forgets her tumbler and when she feels guilty throwing out her disposable cup. I focused primarily on forgetfulness as it highlighted the users personal actions rather than opening another door in regards to municipality recycling protocols.
This is where I experienced my second major pivot.
This experience map highlights users who were forgetful which addressed the original theme when conducting UX research: planning. However, if I went down this route, the app would essentially hold the user accountable by being a glorified reminder companion. During my UX research users found that they were living this lifestyle alone — to combat both forgetfulness and loneliness I pivoted the major theme to accountability. This allows users to hold each other accountable to a sustainable lifestyle rather than the product doing the work.
Moving onto user stories, and considering all of the information gathered above, the stories were formatted as “As an eco-conscious consumer, I want to ___________, so that _________.”
I populated about 30 user stories and categorized them into four themes with the major theme being guidance.
I am proud to say that when you look back at the original How might we question we are still in line!
How might we guide users who want to live sustainability so that they ultimately reduce their waste.
Finally, what was the task flow I wanted my users to embark on? I’m quite familiar with various task flows considering my engineering background so this was an exciting part of the journey for me.
You can see that the empty boxes and diamonds on the outside are not linked or removed entirely. The colours stages are the new task flow because my original task flow was too dense for a simple task flow when moving into the ideation part of process. Therefore, I had to lighten the load.
Moving onto the third section of the double diamond: Ideation.
UI Inspiration
You can see that in my InVision moodboard a lot of my inspiration came from the app called Fabulous. It is a habit building app that assigns individual challenges based on your area of focus. The dot system I used on to indicate when users had completed a task for that day. I also got a lot of inspiration from Apple’s Wallet app and Notes app where the cards stack on top of each other for when users decide to embark on multiple challenges at one time. Finally the Duolingo app had a fun and playful, achievements page with small injections of colour in their icons which I liked to show users their progress.
Sketches
To begin my sketches, I used various UX tools like crazy-8s. Below is a sample of my sketches (had to be selective here or else you’d be scrolling for hours):
Moving from my sketches to wireframes which you will see below in the first rounds of user testing.
Moving onto the last section of the double diamond: Prototyping.
Once the wireframes were completed I conducted two rounds of user testing and three rounds of iterations. Users matched my interview criteria and mimicked being my primary persona Jessica who’s task was:
Start your first sustainability challenge and challenge your friend.
These were the results of my user testing:
The main learnings I found from my user testing was copy is so important. The most discrepancy I had was when it came to the copy of my CTAs. The display was fairly intuitive and users were able to decipher what was being displayed however they were stuck of various screens because they were unsure of what buttons to press when being guided through the task.
Finally — colour injection and visual identity!
Again, I used InVision’s moodboard tool to convey the visual identity I wanted for my product. I picked four descriptive word when collecting assets: clean, balanced, living, simple.
I extracted colours from the moodboard and came to my primary brand colour along with my neutrals.
I had introduced a complimentary colour (as a secondary colour) because I wanted options for my app, however, I realized that it did not match the vision I had, so I reverted back to one primary colour with neutrals.
Next I began sketching out my brand name. I picked four descriptive words to guide my sketching: clean, organized, composed, earthy.
After consulting with my peers the most popular logo was designed in sketch.
The able part of the logo is highlighted to emphasize to users that you are more than capable of living a waste-conscious lifestyle.
I began injecting colour into my wireframes and found it difficult. I believe that simple designs are effective so I wanted to be selective with where I used my primary colour. After consulting my advisor, I decided to use the primary colour for my CTAs while using secondary colours to match the theme of the various challenges.
The final part of this academic capstone mobile app was to create a UI library. If that sort of thing excites you, let me know, and I can send you my hard work. ツ
Marketing Website
I played with Principle to work with my marketing website. I believe a simple design can shine when motion is added and motion was something I found myself get lost in. There were various iterations of this marketing website, however, what I want to focus on is the responsive design. I took this Desktop HD design and made it into a responsive mobile web design by following grid standards and learning how to stack sections and displays into carousels.
Multiplatform Challenge
I decided to work with the Apple watch when converting my app to another platform. How many times are you on the go and forget to record progress on your phone until the end of the day, even the next day and in some cases you’re too late. The beauty of the Apple watch allows users to record achievements on the go like, “Did you remember to bring your reusable water bottle today?”
Learning Outcomes
- Copy is important. The majority of my issues when user testing came to the copy used to guide users in their task. What made sense wasn’t always clear to users
- Comfort in the the ambiguity. I honestly did not know where my solution would take me during 75% of the process. Right up until the final iteration. I am used to coming up with a physical solution with my engineering degree, so that was a challenge trying to make my product purely digital without a tangible product but that made it all the more interesting.
- Don’t get attached to an idea. I struggled to reframe my challenge cards and venture outside of the bubble style I originated. I kept rearranging the content on the cards rather than getting back to the drawing board and considering alternate methods.
- This is not a business…yet. Since we were in an academic setting our product didn’t need to make money per-say. However, as we went through the course we were challenged with the idea of if this product went to market, how would it make money? This forced us to think beyond the scope of the class and consider other tasks to make it a viable business. Key stakeholders? Promotions?
- Pivots are a good thing. They might be uncomfortable but I liked the idea of it opening new doors. I would sometimes get caught up in trying to make something work when it was clearer to take a step back, or ask someone next to you if another route made sense.
Future Thinking
How do I continue to develop and grow this product? How do I make it adaptable so that it stays current? How do I reach a larger audience?
This was me in our final group discussion in regards to our capstone project. We all grabbed a tarot card of tech and I got the Service Dog. How can Sustainable empower the underserved? The tarot cards help us direct future thinking. I believe that if I put more emphasis on the “money saving” portion of the app it would help the underserved who believe that disposable is cost effecitve. I would also like to explore options allowing the new demographic to exchange product or appliances to prevent waste in a sharing community; introduce new challenges that help users connect and save money simultaneously.
Thank you!
Thank you, thank you, thank you. I cannot thank BrainStation enough for all they’ve taught me and my friends (who knew you could connect with 50 some-odd creative brains so fast — thanks Winter Cohort 2020). I could not have accomplished this much, this fast without my advisors, peers, family, and friends. You have all been so supportive and I am so grateful.
Don’t forget to bring your reusable water bottle tomorrow!
