Creating and Deploying a Survey Platform for Substance Use and HIV Treatment Research
Project Overview
Dr. Bryan Garner at RTI International was leading a project to develop training materials for HIV/AIDS service organizations seeking to integrate substance use disorder (SUD) treatment into their care offerings. To determine which SUDs are most prevalent and which treatments are most urgently needed, the team used the Real-Time Delphi survey methodology to gather consensus from a broad panel of experts.
The Challenge
The existing survey platform was a dated PHP application that lacked usability, mobile responsiveness, and modern UI standards. When I was brought onboard only six weeks before the first round of data collection, the team needed immediate improvements to the current system before the survey went live. I then proposed a completely new version of the application to be used for the second and third rounds. I saw potential for a reusable survey application that could be customized for multiple RTI clients and projects.
My Role
My role spanned two phases. First, I made short-term improvements to the legacy PHP platform using basic UI principles, HTML/CSS and PHP code. Second, I led a full redesign and rebuild of the platform using modern web technologies (Node.js, React, GraphQL, Azure) for future survey rounds.
Solution Phase One: Rapid Interface Improvement
With a tight timeline before launch, I focused on enhancing the existing PHP application by:
- Improving interface clarity and visual hierarchy
- Making layout and styling changes for better mobile usability
- Ensuring stable performance during the open survey window
- Improving interface clarity and visual hierarchy
- Making layout and styling changes for better mobile usability
- Ensuring stable performance during the open survey window
I also monitored data collection and flagged any user flow issues or technical bugs in real time. After the two-week survey window, I securely migrated the data to Excel for my colleagues to analyze, backed up the application, and closed access to users.
.
Before - original PHP application with content in full-width tables.
After - 6-week redesign for 1st round of survey.
Solution Phase Two: Designing and Building a New Application
After the first round closed, I began designing a new React-based application for the second and third rounds.
Key Design Goals:
- Presenting complex survey questions with clear, accessible context
- Structuring long-form content in digestible, responsive layouts
- Supporting multi-round feedback loops, including live progress feedback and discussion features
- Presenting complex survey questions with clear, accessible context
- Structuring long-form content in digestible, responsive layouts
- Supporting multi-round feedback loops, including live progress feedback and discussion features
Tech Stack & Implementation
- Framework: React
- UI System: Material Design via Material-UI for structure, consistency, and rapid prototyping
- Backend: Node.js with GraphQL and Apollo Server for constant data flow and real-time frontend updates
- Deployment: Collaborated with RTI’s Global Technology Services team to deploy the app and PostgreSQL database on Microsoft Azure
- Content: Integrated infographics and video explainers developed by RTI’s Multimedia Creative Services team
- Framework: React
- UI System: Material Design via Material-UI for structure, consistency, and rapid prototyping
- Backend: Node.js with GraphQL and Apollo Server for constant data flow and real-time frontend updates
- Deployment: Collaborated with RTI’s Global Technology Services team to deploy the app and PostgreSQL database on Microsoft Azure
- Content: Integrated infographics and video explainers developed by RTI’s Multimedia Creative Services team
Diagram of MVP features for each phase of the study.
New application - home page with intro video and welcome text.
Question page with infographic column and independently scrolling question column.
Modal for viewing comments, which can be sorted by recency or answer value.
Impact
The new application provided a dramatically improved participant experience across rounds two and three, with better content comprehension, reduced friction, and more reliable data capture. Our response rate across rounds two and three was 78%. Users said the interface was easy to understand and motivated them to answer all of the questions.
Round three of the survey went live in mid-March, 2020. The flexible, scalable platform architecture allowed us to add questions specific to the effects of COVID-19 at the last minute without changing any code. This component-based structure also positions RTI to reuse and adapt the tool for future real-time-delphi studies.
Other Contributions to the Research Team
In addition to the survey platform, I collaborated with the STS4HIV research team on several supporting tools:
- WordPress site for communicating study updates and findings
- Custom WordPress plugin to distribute unique survey participant codes
- Dashboard based on the survey platform design and code for coaches to track the progress of trainees
- WordPress site for communicating study updates and findings
- Custom WordPress plugin to distribute unique survey participant codes
- Dashboard based on the survey platform design and code for coaches to track the progress of trainees