Overview
This case study outlines the design and prototyping of GemSpark, a podcast app focused on improved interface design, content discovery, and user engagement. Aimed at both casual and avid listeners, the app addresses common pain points like cluttered UIs and limited recommendations. Driven by user research and iterative design, the project incorporated real-time analytics to guide future improvements. The final high-fidelity prototype received positive usability feedback for its intuitive interface
and streamlined navigation.
and streamlined navigation.
Week 1:
Studied UX history and wrote an essay on its evolution toward human-centered design.
Week 2:
Interviewed users Camila (remote via Discord) and Sheryl (in person);
collected insights on content preferences and interface expectations; and
created a User Persona (Stephanie Wilson) and Customer Journey Map
in Adobe InDesign.
collected insights on content preferences and interface expectations; and
created a User Persona (Stephanie Wilson) and Customer Journey Map
in Adobe InDesign.
Interview 1
Interview 2
Persona sketches
Persona
Customer Journey Map sketches
Customer Journey Map 1
Customer Journey Map 2
Week 3:
Designed a User Flow (sketched + developed in FigJam) and
created wireframes of the Home screen (sketched + built in Adobe XD).
created wireframes of the Home screen (sketched + built in Adobe XD).
Wireframe sketches
Home screen wireframe
User Flow sketch 1
User Flow sketch 2
User Flow sketch 3
User Flow
Week 4:
Compared research methods in an essay (contextual inquiry vs. usability study);
conducted a Usability Study with Sheryl using the prototype; and
collected feedback to inform design improvements.
conducted a Usability Study with Sheryl using the prototype; and
collected feedback to inform design improvements.
Usability Study
Usability Study notes
Prototype iteration 1 link: https://xd.adobe.com/view/c852aca2-9e4a-4db4-be5a-c78ddd32a5f6-9d01/
Week 5:
Implemented changes based on feedback; built a design system consisting of logo, icons, color palette, and typography (Adobe Illustrator); and updated layout, added podcast pages, and cleaned up categories.
Prototype iteration 2 link: https://xd.adobe.com/view/d652a43d-a2eb-4ebb-8a45-da1679537ae2-8301/
Week 6:
Added animations (logo and keyboard);
evaluated app against 10 Usability Heuristics;
identified weak areas and updated features accordingly; and
documented changes with screenshots and written analysis.
evaluated app against 10 Usability Heuristics;
identified weak areas and updated features accordingly; and
documented changes with screenshots and written analysis.
Prototype iteration 3 link: https://xd.adobe.com/view/d3c83cf8-c169-401c-85f2-f1ae3855c0dc-869b/
Week 7:
Wrote and presented a podcast user experience (UX) case study.
Prototype Video
Podcast UX Case Study Presentation link: https://youtu.be/k1gXdb9VTxY