Project Overview:
Challenge
Despite the ongoing need for blood donations, there was no user-friendly digital tool to simplify the process, provide clear guidance, and engage donors with incentives. Many potential donors were discouraged by outdated systems, lack of accessible information, and a fragmented donation experience.
Solution
Initiated by Asociația Trei Vieți, the Trei Vieți web app was designed to bridge this gap, offering a seamless way for users to find donation centers, track their donation history, and receive rewards for their contributions. Built as a mobile-first web app, it prioritized accessibility, making it easy for anyone to engage without requiring a native app installation.
Status
While the design phase was successfully completed, the project has been temporarily paused before its full implementation due to external factors.
Modernizing Blood Donation for the Digital Age
Problem Statement & Goals
The Problem
No streamlined digital platform helped users locate donation centers, schedule appointments, or track donations.
Many potential donors were discouraged by complex, outdated systems or a lack of information.
A diverse user base required an intuitive interface accessible on various devices.
Users needed a way to securely verify their donations and receive updates without manual input.
Why a Web App?
Developing Trei Vieți as a web app rather than a native mobile app was a strategic decision based on accessibility and user behavior. Since blood donation is not a daily habit but rather an event that occurs every few months, requiring users to download and keep a dedicated app on their devices would have been an unnecessary friction point. Instead, a mobile-first web app provided a seamless experience without installation barriers, making it easy for both first-time and returning donors to access essential features on demand.
Additionally, a web app ensured cross-platform compatibility, allowing users to interact with the platform from any device—whether a smartphone, tablet, or desktop—without being limited by operating system constraints. This approach also facilitated easier updates and maintenance, ensuring that donors always had access to up-to-date information and functionalities without the need for manual app updates.
Goals
Create a seamless, mobile-first experience for on-the-go users.
Ensure intuitive navigation for a diverse audience.
Enable real-time donation tracking via institution-linked authentication.
Launch a successful pilot program in Iași before expanding to other regions.
Understanding Donors: Insights That Shaped the Experience
Research & Key Insights
With no direct competitors, research focused on:
Create a seamless, mobile-first experience for on-the-go users.
Ensure intuitive navigation for a diverse audience.
Enable real-time donation tracking via institution-linked authentication.
Launch a successful pilot program in Iași before expanding to other regions.
Key Findings
85% of users preferred a web app over a mobile app to avoid installations.
Many users wanted a “one-click” experience with minimal form-filling.
A significant percentage of donors used their phones for scheduling but expected access on desktop as well.
Trust and verification were key concerns: Users wanted their donations to be recognized automatically.
Frictionless Donor Verification Made Simple
Verified Donor Login
To ensure donations were verified and users received accurate updates, the app introduced an authentication system linked to donation centers.
How It Works
1. Users sign up with basic details and select their donation center (starting with Centrul de Transfuzie Sanguină Iași in the pilot phase).
2. After donating, the institution verifies the donation and links it to the user’s account.
3. Users log in with a simple OTP-based system (no passwords needed).
4. The app automatically updates donation history and rewards based on verified donations.
This system ensures a frictionless experience, making it easy for donors to track their impact while preventing fraud.
Mobile-First, User-Focused: Designing for Every Donor
Design Process
Wireframing & User Flows
Designed an intuitive mobile-first navigation with thumb-friendly tap areas to enhance usability.
Prioritized a minimalist UI with large touch targets and clear CTAs to guide users effortlessly.
Created a centered narrow layout (mobile-like container) to ensure a consistent and familiar experience across all devices, from mobile to desktop.
UI Design
Crafted a clean, modern interface with a focus on accessibility, using high-contrast colors and legible typography.
Incorporated visual cues, such as progress indicators and success notifications, to keep users informed at every step.
Added subtle animations and micro-interactions to create a more engaging and responsive user experience.
Ensured brand consistency by aligning the design with the visual identity of the blood donation initiative, fostering trust and recognition.
Maintained a fixed-width container for desktop, mirroring the mobile design to deliver a seamless and cohesive experience regardless of the device.
A Step Forward: Developing a Better Way to Donate Blood
Development & Challenges
The platform was developed as a web app to ensure seamless cross-platform access, prioritizing a mobile-first approach while maintaining full responsiveness for tablets and desktops. This decision was driven by the nature of blood donation, where users engage with the service only periodically, making a lightweight, easily accessible web solution more practical than a dedicated mobile app.
A key aspect of the development phase was integrating the authentication system with Centrul de Transfuzie Sanguină Iași, allowing verified donor records to sync automatically with user accounts. This ensured that donations were accurately tracked, and rewards were updated in real-time. While the design and initial development were completed, the project has been temporarily paused due to external factors. However, the groundwork has been laid, and the technical achievements provide a strong foundation for resuming development in the future. This innovative solution for blood donation remains a promising opportunity to enhance donor engagement and streamline the donation process.
Key Insights: Building a Better Blood Donation Experience
Lessons Learned & Takeaways
A web-first approach significantly reduces friction for first-time users.
Authentication via institutional link enhances trust and engagement.
Performance and accessibility are critical when designing for diverse users.
Related articles
