Mobile Design
I was tasked with translating a complex web-first research portal into a mobile app. The goal was to support participants in completing video-based interviews, demographic surveys, and onboarding flows on smaller screens.
The mobile design included many detailed decisions that shaped the final prototype. Interested in the process? Let’s chat! :>
The Problem: AI/UX challenges for mobile
• Hardware-specific constraints on UI & data fidelity: Considering microphone and camera placement and how they impact audio and video quality in relation to research needs.
• How can this interface avoid overwhelming troubleshooting?: Designing troubleshooting flows for camera/mic issues to help prevent confusion and encourage behaviors that improve the reliability of captured training data.
• Too much info, not enough space: The interface had to display lengthy, structured interview questions alongside a live video feed, this on top of troubleshooting errors risked crowding the screen and overwhelming participants.
My process & Design Decisions:
• Collaborated with the principal investigator to prioritize research requirements for capturing high-quality AI training data.
• Ensured clear onboarding for video and audio setup by limiting error prevention pop-ups to one in a prominent spot.
• Created new mobile-specific elements in line with the existing design system.
• Balanced simplicity with research complexity by moving structured questions into a scrollable section and streamlining video feeds, removing background elements and redundant borders that previously reduced usable space.
Outcome
Delivered a mobile-second design that balanced the need for simplicity with the complexity of the research tasks.
Original
Adapted Mobile
