Relief Hub

Side Project

My Roles

Prototyping Lead – conceptualization, user research, field observation, kiosk design (physical + digital), wireframing, low-fidelity and high-fidelity prototyping, branding

team

Nina Yu, Min Li, Martica Manuel, Alvin Zhou

tools

Figma, Procreate, Inkscape, Laser Cutting, Physical Prototyping (Plywood)

Timeline

Jan – Mar (10 weeks), 2025

Overview

Created for DSGN 100, the Relief Hub is a conceptual first-aid kiosk designed to provide rapid, self-guided care in crowded entertainment venues. Our solution streamlines symptom-based support through a digital Figma prototype paired with a mockup physical kiosk model. Built after extensive user interviews, field observations, and iterative testing, the design addresses long wait times, lack of knowledge in first aid, and confusion during urgent situations. Relief Hub empowers users to quickly locate, understand, and use medical products—without needing expert assistance.

Problem exPLORATION

Initial Research

Our secondary research revealed the significant health risks associated with entertainment venues. Over a 10-year period, nearly 70,000 people were seriously injured and 232 died at approximately 300 outdoor music festivals. Additionally, around 60% of festival-goers reported consuming drugs or alcohol, with alarming findings that 6 in 10 fentanyl-laced pills contain a potentially lethal dose. These numbers highlight the urgency of accessible, on-site medical support.

User Research

To better understand the user perspective, we created detailed personas and storyboards illustrating common scenarios—such as dehydration, minor injuries, or confusion during medical emergencies. We then conducted 5 interviews focusing on users’ first-hand experiences and their reactions to the storyboarded situations.

Personas

My Drawn Storyboards
My User Interviews Affinity Mapping

Through affinity mapping, we uncovered several key insights:

  • Exhaustion and hydration are common at large-scale events
  • There are staff and medical tents for assistance, but help is often delayed due to crowds and long lines
  • While many users have basic first-aid knowledge, few are familiar with available medical services at events
  • Users desired:
    • Step-by-step visual guidance (e.g., video tutorials)
    • Emergency contact functionality
    • Basic first-aid items with images and clear descriptions
    • A searchable interface to quickly find items

Key Findings

  • Young people are going to festivals, raves, and sporting events, but aren’t well prepared in handling potential incidents or injuries
  • Long lines and crowds at entertainment venues hinder the response time of getting medical aid

There is currently not an efficient system to get quick medical aid at entertainment venues.

Mission Statement

Our mission is to enhance safety and reduce urgent medical incidents by creating a system for easy access to rapid assistance, to ensure a more safe and enjoyable experience for all entertainment venue goers.

Problem Statement

How might we create a more efficient system for receiving medical aid at entertainment events?

Goal

Goals

  • Enable fast and easy access to first aid in crowded public spaces
  • Minimize stress and confusion during health-related incidents at events
  • Reduce reliance on overburdened staff by enabling self-service assistance
  • Provide a clear, accessible option for contacting emergency services when needed
  • Brains

    Challenges

  • Crowd density and slow medical response times made it difficult for users to access help quickly during events.
  • Users lacked familiarity with basic first-aid procedures
  • Uncertainty around what products to use made self-service intimidating
  • Long symptom questionnaires caused stress, especially during urgent situations.
  • Design Solution

    Ideation / Planning

    Contextual Focus & Field Observations

    Petco Park Field Observations

    Due to logistical limitations, we selected Petco Park, a major sports stadium, as our observational site. Though not a music festival venue, it mirrors many conditions we were designing for: large crowds, high foot traffic, noise, and long walking distances. Our goal was to understand how physical constraints, traffic flow, and environment could affect kiosk usability and placement.

    We identified several strategic placement zones for the kiosk:

    • Near exits and restrooms for accessibility
    • Along less crowded paths to avoid congestion
    • Near rest areas, where users could take time to assess symptoms

    Early Concepts & Physical Planning

    My Initial Sketches

    Using insights from fieldwork and user needs, we created early physical sketches to explore the kiosk’s form and features. Our focus was on clarity, safety, and minimal friction, especially in stressful scenarios. Key ideas included:

    • Taller structure with clear medical signage to make it easy to spot in a crowd
    • Blinders on either side to create a sense of privacy while interacting with sensitive content
    • Accessible layout, with reachable screens, dispensers, and payment methods for users of all heights and mobility levels
    • Minimal, intuitive interface for fast navigation in stressful situations

    These sketches informed the final design of both our Figma digital prototype and full-scale physical kiosk, which together demonstrate how users would locate, navigate, and receive help through the system.

    Prototypes

    Physical Prototype

    Mini Material Test Prototypes
    Final Prototype Wrapping Process

    To prepare for final fabrication, we first created several small-scale material test prototypes. These mini models helped us evaluate laser cutting precision, joint measurements, and material durability before committing to a full build.

    Due to material and space limitations, we were restricted from constructing the entire kiosk structure. Instead, we focused on building the key interaction areas — including the touchscreen zone, item dispenser slots, and payment section — ensuring that all critical user-facing features were represented.

    The full-size prototype was made using plywood. Due to limited resources, we wrapped the structure in thick paper stock to mimic the appearance of a polished metal kiosk. An iPad was installed in the screen area to simulate the touchscreen interface during demonstrations.

    This approach allowed us to test the kiosk’s physical usability, accessibility, and user flow within realistic constraints.

    Digital Prototype

    User Flow

    To structure the user experience for Relief Hub, we developed a low-fidelity flowchart outlining the kiosk’s main interaction paths. Our goal was to design a process that supported both quick item searches and guided help through symptom checking, while prioritizing emergency escalation when necessary.

    Two main user flows for finding items:

    • Search Flow: Users could quickly search for a specific item, add it to their cart.
    • Questionnaire Flow: Users unsure of what they needed could take a short symptom-based questionnaire. This guided users toward recommended products based on conditions like dehydration, heat exhaustion, or minor injuries.

    Checking Out

    • If the item carried health risks (e.g., medications like Narcan), a warning disclaimer would appear before finalizing the purchase, ensuring informed use.
    • QR code displayed on the screen after checkout to provide step-by-step usage instructions easily accessible on mobile devices

    Lofi User Flow

    Feedback & Improvements

    Pain Points

    We conducted a feedback session with four interview participants using our low-fidelity (lo-fi) prototype. Each participant was given two tasks: one using the search flow to locate a specific item, and one using the questionnaire flow to receive product recommendations based on symptoms. We found that:

    • Search feature was quick and easy to use, but was weak in discoverability. People preferred it to be prioritized above the questionnaire.
    • Unclear of what to do in emergency
    • Questionnaire may be too long and stressful for emergency
    • Symptoms page was hard to read and distinguish
    • Insufficient information for items

    Implementations

    Based on feedback from user testing, we made several key refinements to improve clarity, usability, and emergency response within the kiosk interface:

    • Prioritized Search: Moved the search bar above the questionnaire for better visibility and ease of access.
    • Clear Emergency Guidance: Added step-by-step prompts for emergency actions and next steps.
    • Reordered Questionnaire: Placed critical questions (e.g., responsiveness, substance use) at the beginning incase for emergency situations.
    • Real Product Info: Replaced placeholders with accurate item data, dosage, and usage instructions.
    • Symptoms Page Plan: Considered integrating symptoms into search flow; not yet included in the hi-fi prototype, but prioritized for future development.

    Final Designs

    Next steps

    • Do more user testing iterations
    • Rework hierarchy/order of questions to minimize questionnaire length
    • Reframe symptoms page as search for a easier and faster experience
    • Present a quicker and more straightforward way to determine an emergency

    Takeaways

    • Designing for urgency requires simplicity, clarity, and fast decision paths.
    • User research revealed that discoverability and stress-levels directly impact usability.
    • Iterative testing refined flows to suit both non-experts and high-pressure scenarios.
    • Physical prototyping helped test spatial accessibility and real-world kiosk presence.
    • Resource constraints taught us to prioritize core interactions in prototyping.