Giver Be App — The world needs more ideas like that

Leonardo Sampaio
7 min readJan 5, 2019

This is a real client project, part of the professional portion of my Work-Study UX program in Vancouver, Canada.

About the project

Giver.be concept is to connect volunteers to people who needs them. Users can offer help as a giver or ask for help as a receiver, and be found by others.

My Role

My role was to undertake user interviews, surveys, user flows, low fidelity mock-ups and testing. The UI portion of the project was led by the others two designers.

UX Designers:

Leonardo Sampaio e Ranul Kamboj

UI Designers

Hugo Manhani and Gonzalo Hernandez

Timeframe

6 weeks

Platform

Mobile app -MVP

The Design Challenge

Giver.be´s CEO adressed us the challenge to design an app where users could easily give/receive help based on their skills, location and availability of time.

We needed to be very careful not to come up with beautiful and creative design pieces that could be hard to code and implement. During the whole project, we were constantly in touch with the UX and Web Development tutors from our Design school.

We jumped into all the Design Thinking stages such as different types of research, personas, user journey map, user stories, mock ups, high fidelity prototyping and testing.

During this 6 weeks project, we learned so much from testing the prototype. Considering the insights captured in testing, we kept revisiting the screens in a back and forth cycle that showed us that many of our assumptions were mistaken.

THE OVERVIEW OF ALL STAGES OF THE PROJECT

Research

Interview with the founder

We had meetings with the client to understand his goals, expectations, budget and other informations that helped us through the whole design process. Take a look at some of his inspiring sayings:

Our client linkedin page

“Most App feeds are focused on consumption. I´d love to see a feed focused on motivation, education, inspiration to finally make real human connections.”

“I want to transform the habit of scrolling into something meaningful, rather than just liking pictures on Instagram.”

Domain Research

My team and I downloaded and browsed through the main competitors apps (Simbi and Fivers) and made notes on what to improve, what to avoid and we learned with their “mistakes” so we could design a better experience for the users.

Here´s a very brief overview of the findings we´ve got from the competitve analysis:

User Interviews

At our Design School, we selected people with different education backgrounds/needs and collected some of our main findings:

Surveys

SURVEY´S QUESTIONS SAMPLES

As for the statements, we´ve aplied the LAKERT SCALE, following the below:

  1. Strongly agree
  2. Agree
  3. Neutral
  4. Disagree
  5. Strongly disagree
SURVEY´S STATEMENTS (LAKERT SCALE)

Survey´s insights

The results brought up interesting findings that helped us to come up with ideas for the prototype. I listed some of them:

  • 86% of people have already done volunteer work before, at least once.
  • The majority of people would practice their passion as an unpaid activity.
  • The 3 main triggers to people start volunteering was: passion, gain of experience or the love of helping others.
  • People are more likely to help after being helped

Planning

  • Affinity map to categorize interests by passion and business
  • Personas by User Profile
  • Users Journeys to map their thoughts, feelings an action throughtout navigation.
  • User stories to built narratives and understand users goals and motivations.
  • User Flow for both personas

Afinitty map

We used affinity Mapping for open ended question and tried to categorized them into three divisions — Passion, Help and Startup/Business.

While gathering information, we found that it was quite challenging for us to divide them into three subdivisions. On the one hand, there were people who answered very specific needs like: “ I want to help someone with event management because that’s my passion”.

On the other hand, few answered very generally stating: “ I want to make people happy”, or “I just feel good when i´m helping someone in need”

In the course of the project, we realized we´d have to come up with something dynamic; like hashtags, which could allow users to have freedom of “creating” or “selecting” anything from random to specific rather than just selecting from categories.

User Personas

Right from the beginning, we knew there would be two personas representing GIVERS and RECEIVERS. So we went back to the users interviews findings to define the personality and the need of each persona.

User Journeys

User Stories

  • As a startup owner, I want to access the LinkedIn of the candidates through the app, so that I can select a committed and talented junior designer to help me in my business.
  • As a busy professional, I want to quickly post the project requirements, so that I don’t waste time searching and the right candidates can reach out to me.
  • As a volunteer, I want to search on a feed with a lot of options so that I can find the perfect place to help.
  • As an employer, I want to access LinkedIn using the app to recommend people that helped me, so they can get exposure to more job opportunities.

Low fidelity Design

INITIAL MOCK-UPS ON THE WHITE BOARD

Mock-ups

I hand sketched some of the main screens considering the must have features we would like to include.

We organized the sketches on the white board in a logical sequence of navegation so we could imagine the possible paths the user would take. That was the initial flow.

User Flow

Main Feed

We came up with a solution to keep the content on the main feed divided into tabs with specific colours: (GIVERS ALL /RECEIVERS)

To create a post as givers or receivers, the user would only have to tap on the specific tab. Simple solution that was confirmed during the testings.

Giver Be App Features

  1. Login option. Narrowed down to facebook, linked in and gmail allowing users to login in different plataforms.
  2. Settings: gathering the most important events users have on the app: favorites, matches and chat windows.
  3. Favorites: giving the option to the user to tap what they´d like to see later.
  4. User verified: was a must have feature to verify that givers have the right skills.
  5. Match: When accepting the help, the match happens and automatically a chat window is enable.
MATCH

The chain of help

In my opinion, this is the coolest feature of all! It´s what brings beauty to core of the project, so we created the chain of help to keep the things going on, going forward and spreading love :)

Once the volunteer work is completed, GIVERS can also suggest volunteering activities that the RECEIVERS may have the right skills to do. With this feature, we encourage receivers also to provide help to others, creating a positive cycle in the app interactions.

CHAIN OF HELP

Testing

We quickly figured out that “Filters” would be more visible and easy to access in the main screen. We also added a shortcut to “Favorites” that before testing was a bit hidden.

Prototyping

Time to take a tour on our app! Thanks for your time and I hope you enjoy the journey on our prototype :)

--

--