Rethinking Content Discovery for Netflix

I selected Netflix as my platform and iOS mobile as my device type, designing for a 390 × 844px frame — the smallest common iPhone screen size — following the UXcel guideline to design for the smallest device first. My wireframes are mid-fidelity, which I chose as the appropriate level for this stage: structured enough to communicate layout, hierarchy, and interaction patterns clearly, while remaining fast to create and easy to iterate on.

My process was grounded in four UXcel learning modules: Creating Wireframes for Mobile, Wireframing Best Practices, Wireframe Fidelity, and Mobile Wireframing. These guided decisions around frame size, fidelity level, tap target sizing, bottom navigation patterns, thumb-zone layout, the use of real copy, and the importance of annotations. As a bonus deliverable, I also conducted a competitive analysis of Netflix's three main competitors — Disney+, Amazon Prime Video, and HBO Max — which directly informed every design decision in this project.

Netflix was selected as the base platform due to its market leadership, global content breadth, and the meaningful opportunity to differentiate through personalization and social features that no major competitor has yet addressed effectively.

Competitive Analysis

Before designing anything, a thorough competitive analysis was conducted across the three primary Netflix competitors: Disney+, Amazon Prime Video, and HBO Max. The analysis examined pricing, content strategy, UX quality, global reach, and user satisfaction — then identified where Netflix has the clearest opportunity to differentiate.

Market Share Overview (2026)

According to JustWatch Q4 2025 data, the US streaming market is increasingly competitive. Netflix holds approximately 20% market share, Amazon Prime Video sits at 19%, Disney+ commands 14% standalone (26% combined with Hulu), and HBO Max holds 13%. The days of a dominant two-player market are giving way to a more balanced, contested landscape.

Disney+

Strengths

• Unmatched franchise IP: Marvel, Star Wars, Pixar, National Geographic, and Disney Classics under one roof
• Strong bundling strategy with Hulu and ESPN, creating exceptional perceived value
• Dominant family appeal — a near-essential subscription for households with children
• Strategic AI partnership with OpenAI for potential content innovation

Weaknesses

• Content can feel repetitive and over-familiar, primarily appealing to existing franchise fans
• Limited appeal to adults without families or franchise enthusiasm
• Major UX disruption underway as Hulu is being folded into Disney+ in 2026 — creating subscriber confusion
• No meaningful social or mood-based discovery features

Amazon Prime Video

Strengths

• Best value proposition of any streamer — bundled with Prime membership (e-commerce, music, delivery)
• Enormous content library spanning classic TV, theatrical releases, and diverse originals
• Add-on channels system (Shudder, MGM+, BFI) extends library significantly
• Over 175 million users — the largest installed base of any streaming platform

Weaknesses

• The quality of original content is widely considered weaker than that of Netflix and HBO Max
• Interface is notoriously cluttered — mixing premium content with add-on channels creates confusion
• Subscribers must pay an additional monthly fee simply to remove ads — a frustrating friction point
• No mood-based discovery or social recommendation features

HBO Max

Strengths

• Highest user satisfaction score among major streamers — 84% renewal intent (CableTV 2024–2026 data)
• Unrivalled prestige content library: The Last of Us, Succession, House of the Dragon, The Wire
• Combined Warner Bros. film and HBO TV catalogue offers depth few rivals can match
• Acquisition interest from Netflix and Paramount signals significant value

Weaknesses

• The third major rebrand in its short history (from HBO Max → Max → back to HBO Max) has created serious brand confusion
• Very limited global availability — absent from large parts of Europe, weakening competitive position internationally
• The highest premium tier price point ($22.99/mo for 4K) is hard to justify for casual subscribers
• No social features, mood discovery, or personalisation transparency

Competitor Comparison

Key Opportunity Areas for Netflix

The competitive analysis revealed three clear gaps across all three competitors that Netflix is uniquely positioned to address through design:

• Mood-based discovery: No competitor has meaningfully replaced genre-based browsing with emotional/mood-driven content surfacing
• Social features: None of the three competitors offers watch parties, friend activity feeds, or social recommendations at a product level
• Personalisation transparency: All three use black-box algorithms — Netflix has an opportunity to let users see and tune how their feed works

Design Process

The project followed a structured, iterative design process grounded in industry-standard UX methodology, informed by UXcel's Mobile Wireframing and Wireframe Best Practices guidelines.

Phase 1 — Research & Discovery

The process began by establishing a clear problem statement and target audience. Key questions answered before any wireframe work:

• Who will use this? Netflix subscribers on iOS, across a wide age range, often watch alone or in social settings
• What is the core problem? Users frequently experience 'decision paralysis' — they open Netflix but cannot decide what to watch
• What context will they be in? Commuting, relaxing at home, multitasking, or watching with others
• What are the most important actions? Browse/discover content, resume watching, find something specific, watch with friends

Following UXcel guidelines, analytics-informed design for the smallest screen size was prioritised: 390 × 844px (iPhone SE / iPhone 14 standard), ensuring layouts work on the most constrained devices before scaling up.

Phase 2 — Ideation

Four core design ideas were identified as the strongest opportunities to differentiate Netflix through UX:

Idea 1 — Mood-Based Content Discovery

Instead of genre labels, users express how they want to feel. Mood options include Relax, Funny, Suspense, and Mind-bending. The AI surfaces content matching the emotional tone rather than a categorical genre. This directly addresses the core insight that people don't know what genre they want — they know how they want to feel.

Idea 2 — Smart Resume Watching

Most streaming services bury 'Continue Watching' or treat it as a secondary row. This design elevates it to the top of the Home screen with thumbnail previews, time remaining, episode context, and a visible progress bar — making resumption frictionless.

Idea 3 — Quick Preview Mode

A TikTok-style vertical swipe interface where users can preview 20-second clips of shows before committing. Each preview includes genre tags, ratings, and a quick-add to watchlist. This solves the 'I don't know what to watch' problem through discovery by experience rather than by description.

Idea 4 — Social Watch Recommendations

A dedicated Friends tab showing what friends are watching, have rated, and are recommending. Each card includes a Watch Now action and Bookmark option. People trust friends more than algorithms — this feature channels that social trust into content discovery.

Phase 3 — Wireframing

Wireframes were created in two stages:

• First pass: Structured prompts in UX Pilot to generate initial screen layouts
• Refinement: Exported to Figma and refined manually to match the project's design ideas, UXcel guidelines, and competitive insights

Fidelity level: Mid-fidelity was chosen as the appropriate level for this stage — structured enough for stakeholders and reviewers to evaluate layout and interaction patterns, but without visual polish that would distract from functional evaluation.

Wireframe Screens & Rationale

The following screens were designed across 5 navigation tabs (Home, Discover, Search, Friends, Profile) plus supporting screens for Preview, Movie Details, and Video Player. All screens are designed at 390 × 844px following iOS Human Interface Guidelines.

Navigation Architecture

The bottom navigation bar uses 5 destinations, following iOS HIG recommendations:

• Home — personalised feed, continue watching, mood-based rows
• Discover — mood card selection and vibe-sorted content rows
• Search — search bar, mood pills, suggested, and recent searches
• Friends — social recommendations, watch party, friends' activity
• Profile — taste archetype, viewing habits, settings

This structure gives equal weighting to social (Friends) and discovery (Discover) as core navigation destinations — reflecting the competitive gap analysis finding that no competitor has addressed either dimension at the navigation level.

Screen Rationale

Home Screen

The Home screen is anchored by a mood-based prompt — 'What do you feel like watching?' — with three quick-select pills (Relax, Funny, Suspense) immediately visible above the fold. This replaces the standard genre-based header, reducing cognitive load and addressing the core decision paralysis problem.

Continue Watching is elevated to the first content row with visible progress bars and time-remaining labels. This follows the UXcel guideline that critical interactive elements should live in the thumb-friendly bottom two-thirds of the screen, while also addressing the competitive insight that all three competitors bury this feature.

The 'Continue Your Vibe from Stranger Things' row introduces contextual, mood-anchored recommendations — showing the user content similar in feel to what they last watched, with explicit match percentages (95%, 92%, 88%). This makes the recommendation logic transparent, addressing a key differentiator gap versus competitors' black-box algorithms.

Discover Screen

The Discover screen opens with 'How are you feeling?' — a 2×2 grid of mood cards (Relax, Funny, Suspense, Mind-bending), each with an icon, name, and subtitle. Selecting a mood triggers mood-sorted content rows below.

The vibe-sorted rows each carry a contextual header (e.g., 'Because you're feeling relaxed — Calm, light, easy-to-watch picks') with an icon and subtitle before the horizontal scroll of posters. This approach was directly informed by the competitive analysis finding that Disney+'s franchise-only browsing and Amazon's cluttered interface both fail to provide an emotionally intelligent discovery path.

A 'Browse Another Way' section at the bottom provides a traditional genre grid (Drama, Comedy, Thriller, Mystery, Science Fiction, Action, Horror, Documentary) for users who prefer categorical browsing — ensuring no user is excluded by the mood-first approach.

Search Screen

The Search screen features a prominent search bar at the top, followed by mood-based pills (Relax, Funny, Suspense, Mind-bending) that allow users to search by emotional intent rather than title. This is a direct differentiator — no competitor currently offers mood-filtered search.

Below the search bar, three sections provide progressive levels of specificity: Suggested Searches (AI-generated prompts), Recent Searches (with individual clear buttons), and Popular Searches with title, subtitle, and trending arrows. The tap target sizes across all interactive elements meet iOS minimum guidelines of 44×44px.

Preview Screen

The Preview screen implements the TikTok-style vertical swipe idea. A full-screen video preview plays automatically with a central play button. Movie title, genres, and a recommendation tag ('Because you watch Sci-Fi thrillers') are displayed in an overlay card at the bottom.

Two CTAs are offered: 'View More' (navigates to Movie Details) and 'Watch Now' (this plays the movie directly from the preview). A subtle upward arrow cues the swipe-to-next gesture. This screen directly addresses the 'I don't know what to watch' problem through experiential preview rather than text-and-poster browsing.

Friends Screen

The Friends screen begins with a prominent 'Start Watch Party' button — making the social watching feature immediately accessible. Below, a feed of friend activity shows personalized recommendation cards from named friends (Anna, David, Lisa), each containing: friend avatar, recommendation context ('recommends'), movie thumbnail placeholder, title, genre, rating or progress information, a Watch Now button, and a Bookmark icon.

An 'Everyone's Watching' section at the bottom shows a horizontal scroll of titles with stacked friend avatars beneath each poster, indicating how many friends have watched it. This combines social proof with discovery — content popular with your specific social circle surfaces more prominently than algorithmic trending.

Movie Details Screen

The Movie Details screen follows a standard but well-considered layout: a hero image area with a play button, movie title, genre tags, and a match percentage. Below: synopsis, a 'Why This For You' section (making recommendation logic visible), movie stats (duration, year, rating, IMDb), and three primary actions: Watch Now, Add to My List, and Recommend to a Friend.

The Cast & Crew section with avatar photos and character names, followed by a More Details list, and a More Like This grid, completes the screen. The 'Recommend to a Friend' action directly links the content detail experience to the social Friends tab — creating a content-to-social loop that none of the competitors supports.

Video Player Screen

The Video Player uses a clean, distraction-free layout. Playback controls (skip back, play/pause, skip forward) sit centre-screen with a timestamp overlay. A progress bar sits at the bottom of the video area, with volume and expand controls adjacent.

Below the video: episode title, synopsis, views count, likes, and release date. An 'Up Next' panel automatically surfaces the next episode with title, episode metadata, synopsis, and Cancel / Play Now actions — reducing friction at the end-of-episode moment. A 'More Episodes' list allows manual navigation.

Profile Screen

The Profile screen introduces the 'Taste Archetype' concept — an AI-assigned viewer identity card (e.g., 'Thrill Seeker', 'Drama Devotee') that summarises the user's watching patterns in human-readable terms. This replaces a static list of genres with a more engaging, identity-driven representation.

Mood progress bars show the relative distribution of mood preferences across the user's watch history. Genre chips provide quick-glance context. Viewing Habits shows peak watching times and streak data. Viewing Insights surfaces key stats (hours watched, shows completed) in a card format inspired by Spotify Wrapped — shareable and engaging.

A Circle section shows which friends have the closest taste alignment, enabling new social discovery pathways. Settings (Account, Notifications, App Settings, Help & Support, Privacy & Security) are accessible at the bottom of the screen.

Key Design Decisions

Mid-Fidelity Wireframes

Mid-fidelity was chosen as the appropriate level for this project stage. As per UXcel guidelines, mid-fidelity wireframes are detailed enough to communicate interaction patterns and content hierarchy to stakeholders, while remaining quick to create and easy to modify. The grayscale palette keeps focus on layout and structure rather than triggering premature visual design discussions.

390 × 844px Frame Size

Following the UXcel guideline to design for the smallest screen first, 390 × 844px (iPhone SE / iPhone 14 standard) was selected. This ensures layouts are not over-engineered for large flagship devices and that essential content always fits within the most constrained viewport of the target user base.

Bottom Navigation with 5 Tabs

iOS HIG recommends a bottom tab bar for primary navigation, limited to 5 items maximum. The 5-tab structure (Home, Discover, Search, Friends, Profile) was chosen deliberately to elevate both social features and mood-based discovery to primary navigation status — a structural choice that signals their importance and ensures they are never more than one tap away.

Mood-First, Genre-Second

All discovery surfaces lead with mood, not genre. Genre browsing is preserved in the 'Browse Another Way' section on the Discover screen, but it is intentionally de-prioritised. This reflects the core insight from the competitive analysis: all three competitors lead with genre, which requires users to know what they want before they know how they feel. Mood-first reduces the cognitive barrier to content selection.

Transparent Recommendation Logic

Every recommendation row includes a contextual reason: 'Because you're feeling relaxed', 'Based on Stranger Things', 'Popular with Sci-fi fans in your circle'. Match percentages (88%, 92%, 95%) are visible on poster cards. This directly addresses the black-box algorithm criticism common to all three competitors and builds user trust through explainability.

Social as a First-Class Feature

The Friends tab is a primary navigation destination, not an afterthought. Watch Party is surfaced as the first call-to-action on the Friends screen. Recommendation cards from friends include context, movie info, and direct Watch Now actions. Friend avatar stacks appear under posters in 'Everyone's Watching' rows. This systemic integration of social features throughout the product — not just in one isolated section — is the clearest UX differentiator from all three competitors analysed.

Reflection & Next Steps

What Worked Well

• The mood-first discovery approach produced a coherent design language that runs consistently across Home, Discover, and Search screens
• Grounding the design in competitive analysis made the differentiation rationale clear and evidence-based
• The two-stage wireframing process (UX Pilot first pass → Figma refinement) was efficient and allowed rapid iteration
• The UXcel guidelines provided a strong structural framework that prevented common mobile UX pitfalls (tap targets, thumb zones, navigation patterns)

Limitations

• Wireframes do not yet include all edge cases: empty states, error states, loading states, and offline behaviour
• The Preview (TikTok-style) screen would benefit from further usability testing to validate swipe gesture discoverability
• The Taste Archetype concept on the Profile screen would require AI model design and user research to validate that the archetypes are meaningful and not reductive
• Accessibility considerations (colour contrast, font size minimums, screen reader support) need to be formally reviewed at the next fidelity stage

Next Steps

1. Usability testing: Test the wireframes with 3–5 users using Maze or UserTesting to validate mood-based navigation and social feature discoverability
2. High-fidelity design: Apply Netflix's visual design language (dark theme, red accent, DM Sans/custom typography) to the validated wireframe layouts
3. Design system: Define a component library for the mid-fidelity elements before moving to high-fidelity

Tools & References

Tools Used

• UX Pilot — AI-assisted wireframe generation for first-pass screen layouts
• Figma — Primary wireframe refinement and screen design tool
• ChatGPT — Ideation partner for brainstorming design ideas
• Claude (Anthropic) — Competitive analysis research, case study writing, wireframe rationale development

Thank you for reading.