Task Flow
Overview
Magnet is an app where users can ask a question and be matched with an expert who is available to provide an answer. My role is UX research and design. I am collaborating on Magnet with a software developer who came up with the idea for the app. This project is in progress.
Tools
Figma
Miro
Team
1 product designer: Emily Heiden
1 software developer
My Role
User research
UX/UI design
Prototyping
Timeline
80 hours
4 weeks
In Progress
Problem
Current apps that are for asking questions allow anyone to answer the question, so there is no way for a user to know if the people answering their questions are giving the correct information. Additionally, the user who asks a question must wait until someone sees their question and responds to it, so there is no guaranteed timeframe in which their question will be answered.
Solution
I will design a mobile app that allows users to ask a question and be matched with an expert who will answer their question in a timely manner.
Competitive Analysis
To begin my research, I analyzed 6 websites where users can seek answers to questions. I noted the strengths and weaknesses of these websites primarily based on usability, usefulness, and functionality. I referenced this information as I began designing the layout of the Magnet app.
User Interviews
I interviewed 3 participants following the competitive analysis to gain an understanding of what the target user is looking for in seeking answers to questions online. This information helped me to empathize with the user and to imagine what features the user would need and want in the app.
User Persona
After the user interviews, I created one persona in order to continue empathizing with the user and understanding who would be using the app and what they will need.

Empathy Map
After creating the user persona, I created an empathy map to organize the information in a helpful way to continue to empathize with the user before starting the design process.

Project Goals
Next, I created a simple Venn diagram of the project goals as a visual tool to guide design decisions going forward.

User Journey
Next, I created a user flow and a task flow to map out which pages I needed for an MVP. For this iteration, I created this app from the perspective of the user asking the questions only.


User Flow
Design
Sketches
I began the design process with low-fidelity sketches and wireframes to accelerate decision-making through visualization without losing time. My sketches were based on the initial user interviews, the business goal, and the heuristic

Mid-Fi Wireframes
Using Figma, I translated my sketches into mid-fidelity wireframes. I iterated on these twice before moving on to creating the high-fidelity wireframes.



High-fidelity Wireframes
Finally, I designed the high-fidelity wireframes using the mid-fidelity wireframes as a guide. I tested the first version of the high-fidelity wireframes as mentioned below, and then made changes based on that feedback. The wireframes pictured here are the second iteration.


Test
Usability Testing
I created a high-fidelity prototype on Figma and recruited 3 users to test the design. The participants clicked through the prototype while commenting on the design and giving suggestions.
Affinity Map
After completing usability testing with my three participants, I created an affinity map to organize the feedback before I made changes to the design. I categorized the feedback into four categories: successes, pain points, suggestions, and questions.

Iterate
User Feedback Changes
Added a welcome page
Simplified the Ask page
Separated the Ask page from the advanced search page
Added upvote/downvote, comment, save, and share icons on the homepage published conversations
Adjusted the font sizes and weight to create more hierarchy and consistency
Increase whitespace throughout
Improved brand cohesion and visual design

Final

Next Steps
Since this project is still in progress, I will be working closely with my team member to continue to add features, test the app, and iterate on it. Next, I will add the pay pages and the pages from the expert's side of the app.

Learnings
Every project teaches me something new, and this one was no different. I learned the importance of iterating on my designs and gathering feedback from others. I felt like this project taught me that less really is more most of the time when it comes to creating products that are truly useful for the user. I will continue to work on this project, and I know I will learn more as the project progresses. I understand that no project is ever actually complete because there will always be new features to add, and improvements to make to the current design. It reminds me of pretty much every painting I have ever painted because those are never actually complete either.
Thank you for reading my case study!
If you would like to connect, please reach out on LinkedIn.