At ReelPlus, our product team set out to bridge the gap between short-form video content and seamless product discovery. While many e-commerce platforms were embedding video, the interactions often felt fragmented—disrupting the user flow and lowering conversion. Working closely with developers and product managers, I led the design of a reusable modal system that unified video playback, product exploration, and cart actions into a single uninterrupted experience. Inspired by native mobile gestures and powered by Polaris, the result was a flexible, high-converting solution that worked across desktop and mobile.
I worked as a UX/UI Designer, collaborating closely with the product manager, developers, and QA throughout the design cycle. My contributions focused on: Designing the interaction patterns and responsive layouts Ensuring Polaris design system compliance Testing mobile gestures and addressing user feedback This project lasted approximately 6 weeks and included ideation, prototyping, usability testing, and design iterations.
Although merchants were increasingly using video to showcase their products, the shopping experience remained disjointed and inefficient. Existing solutions would interrupt the flow—clicking on a product tag often paused or exited the video, and in most cases, the user would be redirected to a separate product page or new tab. On mobile, the experience was even more fragmented, lacking the intuitive gestures users had come to expect from platforms like Instagram or TikTok. As a result, users were often pulled away from the content before they had a chance to explore or purchase products, leading to missed conversion opportunities and shorter engagement time.
“I was watching the video and wanted to see the product—but it opened in a new tab and I lost my place. Can’t I just shop without leaving the video?”
The main objective was to create a fluid and uninterrupted experience that allowed users to explore and shop products directly from within a video. Instead of redirecting them to new tabs or pages, the solution needed to keep users immersed in the content while making it easy to view product details and add items to the cart.
From a business standpoint, the goal was to increase product engagement, especially on mobile, and reduce friction in the purchase journey. We also aimed to build a reusable modal system that could support different types of video formats with minimal development overhead.
We began the design process by identifying key friction points in the existing video shopping experience. Through internal audits and user observations, we realized that forcing users to leave the video—whether to see product details or complete a purchase—was breaking the natural flow of interaction.
On desktop, we introduced a split-screen modal that preserved the video on the left while displaying full product information on the right. This allowed users to stay anchored in the content while still being able to browse, zoom, and add items to their cart without interruption.
For mobile, we focused on replicating native, gesture-based behaviors. We implemented vertical swipe navigation inspired by platforms like Instagram Reels and TikTok, enabling users to browse through videos naturally. Product cards appeared as interactive overlays that responded smoothly to taps and swipes.
Throughout the project, we stayed aligned with Shopify’s Polaris Design System. We extended its core components to meet the specific needs of our UI while ensuring accessibility and visual consistency. The final design was modular and reusable, later serving as a foundation for multiple shoppable video widget types including carousel, floating, and fullscreen formats.
The new shoppable video modal significantly improved both engagement and conversion metrics. By keeping users in context and allowing uninterrupted interaction with both video and product content, we created a more immersive and effective shopping experience.
Product interaction increased by 30%, as users were now able to explore product details without leaving the content. On mobile, engagement time went up by 22% thanks to native-feeling swipe gestures and gesture-aware autoplay. Most notably, the add-to-cart rate from within videos rose by 18%.
The reusable architecture of the modal system also led to a 40% reduction in development time for other video widget formats such as carousels, floating players, and full-screen stories. User feedback was overwhelmingly positive—many compared the experience to Instagram Reels, but with the added bonus of seamless shopping.
