Back to Projects
Creative Studio
A visually engaging and highly responsive landing page designed for a modern digital creative studio, aimed at attracting potential clients and showcasing their services with style and clarity.
NUX: Learning Between the Lines
NUX is a mobile streaming platform built around a simple insight: people don't lack the desire to learn, they lack the time and mental bandwidth to commit to it. Instead of organizing content by format or genre, NUX groups everything by narrative theme, letting users pick up meaningful, bite-sized learning in the small windows of their day, a commute, a coffee break, a few minutes before bed. The goal was to remove the guilt of "just watching for fun" and the friction of "committing to something long," so growth feels as easy and low-stakes as scrolling.
🧑💼 Role
Solo UX Designer & Researcher
🏢 Client
Fictional Case Study
⏳ Timeline
6 Weeks (November–December 2025)
The Challenge
Design a theme-based streaming experience for a learner on the go. NUX is a mobile platform built on a simple idea: content should be organized by narrative themes, not by formats or genres.
01 Research: Understanding the User
To ground the design in a real person rather than an abstract user, I built a persona around a core tension: limited time, high intent to learn.
01 Research: Understanding the User
To ground the design in a real person rather than an abstract user, I built a persona around a core tension: limited time, high intent to learn.
01 Research: Understanding the User
To ground the design in a real person rather than an abstract user, I built a persona around a core tension: limited time, high intent to learn.
Rekha Marr is a 34-year-old UX Specialist and new mother. Her only guaranteed personal time is a 45-minute train commute. She doesn't want to scroll aimlessly, and she won't commit to something long. She wants high-quality, theme-based content she can actually finish, with the option to save anything that sparks deeper curiosity for later. Every design decision that followed had one test: would this help Rekha make good use of 45 minutes?
Her pain points, ranked by severity, made the priorities clear: no time to learn during the day, platforms that push the wrong content, and no reliable way to pick up where she left off, especially on patchy train wifi.
Rekha Marr is a 34-year-old UX Specialist and new mother. Her only guaranteed personal time is a 45-minute train commute. She doesn't want to scroll aimlessly, and she won't commit to something long. She wants high-quality, theme-based content she can actually finish, with the option to save anything that sparks deeper curiosity for later. Every design decision that followed had one test: would this help Rekha make good use of 45 minutes?
Her pain points, ranked by severity, made the priorities clear: no time to learn during the day, platforms that push the wrong content, and no reliable way to pick up where she left off, especially on patchy train wifi.
Rekha Marr is a 34-year-old UX Specialist and new mother. Her only guaranteed personal time is a 45-minute train commute. She doesn't want to scroll aimlessly, and she won't commit to something long. She wants high-quality, theme-based content she can actually finish, with the option to save anything that sparks deeper curiosity for later. Every design decision that followed had one test: would this help Rekha make good use of 45 minutes?
Her pain points, ranked by severity, made the priorities clear: no time to learn during the day, platforms that push the wrong content, and no reliable way to pick up where she left off, especially on patchy train wifi.
Research method: open card sort. Before touching a wireframe, I ran a card sort to understand how people naturally group content, spanning 20 pieces from Machine Learning Basics and Sapiens to Dune, Squid Game, and Street Photography.
Research method: open card sort. Before touching a wireframe, I ran a card sort to understand how people naturally group content, spanning 20 pieces from Machine Learning Basics and Sapiens to Dune, Squid Game, and Street Photography.
Research method: open card sort. Before touching a wireframe, I ran a card sort to understand how people naturally group content, spanning 20 pieces from Machine Learning Basics and Sapiens to Dune, Squid Game, and Street Photography.
Three patterns emerged. Entertainment grouped by mood, not format: 71% of participants grouped Call of Duty with Squid Game despite one being a game and the other a series. Cooking grouped with creativity rather than lifestyle, at 86% agreement with Street Photography and Graphic Design. Science-based content clustered regardless of format, at 43% agreement, united by feeling factual and knowledge-based rather than by subject matter.
Three patterns emerged. Entertainment grouped by mood, not format: 71% of participants grouped Call of Duty with Squid Game despite one being a game and the other a series. Cooking grouped with creativity rather than lifestyle, at 86% agreement with Street Photography and Graphic Design. Science-based content clustered regardless of format, at 43% agreement, united by feeling factual and knowledge-based rather than by subject matter.
Three patterns emerged. Entertainment grouped by mood, not format: 71% of participants grouped Call of Duty with Squid Game despite one being a game and the other a series. Cooking grouped with creativity rather than lifestyle, at 86% agreement with Street Photography and Graphic Design. Science-based content clustered regardless of format, at 43% agreement, united by feeling factual and knowledge-based rather than by subject matter.
These patterns became six categories: Science & Technology, Society & Culture, Creativity & Art, Entertainment, Mind & Life, and Historical Stories, forming the backbone of the first site map.
These patterns became six categories: Science & Technology, Society & Culture, Creativity & Art, Entertainment, Mind & Life, and Historical Stories, forming the backbone of the first site map.
These patterns became six categories: Science & Technology, Society & Culture, Creativity & Art, Entertainment, Mind & Life, and Historical Stories, forming the backbone of the first site map.
02 Define: Structuring the Information
With the six categories in place, I mapped a first version of the site structure under Home, Topics, Library, and Account.
02 Define: Structuring the Information
With the six categories in place, I mapped a first version of the site structure under Home, Topics, Library, and Account.
02 Define: Structuring the Information
With the six categories in place, I mapped a first version of the site structure under Home, Topics, Library, and Account.
Validation method: tree testing. I ran tree testing through TreeJack to see where users actually got lost navigating this structure, and three problems surfaced immediately.
Topics and Library looked the same: 4 out of 7 participants clicked Library when asked to find a specific topic, since both sections read as "places that hold content" with no clear distinction.
The labels weren't working either. Keep Watching, Your Daily Recommendation, and Because You Watched caused consistent task failures, not because users didn't know what they wanted, but because they couldn't find the right words on screen.
Amazon Rainforest was also miscategorized, filed under Society & Culture when users expected Science & Technology, causing several outright task failures.
I restructured the architecture in response: Explore became the space for discovery, Dashboard became the personal progress space (saved items, history, achievements), the labels were rewritten to Continue Watching, Personalized for You, and More Like This, and Amazon Rainforest was moved to the correct category.
Validation method: tree testing. I ran tree testing through TreeJack to see where users actually got lost navigating this structure, and three problems surfaced immediately.
Topics and Library looked the same: 4 out of 7 participants clicked Library when asked to find a specific topic, since both sections read as "places that hold content" with no clear distinction.
The labels weren't working either. Keep Watching, Your Daily Recommendation, and Because You Watched caused consistent task failures, not because users didn't know what they wanted, but because they couldn't find the right words on screen.
Amazon Rainforest was also miscategorized, filed under Society & Culture when users expected Science & Technology, causing several outright task failures.
I restructured the architecture in response: Explore became the space for discovery, Dashboard became the personal progress space (saved items, history, achievements), the labels were rewritten to Continue Watching, Personalized for You, and More Like This, and Amazon Rainforest was moved to the correct category.
Validation method: tree testing. I ran tree testing through TreeJack to see where users actually got lost navigating this structure, and three problems surfaced immediately.
Topics and Library looked the same: 4 out of 7 participants clicked Library when asked to find a specific topic, since both sections read as "places that hold content" with no clear distinction.
The labels weren't working either. Keep Watching, Your Daily Recommendation, and Because You Watched caused consistent task failures, not because users didn't know what they wanted, but because they couldn't find the right words on screen.
Amazon Rainforest was also miscategorized, filed under Society & Culture when users expected Science & Technology, causing several outright task failures.
I restructured the architecture in response: Explore became the space for discovery, Dashboard became the personal progress space (saved items, history, achievements), the labels were rewritten to Continue Watching, Personalized for You, and More Like This, and Amazon Rainforest was moved to the correct category.
03 Design: Wireframes and Visual System
With the architecture validated, I moved into wireframes in Figma at an iPhone 11 Pro frame (375 × 812px), covering the full onboarding flow, the personalized home, the explore catalogue, content details, and the streaming viewer.
Each screen's grid was matched to its purpose: a multicolumn grid (8 columns, 16px gutters) for landing and home pages that need fast scanning, a hierarchical grid for the video page to give playback visual dominance while keeping suggestions accessible, and a modular grid (4×4, 24px gutters) for catalogue browsing where items need to feel evenly weighted.
03 Design: Wireframes and Visual System
With the architecture validated, I moved into wireframes in Figma at an iPhone 11 Pro frame (375 × 812px), covering the full onboarding flow, the personalized home, the explore catalogue, content details, and the streaming viewer.
Each screen's grid was matched to its purpose: a multicolumn grid (8 columns, 16px gutters) for landing and home pages that need fast scanning, a hierarchical grid for the video page to give playback visual dominance while keeping suggestions accessible, and a modular grid (4×4, 24px gutters) for catalogue browsing where items need to feel evenly weighted.
03 Design: Wireframes and Visual System
With the architecture validated, I moved into wireframes in Figma at an iPhone 11 Pro frame (375 × 812px), covering the full onboarding flow, the personalized home, the explore catalogue, content details, and the streaming viewer.
Each screen's grid was matched to its purpose: a multicolumn grid (8 columns, 16px gutters) for landing and home pages that need fast scanning, a hierarchical grid for the video page to give playback visual dominance while keeping suggestions accessible, and a modular grid (4×4, 24px gutters) for catalogue browsing where items need to feel evenly weighted.
04 Test: Validating with Real Behavior
Testing method: click maps and heat maps. After the first round of prototyping, behavioral data surfaced three specific friction points.
04 Test: Validating with Real Behavior
Testing method: click maps and heat maps. After the first round of prototyping, behavioral data surfaced three specific friction points.
04 Test: Validating with Real Behavior
Testing method: click maps and heat maps. After the first round of prototyping, behavioral data surfaced three specific friction points.
On Create Profile, users clicked the logo or back button instead of the "Sign in" link, since it blended into the visual hierarchy. I increased contrast and weight on that text.
On Create Profile, users clicked the logo or back button instead of the "Sign in" link, since it blended into the visual hierarchy. I increased contrast and weight on that text.
On Create Profile, users clicked the logo or back button instead of the "Sign in" link, since it blended into the visual hierarchy. I increased contrast and weight on that text.
On Membership Selection, attention scattered between the plan cards and the Proceed to Payment button, since users were unsure which action confirmed their choice. I collapsed this to one unambiguous interaction: select the plan, then proceed.
On Membership Selection, attention scattered between the plan cards and the Proceed to Payment button, since users were unsure which action confirmed their choice. I collapsed this to one unambiguous interaction: select the plan, then proceed.
On Membership Selection, attention scattered between the plan cards and the Proceed to Payment button, since users were unsure which action confirmed their choice. I collapsed this to one unambiguous interaction: select the plan, then proceed.
On Preferences & Interests, overlapping category labels slowed decision-making. I reduced the number of categories and sharpened each label to a single, clear meaning.
On Preferences & Interests, overlapping category labels slowed decision-making. I reduced the number of categories and sharpened each label to a single, clear meaning.
On Preferences & Interests, overlapping category labels slowed decision-making. I reduced the number of categories and sharpened each label to a single, clear meaning.
05 Final Solution
The finished prototype is a dark interface built for real-world conditions: commuting, dim lighting, quick decisions. A red accent drives every primary action, Roboto carries the typography across all weights, the layout follows an 8×8 modular grid with 24px margins, and interactive elements follow Material UI sizing so touch targets consistently feel right.
05 Final Solution
The finished prototype is a dark interface built for real-world conditions: commuting, dim lighting, quick decisions. A red accent drives every primary action, Roboto carries the typography across all weights, the layout follows an 8×8 modular grid with 24px margins, and interactive elements follow Material UI sizing so touch targets consistently feel right.
05 Final Solution
The finished prototype is a dark interface built for real-world conditions: commuting, dim lighting, quick decisions. A red accent drives every primary action, Roboto carries the typography across all weights, the layout follows an 8×8 modular grid with 24px margins, and interactive elements follow Material UI sizing so touch targets consistently feel right.
What I Learned
Information architecture problems often present as navigation problems until you look closer. The confusion between Topics and Library wasn't a labeling issue, it was that the two sections lacked distinct purposes; separating discovery from personal progress is what made the navigation work.
Personas also only hold value if they stay active through every decision, not just at the start. Returning to "would this help Rekha in 45 minutes?" at each step kept the design grounded in a real constraint rather than a theoretical one.
What I Learned
Information architecture problems often present as navigation problems until you look closer. The confusion between Topics and Library wasn't a labeling issue, it was that the two sections lacked distinct purposes; separating discovery from personal progress is what made the navigation work.
Personas also only hold value if they stay active through every decision, not just at the start. Returning to "would this help Rekha in 45 minutes?" at each step kept the design grounded in a real constraint rather than a theoretical one.
What I Learned
Information architecture problems often present as navigation problems until you look closer. The confusion between Topics and Library wasn't a labeling issue, it was that the two sections lacked distinct purposes; separating discovery from personal progress is what made the navigation work.
Personas also only hold value if they stay active through every decision, not just at the start. Returning to "would this help Rekha in 45 minutes?" at each step kept the design grounded in a real constraint rather than a theoretical one.