Group 237.png
ezgif.com-video-to-gif-3.gif

Let's make small steps

that can lead to 

big impacts to our environment!

Consrv is an app dedicated to educate people about the environment and inspire the next generation of activists and change-makers.

Timeline: 3 weeks (2018)

2 months (Dec 2020-Jan 2021)

Group 237.png
ezgif.com-video-to-gif-2.gif

Our Mission

Consrv aims to untangle the complexity about environmental data and enlighten people to take action.

 

Consrv is committed to educate and make learning easy and engaging in order to encourage people to take small steps that can make significant impacts. 

The Problem

We live on a planet with finite ecological and natural resources, yet too many of us are living beyond our means.⁠ ⁠How can we slow down the degradation of our environmental resources and drive society into making more sustainable decisions? 

 

Climate change has been a major issue for many years now and yet there are still a lot of people who denies the existence of environmental degradation. Research shows that more than 97% of scientists actively publishing in the field agree that climate change is real and human caused. However, in this thread and series of responses from “climate change deniers” shows that there are people who still invalidates science reports about our environment.

"On February 21st, 2012, John Cook created a thread in the Skeptical Science forum discussing an article published in the Wall Street Journal. This article, written by 16 people Cook labels “deniers” and “climate misinformers,” was a response to criticisms regarding a previous article those authors had written."

 

Amongst those criticisms was this comment:

Research shows that more than 97% of scientists actively publishing in the field agree that climate change is real and human caused.

ezgif.com-video-to-gif-3.gif

Key Points

Although there are many issues that we need to unpack regarding climate change, we can't grow complacent and wait for the world to change. Individual action could lead to big pivotal changes.

Instead of focusing our energy on "climate change deniers" and non-believers of science,

we can take this time to educate ourselves and inspire our community to do the same and together we can take an action.

Consrv believes that real change starts with education and it can lead to positive action  →

How can we democratize credible information about climate change and its root causes?
How can we learn about issues that affect our community?
How can we make simple changes to our lifestyles to make it more sustainable and not harmful?
How can we take more action and go beyond reading about these issues?

Sustainability isn't something you buy, it's a lifestyle

Bamboo toothbrush, metal straws, sustainable brands have been dominating the media since the rise of environmental issues due to the response of corporate responsibility.

 

A lot of people have expressed that to be sustainable or to even care about the environment is a privilege. However, this is not the case. It doesn’t and shouldn’t cost much to be sustainable.
 

Survey

A survey of 50 participants indicates that there are 3 main ways they are able to consume digestible content about the ways they can take action and become sustainable.

 

Do you believe in Global Warming?

YES
NO

Are you updated on Climate Change issues?

YES
NO
meatqalist-jumbo.gif

After publishing a poll on various social media, participants responded that most of the information about climate change, sustainability, and other environmental issues come from social media itself and only 20% navigate their way to the full articles and news about the posts.

90% of my audience answered YES and 10% answered NO on this prompt.

 

70% of my audience answered YES and 30% answered NO on this prompt.

 

*My audience demographic consists mainly of millennials and gen Z who are 45% social justice activists while the rest are creatives, or past co-workers from old jobs who prefer not to participat/engage in social/environmental movements.

How are you learning about

Environmental issues?

SOCIAL MEDIA
NEWS
OTHER SOURCES

How would you prefer to learn about it?

POSTS
VIDEOS
APP

Which apps make it easy for you to learn?

DUOLINGO
QUIZIZZ
TRIVIA ROYALE

A lot of participants answered some of the following:

1. Through reposts (of environmental posts) from friends on instagram

2. Graphic design posters on insta

3. News accounts on insta (rarely talks about environmental issues though)

4. Youtube videos

5. Tiktok videos about food or thrift shopping

6. Influencers promoting thrift shopping and ethical & sustainable brands

7. Medium articles

8. Random articles friends would send

 

Based on the answers on the previous post, I did a quiz form to see how many people go to certain social media to learn. Through this, I hoped to see which format people like to consume information.

 

Key Notes

Based on my findings, some important key words arisen. Potential users want to learn in ways that are: 

Digestible
Re-shareable
Easy vocabulary
More Visual
Relatable
Leads to action
Accessible
Free
Interactive

Design

Process

In order to untangle the complex information, heavy data, and jargons that have far too long dominated the web, I have to design solutions that will make learning engaging and easier to digest & understand. 

 

Frame 6.png
Survey
Frame 1.png
User Cases
Frame 2.png
Ideation
Frame 3.png
Design System
Frame 4.png
Design Iterations
Frame 5.png
Prototyping
Frame 7.png
User Testing

Persona | User Cases

Who am I designing this for? What situations are they in and what problems are they encountering that limits their ability to seek more information about the environment?

And how can we design experiences that can work for many different personalities?

Based on some of these personas and their cases, we can assume that most of them are open to learning and are in some way or form already making small steps to take action towards sustainability. This is mostly due in the environment they are in and the information they have available to them like social media or other resources. However, besides open-learners, I also want to find a way to encourage people who aren't exactly fond of learning to still look forward to using the app.

Frame 88.png

Frustrations:

Wants to volunteer more (beach cleaning, tree planting & marathons for a cause) but don’t know where to go to find places to volunteer to. Interested in reading about plastic polution.

Motivation & Goals:

Reads or watches youtube videos about the effects of plastic and other waste on polution. Tries to recycle and separate trash but lives with roommates who are not interested in doing so. He wants to share his learnings to them so they can have a less wasteful household.

Frame 89.png
Frame 90.png

Frustrations:

Not too into social media because it’s time-consuming and distracting. Wants to learn more and share knowledge with her mentees but don’t know where to find good resources that everyone can enjoy.

Motivation & Goals:

Hopeful for the next generation to continue the change we’re hoping to create. Would love to expand their knowledge on the subjects and incorporate that to my teachings with them apart from being their mentor. Would also like to find ways to coordinate events in our org that encourages people to care about the environment and take action.

Frustrations:

Lots of PR packages get sent to my P.O. box without me partnering with them, thus accumulating excessive packaging I don’t support. I want to find a way to encourage brands to lessen their waste and to further educate my audience about the damaging effects of fast fashion, eating meat, food/consumer waste and other environmental issues.

Motivation & Goals:

Motivated to disrupt the brand influencer industry and challenge brands to make more sustainable products. I’m also dedicated to educate my audience more and would like a place to facilitate more changes.

Frame 91.png
giphy.gif

Ideation

In 2018, I took an Intro to Interactive Design class at AAU as part of my Graphic Design course. In there, I was tasked to create an app using the skills we learned in Adobe XD. View the full case study from 2018 here ⇣

1/14
Group 237.png
ezgif.com-video-to-gif.gif

Design 1

Since it was my very first encounter to UI/UX design, I was met with many challenges and ended up being ultimately unsatisfied with my project. This prompted me to come back to this and approach it with a more experienced and skilled lens.

 

Using my skills I gained from working at Meemo, I was able to take a deeper look at my process and iterate on it. However, the values, goals, and motivations for Consrv remained. I still wanted to take a more gamified strategy and adapt behaviors and experiences from my favorite apps like CoStar, Duolingo, and common social media to the whole experience.

Frame 63.png

Design 1

Reflections:

What's working?

Minimalistic Design

Good Concept of having daily, weekly,

and big tasks

Profile/Onboarding is super simple

What's not working?

Not using monospace type for body text and other areas (might only work for Costar lol)

Use better colors to repair the contrast issues in most screens

Use buttons, tags, and icons as part of the navigation instead of relying to texts

Placing information and other elements into cards to make it a one unit

Gamify each section to make the experience more fun and rewarding for users

Organize the elements better and pretend there’s actual data that must fit in that container or area

Design

Round 2

Frame 69.png
Frame 2.png
Frame 1.png

Iteration 2

iPhone 8 - 74.png
iPhone 8 - 74.png
Frame 90.png

After a few wireframes and design roughs, I came up with the Version 1 of the new Consrv. However, after taking a closer look and prototyping it, I realized that there are some areas of repair.

Using my learnings from Meemo in creating our new design system as we prepared for the Version 2 of our app, I went back to the drawing board and tried to identify the areas to improve.

I need a solid design system to make each element effective and make it more visually cohesive. Using familiar patterns can also help with the entire UX and lessen the user's need to learn new behaviors in the app.

Gamify each section to make the experience more fun and rewarding for users. Although the initial designs are already using this strategy, it needed more and well-defined structure to make the entire experience more engaging.

Frame 80.png

Some benefits of a Design System:

There are many ways to customize component features through variants on Figma, so creating adaptable elements will expedite the design process.

Instantly insure greater speed and consistency. Reduce production delays. Use a flexible framework of tested components. Increase your ability to focus on crafting in key areas.

Iterate on ideas faster, close more projects, and provide better workflow balance for design teams. Hand-off to development with pixel-perfect accuracy.

Deliver more consistent products while reducing risk and enhancing predictable roadmap estimation. Speed up project sign-off with a single source of truth for brand consistency.

Design

System

Color Palette

Slide 16_9 - 1.jpg

Typography

Slide 16_9 - 3.jpg

Components

Slide 16_9 - 2.jpg

Design

Round 3

MacBook - 7.png

Consrv's

Main Features

Group 237.png
ezgif.com-video-to-gif-2.gif

Onboarding

Consrv's onboarding takes you to 4-5 splash screens showing the features and expectations a user might find in the app.

Signing up & logging in is as simple as connecting user's Facebook and google account. Sign up consist of typing an email and password. After this, user's might be asked to verify their email account.

Group 237.png
ezgif.com-video-to-gif-3.gif

Home Screen

& Search

Consrv's home screen shows the user an overview of their activities from the moment they signed up. It summarizes their activities into sections and provides them with data about the points they recently earned. Users will also have a daily digestible story-format trivia or news.

Group 237.png
ezgif.com-video-to-gif-4.gif

Lessons

The lessons feature adapts a gamification strategy that users are familiar with through apps like Duolingo, Google survey, and others. Lessons allow users to pay attention to the information presented on their screens, I try to achieve that through the use of buttons and disabling them until the user finished the task or certain time limit to read/watch the lesson. 

There are no wrong answers on lessons, every user has a chance to gain points which they can use to donate to organizations. Lessons is all about learning and paying attention so people can absorb the information better and be more motivated to apply this to their lives.

Group 237.png
ezgif.com-video-to-gif-5.gif

Groups

Campaigns

Volunteering

This screen allows users to navigate through available groups, campaigns, and volunteer opportunities around their area. Each card goes to a full screen page where they can read more about the opportunity and I also featured related references that corresponds to the tags associated to the picked card.

MacBook Pro - 1.png

Website

Homepage

Desktop - 1.jpg

Lessons

Desktop - 2.jpg

Impact Report

Desktop - 3.jpg

Consrv

Timeline: 3 weeks (2018)

2 months (Dec 2020-Jan 2021)

When designing products, we all must promise to be for both people and planet always. 🌍

Consrv is an app dedicated to educate people about the environment and inspire the next generation of activists and change-makers. 💪🏼

Consrv aims to untangle the complexity about environmental data and enlighten people to take action. 📚

Consrv is committed to educate and make learning easy and engaging in order to encourage people to take small steps that can make significant impacts.  🌿

Reflections

& Lessons

You can never have too much iterations. ✨ Iterate ad infinitum!

Design system is essential to move projects faster for greater consistency and usabiity. 🙃

Update your portfolio when you have a new project. Don't wait years til you're "good enough" cause sometimes the portfolio takes longer than the product itself hehe 😅

You don't always have to re-invent the wheel in everything. Know what already works, if something doesn't work, then that's when you look for other ways or perspectives where it can work.

If you're not using your daily apps and observing the UI & UX, are you really a UI/UX designer? 🥴

Don't spend too much time on perfecting a high fidelity mockup, present multiple wireframes, iterate fast, solve problems better.

Ask your peers for feedbacks. Get your mother, sister, or instagram fans to test your designs out. People like them will be the ultimate users of these apps anyways 💪🏼 

Do not use Monospace type, this only works for more hip apps. If you want people to be able to read the information, go for a classic Sans Serif 😀

Use your past learnings from past projects to make new projects better! Explore your potential through passion projects if your creativity is limited at work. 😎

Writing takes a long time, dedicate energy on crafting good language because that will greatly impact the UX of your product. Research and draft ad infinitum! 📝

Iterating on user flows can be mentally taxing, make sure to take breaks and have snacks nearby. 😅

Take it easy on yourself. 

Take breaks.

A rested brain is helpful in generation the creative juice that will give the best roi for your creative process. ❤️