– A sustainability project –

UX/UI CASE — UXER SCHOOL FINAL PROJECT

OVERVIEW:

Firstly, to understand why we decide to choose this topic to develop our final project, ‘Sarai’, one of the team member made a video with some verbatims from the personal interviews we made and more information that we found, and made us to finally create this project.

This is the video:

Duration : 3 months

Team: Isabel Bonilla Sánchez (Me), Sarai Cabanillas, Elisenda Solé and Roger Coll.

My role : UX/UI Designer, copywriter

METHODOLOGY:

To carry out the entire project, we use the Design Thinking work methodology, starting from the divergence, the search for all the information possible to find, and then filtering it through convergent thinking, and extracting the key insights for further development.

Source: https://www.digitalstockport.info/a-new-discovery-for-adult-social-care/double-diamond/

The double diamond is a dynamic process, where the structure is not linear, but moves forward or backward depending on the needs and problems that arise. In this way we can find and define the best solution.

THE PROBLEM — research and analysis:

Before starting the project, the mentors gave us a key advice that I would like to highlight before presenting the whole process and analysis, and this was: “You cannot fall in love with your ideas and solutions, to get to them in the first place you have to fall in love with the problem.”

In that moment we began to search for the real problem, not what we thought that it was .

Firstly, we began with a Desk Research through internet and some books that we had at home.

Secondary, to contrast all the information that we had found we did some personal interviews and online questionnaires to find the final insights from where we began to search for the solutions.

Here we were able to understand that there were notable barriers in people when it came to having more sustainable habits.

After knowing what people was worried about, we decide to generate our “How might we…?”, in this way we wanted to define in one sentence what we needed look for to find the solution.

‘How might we motivate people to make their sustainability experience easy, informative and fun?’

To answer that question we started by doing several brainstorming sessions and crazy 8's.

To focus on the needs of our users, we created a Buyer Persona that groups all the previously obtained discoveries. Defining this profile will help us throughout the process, as it is a good way to keep the user in mind all the time and not lose focus when designing the solution.

This is Narvi García, with environmental sensitivity as her defining characteristic.

Her main frustration is that she thinks her actions don’t have a big impact
On the other hand, she aims to raise awareness in her closest circle.

We define their Pain Points from the verbatims we had from our interviews, which are:

  • Fear that humanity will react late.
  • Frustration.
  • Eco-anxiety.
  • Unawareness.

And on the other hand, your Gain Points or wishes, which are:

  • Know its environmental impact.
  • To feel supported and accompanied in their mission to be more sustainable.
  • To have contrasted information at hand in a single digital point.

We created an empathy map to learn more about Narvi. This tool helps us to focus more on the user’s actions and feelings, we can get to know not only what frustrates her and what she wants, but also what she feels, thinks, listens, does, says and sees.

Narvi has had past experience with applications that also help with environmental awareness, but none have finished working for her.

Why can’t any app keep her interest?

To know this, we design a customer journey where we can see the experience she would has in our app, thus identifying key points and possible points for improvement.

THE SOLUTION - Ideation and business:

After all the research and content filtering process, we reached the ideation phase in which we were working intensively. We did a multitude of brainstorming in which we proposed all kinds of ideas, from which we were specifying and choosing by votes which ones were best suited to the problems we had obtained as well as being the most viable proposals.

Through this we came to the idea that our app had to have several stations, which covered as much as possible the deficiencies that we detected in the competitors.

  • To solve the problem of lack of information, we add a section where the app calculates your carbon footprint.
  • For the lack of habits and the demotivation that people feel, we add a section of challenges, there are from easier to more difficult, in this way people are improving according to their personal goals.
  • For people who feel that organic is expensive and difficult to find, we created the map section where it indicates the sustainable stores near you, in addition these stores can create their own challenges and customers get discounts if they do them.
  • Finally, for people who feel lonely, we decided to add a calendar where events considered sustainable are published, to which more people with related interests can attend and meet, and thus build community.

To carry out the ideas that we had defined, we first built our MVP (Minimum Viable Product), to prioritize the most important needs that we had to cover, where we would obtain the income, what was our main value proposition, our cost structure and our resources keys.

After that, we decided to focus on 5 key points as a value proposition:

  1. Personal satisfaction.
  2. Clear, easy to understand and reliable information.
  3. Accompaniment towards sustainable success.
  4. Network of sustainable businesses and initiatives.
  5. Proactive and sustainable community.

Once we know what we are going to offer, we start designing the wireframes and prototyping.

PROTOTYPE — A journey through the app:

1- WIREFRAMES.

Our first prototype is of low visual fidelity, in which we only show the generic concept, a part of the app where a first questionnaire is shown, which according to the answers calculates the user’s carbon footprint, the structure and the basic components of the design.

Within the organization of the wireframes, each one was including improvements that we were coming up with, and we were writing in post-its if we agreed or not with the changes, in this way we made the work much more dynamic between us.

2- BRANDING.

  • Naming:

Although choosing a name may seem like the easiest job of the entire process, it was the job that was the most difficult for us.

First, we did an individual name proposal for a couple of days.
After this, we were voting among all the names that we liked the most, we used different types (descriptive, acronyms, associative, etc.) to evoke the widest possible range of ideas and after squeezing our brains, the name ‘UEARZ’ came out.

UEARZ = U (YOU) + EARZ (EARTH)

To contrast our decision, we carried out a user test through an online survey, in which we listed the most popular names of our ideas, and finally we verified that, like us, the most attractive name was ‘UEARZ’.
With this name we intend to convey the values of the brand.

  • Colors:

To choose the colors, we started from the basis that they had to mention nature, and evoke its components. For this we chose colors that, in addition to that, fit with our vision and that convey kindness, closeness and freshness.

The main colors chosen were:

We also use the following colors as secondary colors for the illustrations and some buttons:

  • Illustrations:

For our app, we decided not to use iconography but instead use illustrations. Looking for inspiration on Behance, we discovered some illustrations that caught our attention due to their sympathy and rounded contour.
These were the Illustrations by Rodier Kidmann (Niceshit Studio) for Upper Hand. Based on his great work, we made some modifications and adapted them to our color palette.
With these illustrations we wanted to bring the app closer to a more fun and loving sense.

Illustration board on Figma
  • Typography:

We chose ‘Nunito’ as the main typology for its rounded contours that represent that kindness, closeness and freshness that we mentioned before.

We chose ‘Open Sans’ as a secondary typology for its simplicity and clarity.

  • Logo:

The logo was created from the illustrations of the rest of the app. We use one of them to turn it into the ‘U’, in order to follow the same aesthetic and transmit the same values that the rest of the components transmit. In this way, the value proposition together with the branding are unified to result in a coherent and attractive app.

THE APP : UEARZ

We are Uearz, a mobile application that helps people to be more sustainable, creating environmental awareness (both those who are just entering this field and those who feel “eco-anxiety”), calculating the real carbon footprint of each person on the planet and guiding the user in the process of compensating for that footprint.

What do we find in the app?

You will find improvement challenges at a personal, environmental and consumer level, an approach to sustainable business, as well as connecting our users with events and initiatives with a positive social impact.
These three types of actions will weigh on our carbon footprint, which is the center and guide of both our application and our users.

We start with the onboarding process, where the user can first enter the app without registering to browse it, or has the option to enter by creating an account to enjoy a better experience.
After registration, the user comes across a questionnaire in which we assess:
- Mobility
- Consumption
- Home
From here we can assess the carbon footprint generated by the user, and which is shown in the ‘HOME’.

Example of some of the questionnaire screens

Here is a precise calculation of the carbon footprint that the person generates. This is the environmental impact of his decisions and habits.
Here, values such as the impact saved are also represented, which is the compensation of the footprint, in addition to the money saved, all calculated based on a full year.
Here we find the lower navigation bar and access to the chat bot, it has an educational and motivational function.

The second screen is that of challenges, some aimed at creating new sustainable habits, others at promoting ethical consumption and respectful of nature and, also, supporting initiatives with a positive environmental impact.

It is important to note that each user has a personal ID with which we can verify certain challenges and make their carbon footprint change.

Another of the functionalities is the scanner, whose main objective is to give us information on the sustainability of the products, their type of recycling and alternatives for use.

And finally we have:

On the one hand, the MAP, which shows us sustainable stores, garbage cans, composting, and green points.

And on the other hand the AGENDA, with a monthly schedule of events that ensure the care of the environment and responsible consumption in your city.

In the app we have also included the ‘profile’ section, where you can find your achievements, your habits, your evolution with the app, and the points and discounts that you have been obtaining.
In addition to being where all the app settings are located.

THE END:

To conclude the project, we decided to compile all the information that we had learned in a free guide.

Click here to get it for free: https://edbeca91-3b1b-4897-81c5-1a435e144c94.filesusr.com/ugd/18615a_4f51575e432746d9a5b4dac73396e43f.pdf

Here is the prototype , see it and comment below what do you think about it.

All the feedbacks are always welcomed!

UX/UI Designer, specialist on Neuromarketing & customer behavior and Market researcher.