Drama Story Hub
Short dramas, one tap away. A full-screen player that flows between portrait and landscape, the next episode always ready, and monthly and yearly plans that never interrupt the binge.
Platform
Mobile App (iOS)
Category
Entertainment · Video Streaming (Short Drama)
Timeline
1 Month
Drama Story Hub is a real project. To respect an agreement with the client, their name and branding are hidden, and all prices, titles and numbers in the screens are sample content, not real figures. This short-drama app for the Japanese market has been fully designed, delivered to the client, and is preparing for public launch.
The core question: how do you keep people bingeing while asking them to subscribe? Two things had to be true at once — the app should feel effortless and immersive, with the next episode always one tap away, and its monthly-or-yearly plan should read as fair rather than pushy.
One idea shaped the product: let the drama fill the screen & keep everything else out of the way. The interface stays dark and cinematic — near-black backgrounds and poster-led artwork, lifted by a single Neon Lime (#D6FF33) accent on every primary action. A full-bleed player anchors it across portrait and landscape, revealing controls only on tap, while a quiet bottom tab bar (Home, Library, Favorites, Profile) keeps navigation effortless. Subscription lives in Profile, and social sign-in opens the door for the Japanese market.
01. EMPATHY AND DEFINE
Short dramas live on a simple habit: a few minutes at a time, picked up again and again until a series is done. Discovery set out to understand that rhythm — and to see how the strongest apps profit from it without pushing viewers away.
Research goals
Map the binge loop — how fast a user reaches playback & how the next episode or resume is surfaced. Define a fair monetization model: what to gate, monthly versus yearly, honest cancel/renew. Remove friction at sign-in and in the player (orientation, subtitles, quality). Shape a content-first UI — dark, poster-led, one accent colour, tap-to-reveal controls.
What discovery drew on
Discovery drew on three inputs shaped the work: the client brief and subscription model; a teardown of leading short-drama apps and Japanese streaming conventions; and platform patterns for full-screen vertical video and in-player controls — all set against visual references for a dark, content-first interface.
02. IDEATION & CONCEPT SELECTION
Rather than exploring competing layouts, the work committed to one clear direction and refined it. The concept: keep the viewer inside the content. From the poster-led Home to the full-bleed adaptive player and its tap-to-reveal controls, every choice pulled toward the same feeling — immersive, fast, and never menu-driven.
Site map
Home (Search in header · Featured · New) › Library (Watch History) › Favorites › Player (Portrait · Landscape · Episodes · Episode Info · Comments · Subtitle & Quality settings) › Profile (Edit Profile · User ID · Current Plan → Plans: List / Detail / Cancel · Notifications · Account & Linking · FAQ · Terms · Privacy · License) › Login (Splash · Google · LINE · First-time)
Key task flows
Discover & watch: Home → browse by ranking/category → episode/info → portrait full-screen player → auto-continue to next episode Search: Search (default) → live search while typing → result → player Unlock & subscribe: locked episode in player → plan list (monthly/yearly) → plan detail → register plan → current-plan detail (with cancel path) Resume: Library → Watch History / Favorites → resume series
03. THE REDESIGN
The project kept returning to one question: how do you make paying feel like part of the experience rather than an interruption? Restraint answered it — let the player lead, keep the interface quiet, and make the subscription clear enough that cancelling is as easy as subscribing. The hardest craft was the in-player layer, keeping subtitles, quality and episodes reachable on a full-bleed screen. Now delivered & preparing to launch, the natural next chapter is personalization — surfacing the next drama before the viewer even looks.
