top of page
BloodHub
BLOOD DONATION MOBILE APP PROTOTYPE & CASE STUDY
01 Overview
TASK
Tackle a community service problem at the University of Washington that arises from information gaps.
PROJECT INFORMATION
BloodHub is a functional prototype of a mobile app for UW students that provides a centralized location for campus blood donation information. Information and advertisements regarding blood drives on campus lack cohesion and cannot be found in a centralized location. Additionally, students are not motivated to donate, or do not understand the impact or necessity of blood donations. A 5-week case study was conducted to inform our product development.
MVP PRODUCT FEATURES
-
Blood donation newsfeed
-
Map of campus donation sites
-
Calendar of blood donation days and times
-
A way to organize your own blood drive
-
Rewards system for donating
-
Messaging center for friends and nurses
MY ROLE & RESPONSIBILITIES
LEAD UX RESEARCHER & DESIGNER
I acted as the lead researcher and designer on my team for this project. I conducted a 5-week process to define key problems, develop methods to combat these problems, and create a fully functioning prototype solution.
-
Interviews
-
User personas
-
Style guide
-
User flows
-
Information architecture
-
Visual design
-
Prototypes
-
Usability tests
-
Heuristic Evaluations
-
Wireframes
-
Product video
-
Design Spec
Overview
MOST CREATIVE PRODUCT VIDEO AWARD WINNER
BloodHub
Play Video
02 Methodology
Methodology
METHODOLOGY
After establishing the topic of blood donations on campus, we conducted a 5-week process to define key problems, develop methods to combat these problems, and create a fully functioning prototype solution.
Phase 1: Conduct interviews
Phase 2: Develop strategies and low-fidelity prototypes
Phase 3: Usability tests and heuristic evaluations
Phase 4: Finalize high-fidelity prototype, product video, and design specification
03 Research
Research
STUDENT INTERVIEWS
Interviews were conducted with University of Washington students and a Washington State University student for comparison, in-person, over the phone, and through text message.
BLOOD DRIVE ORGANIZER INTERVIEW
Interviewed Wendy Chu, the BloodWorks Northwest UW Representative, via email to gauge an understanding of the current techniques and practices for engaging students to donate blood. Below are some of goals Wendy Chu wishes that could be implemented.
04 Personas
Personas
PERSONAS BASED ON INTERVIEW FEEDBACK
Created personas based on feedback from interviewees. The personas represent three potential categories of students and their blood donation habits.
1. The avid, but uninformed blood donor
2. The very busy, but occasional blood donor
3. The apprehensive or non blood donor
05 Solution
Solution
IDENTIFYING THE PROBLEMS
Our research led us to several conclusions:
-
Information/advertisements regarding blood drives lack cohesion and cannot be found in a centralized location
-
Students do not know when or where a blood drive is occurring
-
If students see an advertisement for a blood drive, they are left with little time to prepare or fit donating into their schedule
-
Students are not motivated to donate, or do not understand the impact/necessity of blood donations
-
Students who do donate, do not do so on a regular basis
While blood donation information might be disperse, it is often devoid of all necessary information, reaches only a select few students, and leaves students confused, with remaining questions. This means organization's calls to donate, often go unanswered or receive fewer donors than desired.
DETERMINING A MISSION
After identifying the primary problems surrounding campus blood donations, we determined that our focus would be to achieve three main goals.
The first overarching goal was to generate awareness in regards to blood donation and blood drive information. Next, we wished to attract potential donors through techniques that would motivate them to donate. Finally, with the first two goals established, we hoped to develop a strategy to create a routine donor.
CREATING A SOLUTION
Our solution is a comprehensive approach that combats all the issues students and organizations face in regards to blood donations, and enforces the goals that we created.
One app, one location, total blood donation awareness
Newsfeed:
A newsfeed of relevant blood donation information, tips, testimonials, and photos from peers will inspire and motivate those who would otherwise not donate.
Map:
A map of donation sites will inform students where a drive is happening on campus, what type of drive (in a building or in a truck), and have scheduling capabilities with a predictive wait time and preview of donor history questionnaire.
Calendar:
A calendar of blood drives will allow students to see when a drive is occurring in advance, see when they can next donate (56 days after their last donation), and have scheduling capabilities with a predictive wait time and preview of donor history questionnaire.
Organize:
A feature for campus groups to organize their own blood drives will make students feel more comfortable by donating with a large group friends and friendly faces.
Rewards:
A rewards system that tracks a user's number of donations, potential lives saved thus far, and offers rewards and giveaways at local hot-spots will entice students routinely donate blood.
Notifications:
A messaging/notification system will allow students to contact nurses with questions in advance of donating, coordinate with fellow students, a receive alerts, easing any apprehensions students may have.
06 Design
Design
LOW-FIDELITY PROTOTYPING
Our first step for incorporating our solutions into a singular app was to create low fidelity prototypes.
07 Testing
Testing
USABILITY TESTING
Assigned specific tasks for users and analyzed their approach, identifying any breakdowns.
Questions, Concerns, Comments, and Breakdowns:
-
Do you need a separate account for organizing a group blood drive?
-
Our home page should be the newsfeed about "Why to Donate," so it's the first thing people see.
-
Do not over-complicate the amount of options a user has, consider taking out the "Become a Member" feature.
-
Consider labeling or changing some of the icons.
-
The headers should be re-designed or minimized.
HEURISTIC EVALUATION
Taking the feedback from our usability tests, I created a high-fidelity prototype of our app using Figma and InVision. After creating the functioning prototype, I examined every feature, button, and link to identify and resolve issues.
08 Final Product
Final Product
INFORMATION ARCHITECTURE
Below is an overview of how each of our pages is connected within the app, and how users may navigate.
