Comprehensive Media PRofile
Mobile App Concept
As a UX team, we identified a problem space through researching people who consume various types of media. We learned that people who frequently media are faced with too much content, and lack of accuracy in recommendations.
After going going through the entire UX Process we developed a solution. Enter MUSE - a comprehensive approach to media recommendations that brings users closer to the content they love paired with related Medium articles.
My Role: UX Researcher/Designer
Duration: 2 Week Sprint (Jan 2024)
Tools: Figma, Maze, Notion, Keynote, Zeplin
Methods Used: User Interviews, Affinity Mapping, Competitive Feature Analysis, Business Model Canvas, Persona & Journey Map, Feature Prioritization, Mobile Prototyping, Usability Testing, Task Flows, Sketching & Design Studio
WHat we set out to accomplish
Our UX team sought out to learn about people who actively consume various forms of media. Our insights from research allowed us to create a platform would aligned with the needs & goals of our target audience and solve the issues identified in the problem space.
Project Goals:
Provide more comprehensive approach to media recommendations
Use a wider base of content than competing platforms
Allow users to engage more meaningfully with content through related Medium articles
Design Opportunity:
Recommendations based on media consumption across multiple platforms, based on user inputted media rankings
Easy access to articles covering media consumed and related projects
Connect users with new and high-quality content that aligns with their preferences
Introducing…Muse!
Based on user testing and business analysis, we developed MUSE. Key functionality includes:
Connect disparate platforms
Curated recommendations based on user history
Develop personal media profile
Rate/Review media
Dive deeper with related Medium articles
design Process
MUSE allows users to access curated media recommendations in a single platform and surfaces relevant Medium articles to allow users to dive deeper into interesting topics.
How did we accomplish this? We followed the design process below:
Learning about the media Landscape
Goal of research
Learn more about the the media landscape and current users behaviors, needs, and goals.
Business Research
Competitive Feature Analysis + Medium Partnership
We created a competitive feature analysis to understand where Medium stands in the marketplace and considered which features Medium offers, in comparison to its current competitors. This allowed us to understand where Medium excels and opportunities for unique offerings and a partnership with MUSE.
Key Takeaways:
Medium writers are already creating content about media Muse seeks to promote
If more people are exposed to targeted Medium articles, they’ll want to subscribe
Networks and producers will have greater incentive to create sponsored content
Business Model Canvas
We used a BMC to analyze Medium’s business: partnerships, goals, values, and customer segments. By understanding these aspects of Medium, we see where Muse can add value to their existing customer base, and even expand it.
Interviewing media consumers
Completed five user interviews
Target Audience: people who consume media daily on different platforms (books, social media, streaming)
Goal: uncover potential pain points and insights to inform our design.
Method: discussion guide with questions to validate or invalidate our assumptions.
Synthesizing interview data
We used affinity mapping to synthesize user interview data. We noted observations from interviews and grouped the insights by similarity to extract common themes, which we used to understand our target audience’s goals, needs, and pain points.
Key takeaways:
Let user play an active role in curating their recommendations
There’s opportunity for a comprehensive platform for pre and post research
People are interested in keeping a history of their consumption
Key Takeaways:
The market is primed for an app that relies on user inputted data
Today’s users expect a high-level of customization in their online environment
Users want to have a voice, and interact socially online
Who are we designing for?
Persona
We created a persona - “Stephanie” to summarize our research, gain a visual understanding of the user, and focus our design efforts on ultimately solving the users's challenges. Based on the insights and direct quotes from our user interviews, we outlined our persona's goals, needs, and pain points.
Journey Map
We created a user journey map to consider each step a user would take before, during, and after the experience of taking in content. We used Stephanie as an example, to humanize our user, and plot her emotional state and interaction with technology at each point in her experience.
How research shows up in our design
Using the actionable insights from research, we developed features that would directly align with each of the insights that we gathered. We used these design ideas when we are sketching and iterating in our design studio. Below are the key concepts that we extracted from research and how it shows up in our design:
designing the app
Product Principles
Before jumping into our design studio, our UX team established design principles that aligned with our values and provided a solid foundation for our platform, prior to developing features.
Prioritizing what Features to design
To kick off our design and ideation phase, we used two techniques to prioritize features while keeping in mind the constraints of limited resources. These exercises helped us to understand what features were high priority vs. low priority, and what already existed within the app.
Must Have Features
Onboarding process
Browse related content
Rate content for platform recommendations
Bookmark content for later
Mark content as viewed
Getting our ideas out on paper
Our team conducted a design studio session to get our ideas onto paper and collaborate on our design using our user & business research, persona/journey map, and product principles as reference.
Key Takeaways:
Users will be given topic chips in onboarding
Global navigation will be on bottom and include profile, recommendations, and search
When titles are referenced they will be accompanied by a thumbnail for a better visual experience
Mid-Fidelity to hi-fidelity Usability testing
Overview:
2 rounds of testing - 10 total users (5 users for mid-fi, 5 users for hi-fi)
Method: Wrote tasks + test script; Measured users on time to complete task, easiness rating, and path to completing the task
Goal: Understand the usability of our current features to then make improvements to our design
Using insights from usability testing on our mid-fi prototype, we iterated on our design and applied the changes highlighted below as we developed our prototype from mid-fi to hi-fi.
The improvements in usability from mid-fi to hi-fi on each task are shown below. Due to the changes we made based on user data from round 1 of testing, users were able to navigate through the hi-fi prototype more quickly and with more success than the mid-fi design.
How did these design changes affect usability?
High-Fidelity Prototype
After receiving feedback and analyzing the results from during our first round of user testing on our mid-fi prototype, we applied these changes to our hi-fi wireframes. We added annotations that have the related user tasks that a user would take action on each screen.
Creating Account
Using Content Recommendations
Style Guide
We created a style guide to standardize Muse’s design in alignment with our product principles. We used the guidelines to standardize a system of components to create a consistent visual appearance throughout each screen and version of the app’s development.
Additional Product Highlights
View User Profile & Search For Content
Onboarding
Rating Titles & Adding to Watch History
Technical notes and next steps
API Information
In order to offer a feature rich experience and lower the amount of data to handle, we needed to consider API integrations, such as:
TMBD - extensive catalog of movies and series, including thumbnails, titles, synopsis, cast, keywords, trailers.
Medium - allow our application to display and recommend Medium articles related to the media they are viewing as well as populate article details such as title, excerpts, author, author photo and article cover.
GoodReads - used to populate book fields, including images, title, author, synopsis.
KPIs
We used the Google Heart Framework in order to identify how we want to measure the quality of user experience. In order to evaluate the success of our design, we wanted to focus on following metrics as it relates to MUSE:
Engagement - session frequency (time spent within the platform + number of log ins), interacting with content
Adoption - existing users referring their friends to the platform + conversion rates from referrals
Retention - length of user account history + deleting accounts/leaving accounts dormant
Next Steps
Looking forward to our short and long term goals, we would prioritize the following next steps as we continue to evolve our product strategy:
Additional Rounds of User Testing + Pilot Program
Onboarding tutorial for new users
Develop Andriod + Desktop design