Hope in Action app screens on phone mockups

Digital product design

Hope in Action

An app that coordinates reliable news, volunteers and donation centers so aid reaches people faster after a disaster.

Method
Design Thinking
Platform
Mobile app
Outcome
Interactive prototype

Overview

About

An application designed to provide reliable, up-to-date news while coordinating volunteers and donation centers to ensure that aid reaches those most in need as swiftly and efficiently as possible.

Hope in Action home screen on a phone

For the development of this product, a design process was carried out using the Design Thinking methodology, executing each of its phases in order to achieve an exceptional user experience.

Method

Design process

Design Thinking, from research to an interactive prototype. The ideation phase carried most of the work.

Discover

  • Secondary research
  • Hypothesis
  • Pain points

Define

  • Data analysis
  • Insights
  • Problem statement

Ideate

  • Brainstorming
  • Service definition
  • User persona
  • Storyboard
  • Customer journey map
  • Service Blueprint
  • Moodboard

Prototype

  • Wireframes
  • High-fidelity design
  • Interactive prototype

Discover

Problem

Climate change is multiplying disasters: extreme weather, floods, heatwaves and threats to food and water. And the aid that follows often doesn't reach the people who need it.

Haiti 2010 - Earthquake30%

Of the international donations were wasted due to lack of coordination.

USA 2005 - Hurricane Katrina40%

The aid did not reach its destination on time due to the overload of distribution points and logistical infrastructure.

Philippines 2013 - Typhoon Haiyan500k

People tried to help without the proper coordination, which caused difficulties in channeling the aid.

USAID Study+40%

Donations during the first few weeks after a disaster consist of unsolicited goods.

News clipping about climate disasters News clipping about climate disasters News clipping about climate disasters News clipping about climate disasters News clipping about climate disasters News clipping about climate disasters News clipping about climate disasters

Define

Insights

Hypothesis: people who want to help after a disaster often lack the organization and information to make their support count.

Volunteers rarely have training in crisis management.

Aid arrives late because people lack the organization and information to act on time.

Without reliable information, people donate the wrong products and can't organize requests and shipping.

Pain points behind them

  • Low empathy: some only help if they get something in return.
  • Misinformation and fake news about the real situation.
  • Poor information on real needs leads to the wrong kind of help.
  • Some exploit disasters for money or followers.

Misinformation and lack of empathy make it hard for a community to get the aid it needs in a crisis.

Define

Challenge

How could we guarantee useful and up-to-date information during a crisis, ensuring it reaches the public in time to optimize donations, improve transportation, and facilitate the effective coordination of volunteers in the affected areas?

Child in a disaster area
Hope in Action welcome screen: an app designed to offer reliable, up-to-date news and coordinate volunteers so help reaches those who need it

Ideate

Concept service

Our application is aimed at individuals with informational interests and participation in non-profit activities. It provides a comprehensive platform for mobile devices, focused on disaster-related information, allowing for the collection and exchange of real-time information between the different actors involved, such as those affected, NGOs, and volunteers.

How does it help users?

  • Access to reliable information
  • Centralization of data
  • Crisis monitoring in affected areas
  • Route maps
  • Provides information on collection centers
  • Interaction platform

What is needed for its development?

  • News verification
  • Information categorization
  • User interaction
  • Accessibility to information
  • Agreements with entities in charge of donations

Attributes

  • Reliable information
  • More effective voluntary actions
  • Synthesized information and news
  • Quick access to nearby donation points

Ideate

User persona

Luis Molina

Systems engineer · 27 years old · Madrid

Motivations

  • Wants to help quickly and effectively when an emergency occurs.
  • Looks for reliable information on what is needed and where.
  • Would like to see the impact of their help, whether by donating or volunteering.
  • Prefers technological tools that facilitate the coordination of efforts.

Frustrations

  • Feels frustrated when aid does not reach those who truly need it.
  • Does not always know where they can be most useful.
  • Is concerned about transparency in the management of donations.
  • Sometimes struggles to disconnect from work to dedicate more time to social causes.

Interests

  • Volunteering
  • Reading
  • Nature
  • Video games
  • Social causes
Portrait of Luis Molina, a smiling young man in a navy sweater with his arms crossed

Ideate

Customer journey map

Seven moments, from hearing about a disaster to helping on the ground. Feelings rise once reliable information appears, and dip wherever trust or logistics break.

Feelings across the journeyHigher is better
  1. Finds out

    Feeling low

    Too much unverified news.

  2. Gathers information

    Feeling low

    No clear way to help.

  3. Discovers the app

    Mixed feelings

    News feels hopeless and unreliable.

  4. Researches

    Feeling positive

    Unsure what's really needed.

  5. Donates or volunteers

    Mixed feelings

    Doubts that donations arrive.

  6. Takes action

    Feeling positive

    Blocked or unclear routes.

  7. Participates

    Mixed feelings

    Unclear instructions, exhaustion.

See every action and pain point
  1. Finds out

    Feeling low

    Actions

    • Learns about the disaster.
    • Wants to know more about what happened and to help in some way.

    Pain points

    • Sadness from information overload.
    • Uncertainty from unverified information and fake news.
  2. Gathers information

    Feeling low

    Actions

    • Searches the usual channels: social media, YouTube, the internet.
    • Finds plenty of information but still doesn't know how to help or how to filter it.
    • Comes across an app that covers what's happening and downloads it.

    Pain points

    • Desperation: too much information and no immediate answers.
    • Doubts about wasting time on an app that might not work.
  3. Discovers the app

    Mixed feelings

    Actions

    • Registers and shares their current location.
    • Explores the sections and finds the recent news.
    • Visits the forum to see what others are saying.

    Pain points

    • Most of the news is sad and not very hopeful.
    • Overwhelmed by what people post and comment, unsure if it's true.
  4. Researches

    Feeling positive

    Actions

    • Realizes many people need help.
    • Learns what affected people need and what the situation is like on site.
    • Decides to help and finds the options to donate or volunteer.

    Pain points

    • Overwhelmed by negative information.
    • Doubts whether product and area information is up to date and reflects real needs.
  5. Donates or volunteers

    Mixed feelings

    Actions

    • Weighs the best way to help.
    • Checks donation conditions, the products needed and the collection points.
    • Looks up volunteer requirements: where to go, experience needed, schedules and tools.

    Pain points

    • Fear of committing to something they've never done.
    • Doubts that donations reach the people who need them; collection points are far away.
    • Unsure they have the physical and emotional strength.
  6. Takes action

    Feeling positive

    Actions

    • Chooses a zone that has received the least help.
    • Packs what they need and heads to the meeting point, checking routes on the way.

    Pain points

    • Road closures and vehicle conditions may block access.
    • Fear of forgetting equipment.
    • Suggested routes aren't accessible, with few options to reach the destination.
  7. Participates

    Mixed feelings

    Actions

    • Receives instructions from the coordinators.
    • Carries out the activities.

    Pain points

    • Doesn't fully understand the instructions.
    • Physical and emotional exhaustion from the work.

Ideate

Service blueprint

Man worried after learning about a disaster
Finds out about the disaster.
Man reading news on a tablet
Gathers more information.
Finger tapping a phone screen
Discovers the app.
Volunteers joining hands
Takes action.

Frontstage

Networks
Volunteers
Influencers
Information Channels

Backstage

Communicators
Developers
Programmers
UX Designers
Volunteers

Support process

System Assistance
Geolocation
Route Optimization
Information Registration

Ideate

Information architecture

Getting in

  1. Hope in Action
  2. Onboarding
  3. Sign upLog in
    Email, Google, Facebook or Apple
  4. News filter
    National · International · All
  5. Home

From Home

  1. Map
    1. Donation place filter
    2. Donation places
  2. News
    1. News filter
    2. News search
    3. News summary
      1. Full article
  3. Forum
    1. NGO posts
      1. Chat with NGOs
    2. NGO search
  4. Volunteering
    1. Volunteering options
      1. About the activity
      2. Apply to volunteer
  5. Profile
    1. Notifications
      1. On / Off
    2. My information
      1. Personal details
    3. Emergency contacts
      1. Edit contacts
    4. Device pairing
      1. Pairing info
      2. Pairing
      3. Pairing feedback
    5. Log out

Prototype

Key flows

From the first launch to an emergency alert: the main flows of the app, screen by screen.

Prototype

Design

High-fidelity screens, ready to try in the interactive prototype.

Hope in Action high fidelity screen Hope in Action high fidelity screen Hope in Action high fidelity screen Hope in Action high fidelity screen

Measure

How I'd measure success

The research showed help failing in three ways: wasted donations, unsolicited goods and aid arriving late. Each metric below tracks one of them.

North star metric

Matched help

The share of donations and volunteer sign-ups that answer a verified, open need. It only grows when people help with the right thing, in the right place.

Time to first match

From the moment a need is published to the first donation or volunteer committed to it. Targets the aid that arrives too late.

Completed sign-ups

Volunteers who finish registering and show up at the assigned point, not just those who tap "Help".

Verified updates

The share of news confirmed by an NGO or coordinator, and how long verification takes before it reaches the app.

Guardrails

  • Reports of false or outdated information.
  • Donations still arriving for needs already covered.
  • Extra workload for coordinators who verify requests.

First experiment

A pilot with one NGO during a local emergency or drill: one group donates from the app's live list of needs, the other through the usual channels. If the app is working, unsolicited goods should fall well below the 40% the USAID study found in the first weeks after a disaster.

Next steps

What I'd validate next

The project ended at the interactive prototype, before testing with users. These are the tests I'd run before building it.

Usability with real helpers

Can a first-time volunteer or donor find where help is needed and sign up without assistance? Moderated sessions with five to eight people per profile.

Trust in the information

Validate the news verification flow with NGOs and coordinators: who confirms each update, and how quickly it reaches the app.

Field conditions

Test the key flows on weak connections and older phones, the way people use them in the middle of an emergency.