Vatrina: Building an AI-Powered Social Commerce Platform at Builder.ai

Vatrina: Building an AI-Powered Social Commerce Platform at Builder.ai‍

‍

Vatrina was one of the most ambitious projects I worked on during my time at Builder.ai. When I joined the initiative in early 2024, Vatrina existed only as an idea inside a brief: create a social commerce app for the GCC market that blends short-form video, livestream shopping, and AI-driven recommendations. There was no product, no roadmap, no user flows, and no clear definition of how merchants, influencers, and customers would coexist in one ecosystem.

‍

Over ten months, from February to December 2024, I led Vatrina from concept to launch. I owned the product end-to-end: defining the vision, building the feature set, writing hundreds of atomic user stories, designing the flows for every role, architecting the AI recommendation engine and conversational filters, coordinating the design and development teams, and pushing the app live on both iOS and Android. By the time we shipped, Vatrina had become one of the first GCC-native social commerce apps, built under Builder.ai’s umbrella but carrying its own strong product identity.

‍

Defining the Vision: Commerce Through Creators

From the start, I knew Vatrina could not behave like a typical marketplace. The GCC’s digital culture is heavily shaped by creators, influencers, and short-form video. People do not discover products by typing keywords into a search bar; they discover them through stories, reels, and live moments.

The vision I shaped at Builder.ai was simple but powerful: people should shop through content, not catalogues. Vatrina would be a place where customers scroll through videos and live streams, tap on what they love, and purchase instantly. Merchants and influencers would act as the storytellers of commerce, and the app’s intelligence would connect users to the right content and products at the right time.

This vision drove every strategic decision. It dictated that the home feed must be video-first, that the app should feel as fluid as TikTok or Instagram, and that discovery must be powered by a smart, AI-driven recommendation engine rather than static sorting rules.

Designing the Multi-Role Ecosystem and Super-flow

To transform the vision into a real product, I designed a complete ecosystem that connected three core roles: customers, merchants, and influencers. Each role had its own journey, but they all converged around a central experience: the feed, the catalogue, and the purchasing loop.

Customers started with onboarding and sign-up, then landed on a personalized home feed. From there, they could move into the AI Conversational Filter, explore the catalogue, browse through product cards, watch videos, add items to wishlists and carts, and complete purchases. Every step had to feel natural and fast, bridging the gap between entertainment and transaction.

Merchants entered a different part of the flow. They managed their catalogue, uploaded products, and created content that promoted those products. Inspired by how Instagram and TikTok treat creators, I ensured that Vatrina allowed merchants to promote their products through content, highlights, and livestreams rather than simple listing. They could schedule live sessions, push promotional units into the feed, and see how their products performed.

Influencers operated in yet another branch of the flow. They created and shared content, drove engagement around specific brands, and influenced purchases without owning the inventory. Their content fed into the same engine that powered the customer feed, meaning influencer and merchant content could coexist and reinforce each other.

To unify this complexity, I designed what became the Vatrina Superflow: a comprehensive user-flow diagram mapping every step across all roles. At the center of this visual sits the Vatrina node, with three major branches: customer journeys that move from home feed to AI filters to catalogue to purchase, merchant journeys that move from promotion to catalogue management to livestreaming, and influencer journeys that move from content creation to engagement and purchase influence. This diagram became the blueprint for both the design and engineering teams and a central artifact in Builder.ai’s internal alignment around the product.

Building the AI Recommendation Engine and Normalization Layer

A social commerce platform only works if the feed feels alive. It is not enough to list videos; the order and timing of those videos determine whether users stay, scroll, and eventually buy. That is why one of the most important systems I designed for Vatrina was the AI recommendation engine.

‍

I studied the logic behind TikTok’s engagement-velocity model, Instagram’s content graph, and X’s real-time ranking. Each inspired part of the solution: TikTok’s understanding of what delights users in seconds, Instagram’s ability to group visually and semantically similar content, and X’s way of pushing what is culturally relevant right now. But commerce brought additional layers: price sensitivity, stock, product similarity, conversion probability, and the performance of individual creators and merchants.

The engine I designed for Vatrina blended these worlds. It collected signals from four key dimensions: content behavior, product data, creator performance, and user intent. Every view, like, save, replay, share, and skip fed into the content signal layer. Product attributes such as price, discount, inventory level, and similarity clusters fed into the product signal layer. Past creator performance and conversion fed into the creator layer. The user’s browsing history, saved items, and conversational queries fed into the user-intent layer.

To prevent these signals from competing chaotically, I introduced an AI normalization layer, visually represented in one of the core diagrams. In the diagram, four signal blocks — content, product, creator, and user — funnel into a central “AI Normalization Layer” node. From there, the system outputs a stable score that drives the recommendation ranking and, eventually, the personalized feed. This normalization step was crucial because each signal type behaves differently; it allowed Vatrina to harmonize engagement metrics, price signals, and behavioral patterns into a single, coherent ranking model.

The result was a home feed that felt genuinely personalized. Users felt that Vatrina “understood” them, surfacing content and products that matched their style, budget, and interests, while still allowing for serendipitous discovery of new creators and brands.

Reinventing Search with AI Conversational Filters

Even with a powerful recommendation engine, there are moments where users want something specific. Traditional filters, however, are often frustrating. They force users into rigid combinations of categories, price sliders, colors, and sub-filters. For Vatrina, this approach would have broken the rhythm of discovery.

To solve this, I designed the AI Conversational Filter, which became a defining feature of the app. Instead of navigating menus, users could simply type natural language requests such as “show me elegant black dresses under 200 AED” or “I want affordable sneakers from Saudi brands.” The AI layer parsed the text, extracted entities like color, price range, and category, linked them to the product catalogue, and instantly reshaped the feed.

We represented this experience visually through a set of screen mockups: a dark-mode splash with the Vatrina logo, a chat screen where the user talks to Vatrina AI, and a home feed showing how the recommendations update. In the background, the conversational input becomes just another signal to the recommendation engine, enriching the user profile and refining future ranking.

In the user-flow diagrams, the AI Conversational Filter is a key node after the home feed. Customers move from the feed into the AI layer, express intent through messages, and then fall back into the catalogue and browsing experience with results filtered and sorted based on that conversation. This is where Vatrina differentiates itself from static marketplaces: discovery feels like a dialogue, not a chore.

‍

‍

Screens, Catalogue, Browsing, and Livestream Shopping

While the intelligence layer kept Vatrina smart, the frontend experience needed to feel delightful and simple. I worked closely with the design team to craft a set of core screens that showcased the catalogue and browsing experience, the AI chat, and the creator-driven feed.

The home feed became the main stage. It mixed live streams, video posts from influencers, community posts, and product-driven content in a way that felt organic, not transactional. Users could enter a live stream directly from this feed, watch a creator presenting products in real time, tap any product featured, and purchase without leaving the experience.

The catalogue provided a more structured browsing mode while still remaining deeply integrated with recommendations. Users could move from AI search into category browsing, view product cards enriched with video, and seamlessly transition into the purchase journey.

Livestream shopping had its own path in the super-flow. From the central Vatrina node, a livestream branch connects to both the customer and merchant sides: customers join the stream, interact via chat and reactions, tap on products, and complete purchases; merchants start the stream, manage the product queue, and track live performance. This makes livestreaming not just a feature, but a distinct commercial engine within the platform.

Launching Vatrina and Its Impact

By the end of 2024, under the Builder.ai umbrella, Vatrina had evolved from a rough idea into a fully launched social commerce app available on the App Store and Google Play. The project solidified a number of outcomes: a functioning, scalable architecture, an AI-driven recommendation and search layer, a clean and modern social feed, and a fully defined ecosystem where customers, merchants, and influencers could all interact meaningfully.

Internally, the clarity of the flows, the detailed feature notes, and the structured user stories accelerated development and reduced ambiguity for the engineering and design teams. Externally, Vatrina positioned itself as a first-of-its-kind GCC social commerce platform, combining video content, AI, and commerce into a single cohesive product.

Reflection

Vatrina represents the kind of product work I’m most proud of: starting from zero; shaping a vision and turning it into a real, shipped product; blending AI, UX, and business logic into a coherent experience; and building something that genuinely pushes the market forward. During my time at Builder.ai, this project became a proof point that complex, AI-driven social commerce experiences can emerge from our region, not just be imported from global platforms.

For your portfolio, this case study shows you not only built an app; you created an entire AI-powered social commerce ecosystem, from flows and architecture to recommendation logic and conversational discovery, and led it all the way from whiteboard to app stores.

‍