Client
Personal
Personal (Bootcamp)
Contribution
Research, UX, UI, Prototypes
Year
2021
Duration
10 Weeks
Tools
Figma, Miro, Maze
Client
Personal
Personal (Bootcamp)
Contribution
Research, UX, UI, Prototypes
Year
2021
Duration
10 Weeks
Tools
Figma, Miro, Maze
Client
Reelfriends
Personal (Bootcamp)
Contribution
Research, UX, UI, Prototypes
Year
2021
Duration
10 Weeks
Tools
Figma, Miro, Maze
Personal inspiration. I love film. Outside of design, it is my next great passion. I wanted this project to be focused on film in some way.
Personal inspiration. I love film. Outside of design, it is my next great passion. I wanted this project to be focused on film in some way.
Outside influence. During the COVID-19 pandemic we found ourselves “sheltering-in-place”. With little to do (safely), watching TV shows and movies played a dominant role in every day life.
Outside influence. During the COVID-19 pandemic we found ourselves “sheltering-in-place”. With little to do (safely), watching TV shows and movies played a dominant role in every day life.
A changing landscape. With the closure of movie theaters, and the desire for studios to launch their own streaming services, there was an endless amount of content to watch, at any time.
A changing landscape. With the closure of movie theaters, and the desire for studios to launch their own streaming services, there was an endless amount of content to watch, at any time.
4 user interviews
4 user interviews
30 minutes
10 questions
25 - 40 ages
10+ hrs/wk
2+ subscriptions
30 minutes
10 questions
25 - 40 ages
10+ hrs/wk
2+ subscriptions
30 minutes
10 questions
25 - 40 ages
10+ hrs/wk
2+ subscriptions
“It’s hard for me to decide what to watch”
“It’s hard for me to decide what to watch”
“I find it difficult to figure out what to watch”
“I find it difficult to figure out what to watch”
“I usually “doom-scroll” trying to find something to watch”
“I usually “doom-scroll” trying to find something to watch”
“I worry about time, and picking the wrong thing”
“I worry about time, and picking the wrong thing”
Decision making
Too much time is wasted making a choice
Decision making
Too much time is wasted making a choice
Recommendations
The best are from friends
Recommendations
The best are from friends
Platforms
No preferences or trust
Platforms
No preferences or trust
Watchlists
Rarely useful, and often aspirational
Watchlists
Rarely useful, and often aspirational
General/habits
Choice depends on mood
General/habits
Choice depends on mood
In a study of 2,000 Americans,
In a study of 2,000 Americans,
30 minutes spent deciding what to watch
30 minutes spent deciding what to watch
58% struggle to track what to watch
58% struggle to track what to watch
56% turn off the TV and do something else
56% turn off the TV and do something else
55% opt for re-watching a show or movie
55% opt for re-watching a show or movie
Problem statement. Streaming movie watchers need a better way to receive recommendations so that they can spend more time watching, and less time scrolling.
Problem statement. Streaming movie watchers need a better way to receive recommendations so that they can spend more time watching, and less time scrolling.
How-might-we statement. How might we provide better recommendations to streaming movie watchers?
How-might-we statement. How might we provide better recommendations to streaming movie watchers?
Proposed solution. An app to help users give, receive, and track recommendations.
Proposed solution. An app to help users give, receive, and track recommendations.
Most
Most
Features necessary to support core functionality
Features necessary to support core functionality
Give Recommendation
Give Recommendation
Receive Recommendations
Receive Recommendations
Friends List
Friends List
Movie Details Page
Movie Details Page
“Mood” & Genre
“Mood” & Genre
Account
Account
Should
Should
Ideal enhancements that would help reduce barriers
Ideal enhancements that would help reduce barriers
Platform Filter
Platform Filter
Direct Play
Direct Play
Connect Services
Connect Services
Connect your TV
Connect your TV
History
History
Account
Could
Could
Additional features that may add value for some users
Additional features that may add value for some users
“Why?”
“Why?”
Movie of the Day
Movie of the Day
Made For You
Made For You
Friend Activity
Friend Activity
“Mood” & Genre
Account
Won't
Won't
Features that don’t address the problem statement
Features that don’t address the problem statement
Mark as Watched
Mark as Watched
Tweet Length Review
Tweet Length Review
Rate
Rate
Watchlist
Watchlist
Most Popular
Most Popular
Trending
Trending
New Releases
New Releases
Request a Recommendation. “As a User, I want to request a movie recommendation from my friends”
Request a Recommendation. “As a User, I want to request a movie recommendation from my friends”
Give a Recommendation. “As a User, I want to search a movie and recommend it to a friend”
Give a Recommendation. “As a User, I want to search a movie and recommend it to a friend”
Prioritized
The strongest recommendation only
Prioritized
The strongest recommendation only
Personal
Only personally relevant content
Personal
Only personally relevant content
Efficient
Utilitarian and fast
Efficient
Utilitarian and fast
Design Goals. The design solution was guided by three goals that directly reflected the key insights gained during the research phase.
Design Goals. The design solution was guided by three goals that directly reflected the key insights gained during the research phase.
Wireframes and Testing. Through multiple rounds of wireframes and usability tests, I was able to iterate through core elements such as layout, features, and flows.
Wireframes and Testing. Through multiple rounds of wireframes and usability tests, I was able to iterate through core elements such as layout, features, and flows.
Mood
Tags
Vague and unreliable
Personal and familiar
Mood
Tags
Vague and unreliable
Personal and familiar
Mood
Tags
Vague and unreliable
Personal and familiar
Mood
Tags
Vague and unreliable
Personal and familiar
Early insight. One of the key insights from the user interviews was that mood played a big factor in deciding what to watch. The designs addressed this by a) allowing users to add a mood to a recommendation request, and b) the ability to browse or search by mood.
Early insight. One of the key insights from the user interviews was that mood played a big factor in deciding what to watch. The designs addressed this by a) allowing users to add a mood to a recommendation request, and b) the ability to browse or search by mood.
Testing. During testing, all users were successful in using this feature, and reported that they clearly understood its function. However, at the end of every testing session I would solicit feedback from my users on the solution and the overall experience. When discussing the “mood” options, all users reported they weren’t interested in it as presented. Users felt this would likely be vague, unreliable and inherently untrustworthy. This mirrored what users reported in the initial interviews around recommendations provided by the streaming platforms they were using.
Testing. During testing, all users were successful in using this feature, and reported that they clearly understood its function. However, at the end of every testing session I would solicit feedback from my users on the solution and the overall experience. When discussing the “mood” options, all users reported they weren’t interested in it as presented. Users felt this would likely be vague, unreliable and inherently untrustworthy. This mirrored what users reported in the initial interviews around recommendations provided by the streaming platforms they were using.
Redesign. With this in mind, I removed the “mood” feature, and added a “tag” feature. This allows users to add three unique “tags” to each request or submission. Users can apply their own familiar vernacular to confidently express their preferences or attitudes, and it is specific to each interaction. This created a more personalized experience, and shifted this solution to one that supported and enhanced their existing social networks.
Redesign. With this in mind, I removed the “mood” feature, and added a “tag” feature. This allows users to add three unique “tags” to each request or submission. Users can apply their own familiar vernacular to confidently express their preferences or attitudes, and it is specific to each interaction. This created a more personalized experience, and shifted this solution to one that supported and enhanced their existing social networks.
Beginner mistakes. During tests users struggled with some choices I made. This immediately illustrated how important existing standards and patterns can be to a successful design.
Beginner mistakes. During tests users struggled with some choices I made. This immediately illustrated how important existing standards and patterns can be to a successful design.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Contrast. Highest contrast for key actions.
Familiarity. Users expect familiar patterns.
Usability. If a feature is shown, users expect to interact with it.
Copy. Natural language clarifies actions for users.
Design process. Insight into the iterative design process, and examples of changes made.
Design process. Insight into the iterative design process, and examples of changes made.
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Early color, icon, and navigation concepts
Home, and Detail page concepts
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Changing from a light to dark theme to reinforce the movie experience, and most likely use case
Less exploration, more utility
Moved towards a darker, less distracting navigatioon
“Top Recommendation” concepts
Movie details page concepts
Onboarding.
Onboarding.
Top recommendation.
Top recommendation.
Direct play.
Direct play.