WPI Global Research Data Platform
Unite all data methods into one platform
ROLE
Designer & Developer
TIMELINE
May 2024 - Oct 2024
TEAM
Hunter Poulin
James Walden
Nate Schneider
Gus Montana
SKILLS
Product Design
Front-End Development
UXR & Testing
CHALLENGE
From chaos to clarity
Every year, 1,200 WPI undergrads travel to 50+ global locations for 8-week humanitarian projects, collecting interviews, surveys, and qualitative/quantitative data across scattered platforms. The result? Disorganized workflows, lost data, and students spending more time managing tools than conducting analysis.
Lots of context switching, data fragmentation, and export/compatability issues.
Solution
Build a unified platform to eliminate logistical overhead
Using a PERN stack application, we aimed to eliminate the base logistical overhead and empower our fellow students to focus on what matters most: solving real world problems.
USER RESEARCH
Student Needs & Competitive Analysis
We took a three-pillar approach to understand our student needs and validate our direction.
We analyzed 20 IQP papers to identify common data collection methods, with peer reviews to minimize bias. This guided our feature prioritization: interviews and qualitative data first, followed by surveys and quantitative metrics.
Existing tools like Fastfield and Jotfield were costly, had complex UIs, and were designed for electrical industries, not students. This validated our opportunity to create a free, student-tailored solution.
WPI's existing digital interfaces established familiar patterns for students. Leveraging shadcn UI modernized the visual language while maintaining recognizability, reducing cognitive load for users already comfortable with WPI's ecosystem.
User Flows
Onboarding & Platform
The platform features two core flows: onboarding (SSO login to project setup with role-based permissions) and data collection (form creation to map visualization with flexible access points).
DESIGN SYSTEM
The design system of the IQP DCT serves as a visual bridge between WPI's existing interfaces and a refreshed, modern aesthetic from shadcn. By blending in familiarity with modern minimalist principles, we ensure consistency across the platform while introducing a cleaner and more intuitive student experience.
DESIGN ITERATIONS
After defining the design system, initial mockups visualized basic layouts for forms, dashboards, and onboarding. With the team unfamiliar with Figma and shadcn's design system, early mockups reflected a learning curve but provided valuable direction for the application's structure.
Before
Iterative User Testing
With a functional full-stack prototype, we conducted 30 user testing sessions over 3 weeks (10 per week) with students and faculty. This iterative approach revealed critical usability issues and validated design decisions, with most actionable feedback emerging in the first two weeks.
Forms
Forms were restructured into collapsible accordions instead of sidebar pages. ' Qualitative, quantitative, and survey forms unified under "Data Form" with integrated tables and graphs, eliminating click depth and centralizing all form functions in one place.
Dashboard
The dashboard replaced a redundant data map with member contributions and real-time project updates, transforming it from a visualization duplicate into a genuine project command center.
Interview Form
The original mockup lacked visual hierarchy where all fields appeared identical and recording placement was unclear. The redesigned two-panel layout splits structured form fields (left) and audio recording/transcription (right), enabling multitasking and aligning with how teams actually conduct interviews.
After
FEEDBACK
What did students think?
After a successful user testing session, we asked the last testing session to fill out an experience survey of the application. Below are the final screenshots of the application and stats of the Likert scale survey.
88%
Overall Satisfaction
100%
Aesthetics
87%
Navigation
81%
Performance
REFLECTIONS
What I learned
System Thinking
Frontend and design work closely together, and I understood the capabilities of each.
One UI component can change everything
What one component may work for one area may not work for another. Seeing what is out there in the market helps determine your unique pick.
