spot.

User Experience
User Interface
Figma

Over 48 hours at the SUEDE Designathon, our team of five tackled the challenge of designing a digital solution to support mindful digital engagement, focusing on medical misinformation online. We all contributed to primary research, with me specifically conducting online ethnography, observations, and some interviews. I also led much of the UI design and prototyping, helping create a solution that makes it easy for users to identify and navigate misinformation.

A promotional slide for 'spot.' a fact-checking app, featuring the app's logo with a dog's face inside a blue circle, the app's name, and three smartphone screens showing features like credibility scores, login options, and recent fact checks. The slide includes the tagline 'Fact-check your feed, protect your health,' and mentions the creators' names.

Our Process

We followed the Double Diamond framework to guide our 48-hour designathon project. Through research, synthesis, ideation, and prototyping, our team explored the problem of medical misinformation online and developed a solution that supports mindful digital engagement.

A diagram with four stages representing a process: Discover, Define, Develop, Deliver.

Discover

A blue background slide displaying research findings about under-resourced communities and social media's impact on healthcare decisions, sourced from Matangi et al., 2025.
Image displaying statistics about benefits, harms, and scientific references related to a medical product, with percentages indicating 87% benefits, 15% harms, 34% anecdotes, 6% scientific evidence, and 68% influence by financial interests.

Secondary Research

To understand how users engage with digital information and encounter medical misinformation, our team conducted primary research, including a speed interviewing workshop and online ethnography, alongside secondary research. I specifically led the online ethnography, observations, and some interviews, gathering insights into user behavior, pain points, and strategies for identifying misinformation.

Primary Research

Triangulation through Interviews, Online Ethnography and Observations

Define

We analysed our research data using an affinity diagram, which helped us uncover key insights about how users navigate and assess digital information. From these insights, we crafted a revised problem statement that guided our design direction.

Data Analysis

spot. Affinity Diagram

Affinity Diagram

Blue background with white text discussing supporting people with limited healthcare access through digital literacy, accurate information, and credible sources.

Revised Problem Statement

After refining our problem statement, we moved into data synthesis to translate our insights into tangible design tools. We created user personas to represent our target users, highlighting pain points and opportunities for intervention. These artifacts grounded our ideation in real user needs.

Data Synthesis

Side-by-side comparison of two student profiles. The left profile is of Amelia, a 21-year-old international university student from Japan, with sections on context, interest, needs, opportunities, and pain points. The right profile is of Jane, a 27-year-old hospitality worker and TAFE student, with similar sections on context, interest, needs, opportunities, and pain points.

Develop

We began with brainstorming sessions to generate a wide range of concepts. To refine our direction, we participated in a mentor workshop, where we received feedback on improving the seamlessness between social media use and our app. Using this feedback, we iterated on our ideas, focusing on smooth transitions and intuitive interactions. From there, we moved into wireframing, laying the foundation for our prototype.

Ideation

A series of mobile app interface screens showing features like spotting fact-checking, searching videos, viewing history, and user profile management.

Wireframes

For user testing, we ran a think-aloud protocol, making quick changes using an agile approach. Feedback revealed that:

  • The icons were overwhelming, so we simplified the visual system.

  • Four color categories felt contradictory, so we reduced them to three.

  • Titles and summaries clashed, so we collapsed extra details into a “Learn More” section.

These rapid iterations made the design clearer, less overwhelming, and more intuitive.

Iteration

A digital infographic displaying issues and updated issues related to credible sources, evidence, and language, with color-coded sections and categorized labels.

Deliver

In the final phase, we created a high-fidelity prototype that showcased how users could seamlessly transition from social media into our app to verify and engage with medical information. I focused heavily on the UI design and prototyping, ensuring the interface was clear, accessible, and intuitive.