HOPE

HOPE is a user-friendly platform that allows people to quickly sign up for volunteer and charity opportunities.

About this case study

HOPE is a UX/UI project that I started when I was doing my Google UX professional course.

The idea behind this project is simple.
How to make volunteering fun and simple?

My Approach

Without diving much into the UX methodology.

Instead, this is what I did.
Reference > Planning > Wireframe > High-Fi > Prototype

Reference

Looking at other volunteer site, analysis what are their pros & cons

Planning

Incorporating the lively colour yellow into my design, I want to create a sense of happiness, joy, and energy that effortlessly accompanies the act of volunteering.

Wireframe

I took the time to create a wireframe to map out the layout and elements of my page. This step allowed me to plan and organize the overall structure visually.

High-Fi

Using the layout I established in my wireframe, I started adding design elements to each frame.

To keep the design clean and user-friendly, I applied Gestalt Law principles.
This helped me organize the visual elements in a way that made them easy to understand and navigate.

Prototype

To make the site more fun and interactive, I created some interactive components that feel natural and engaging.
Ensuring that each micro-interaction is fun and interactive.

Wireframe

High-Fi Design

Landing Page

The "Sign Up" Call-to-Action (CTA) button on the landing page encourages users to create an account if they haven't already.

Onboarding

The onboarding section help users in customizing their volunteer experience based on their preferred causes and skill sets.

Volunteer Registration

Users are presented with volunteer events that align with their preferred causes during the onboarding process.

User Profile

The profile section serves as a centralized hub for users to stay informed about their volunteering journey, track their impact, and gain insights into their overall contributions.

Prototype

HOPE Prototype
Feel free to check out my prototype in the link above

Chaik Hong © 2023

Design and built by myself with love & sweat
using Figma & Webflow