SHOPPABLE VIDEO · EDITORIAL COMMERCE
Turning a YouTube episode into a connected experience for watching, shopping, and exploring.
The moment that creates interest should also help someone find the product or place—without losing the story.
MY ROLE
Independent product strategy, UX/UI design, interaction models, and AI-assisted implementation
THE PRODUCT PROBLEM
Video descriptions flatten a rich story into a list of links. Viewers have to remember a product, search through the description, and work out which destination belongs to which moment. Places featured in the story are even harder to revisit.
SYSTEMS THINKING
The structure behind the screens.
I designed SOURCED around the episode as the organizing unit. Moments connect to products; products preserve their original destinations; featured places connect to timestamps and a browsable map. The visual experience follows the creator’s brand, while the interaction model can support other stories.
- A working YouTube embed with chapter controls that jump to the selected moment.
- A contextual Shop the Moment rail and a full-episode product gallery.
- Explicit labels for exact products and creator-designated alternatives.
- A Harlem discovery map, category filters, destination detail, and links back to the relevant video moment.
DESIGN DECISIONS
Use the moment as the interface
Selecting What’s In My Bag? moves the video to 09:22 and changes the shopping context. The viewer does not have to reconcile two unrelated lists.
Preserve trust in the recommendation
Exact items and similar alternatives have different labels. The creator’s original links remain the destinations rather than being replaced with invented recommendations.
Connect commerce with discovery
The episode includes neighborhood businesses and cultural places, not only products. A map and destination cards support exploring the story beyond checkout.
FROM PRODUCT THINKING TO CODE
AI-assisted building. Human product judgment.
I use Cursor, Claude, and Codex to make product ideas testable in code. I define the problem and interaction rules, direct the build, inspect the working experience, and iterate on behavior and visual detail. The tools accelerate implementation; product judgment and release decisions stay with me.
CURRENT RESULT
The live demo brings together 12 linked product picks and 25 named Harlem hotspots. The chapter transition, product context, and map are working interactions. Conversion and engagement impact have not yet been measured.
WHAT THIS TAUGHT ME
A shoppable experience becomes more useful when it preserves editorial context. The reusable system is the relationship between story, moment, item, and destination—not a generic grid of products.
EXPLORE THE WORK
Explore the Sunday Stroll demo ↗Watch Tiffany’s original episode ↗See the Société case study ↗