A Figma prototype for a platform empowering college students to collaborate on community service and social impact projects — backed by a full software requirements engineering process.
KFUPM StudentHub is a high-fidelity Figma prototype for a platform designed to connect KFUPM students around community service and social impact initiatives. Unlike a typical student portal, the focus is on project-based collaboration — students can propose initiatives, find teammates with complementary skills, and track their collective progress.
What sets this project apart is the depth of the requirements engineering work behind it — the prototype is the output of a complete software requirements process covering elicitation, analysis, prioritization, and formal use case modeling.
The project had two distinct goals: produce a usable, high-fidelity prototype that could be handed to a developer for implementation, and practice every stage of the software requirements engineering lifecycle — from stakeholder interviews and elicitation to structured use case diagrams and prioritized feature lists.
A browsable feed of active community initiatives, filterable by cause area, required skills, and time commitment. Students can quickly assess whether a project fits their availability and interests before expressing interest.
Project owners can define the roles and skills they need, and the platform surfaces relevant student profiles. This makes team formation structured rather than relying on personal networks alone.
A lightweight milestone system lets teams set and track goals, keeping all members aligned and giving the platform visibility into what's actually getting done across the community.
Designing for multiple distinct user roles — students, project leads, faculty supervisors, and admins — while keeping the interface simple enough for casual use was the core tension. Each role has different permissions and different primary actions, which had to be surfaced clearly without cluttering the design.
The requirements process also revealed conflicting needs between stakeholders. Faculty wanted oversight and approval workflows; students wanted a low-friction experience. Balancing these competing requirements is something the prototype handles explicitly through a tiered permission model.
This project made requirements engineering feel like real work rather than an academic exercise. The interviews and elicitation sessions consistently surfaced needs that wouldn't have been obvious from assumptions alone — several planned features were deprioritized after actually talking to target users.
High-fidelity Figma prototyping also taught me that the best way to validate a design decision is to make it interactive and put it in front of someone. Static mockups hide usability problems that become obvious the moment someone tries to actually use a flow.