We built a Live Shopping platform that allows customers to embed the entire live-shopping experience directly on their store!
Imagine that clients can watch video directly on your www and BUY from it - in one click!
They can even browse your webpage while still watching video in Picture-in-Picture.
And you don’t miss that you built on social media - you can restream the entire show to your facebook or instagram accounts and draw people to your site.
When they lose focus they will start browsing your e-commerce - not facebook feed!
Project: Live Shopping solution
Our project to build an effective and innovative live shopping solution for e-commerce is a plug-in that meets the needs of modern e-commerce. Three most important features :
- Purchasing products straight from the live stream - clicking on the highlighted products automatically moves to the product card with the accompanying live, no matter on which channel clients are watching. They don't lose focus for a second, so they stay up to date.
- Multistreaming - simultaneous streaming on 4 channels (Facebook, Instagram, Youtube, www) allows you to quadruple your reach and significantly increases sales.
- Simplicity - significant cost reduction thanks to a solution that allows one person to stream on one device.
This solution allows e-commerce companies to create and run innovative live streams shopping - We know the limitations of social media and that is why we combine the advantages of social commerce with traditional e-commerce, increasing both reach and conversion.
Read below, how we manage to create that solution.
Challenge - Towards improvement of e-commerce live shopping streams
Product is designed to support the e-commerce activities of the organization and enable them to reach as many customers as possible through its social media channels by live streaming on these platforms. With all this, the plug-in had to be easy to use, which would allow for simple and fast integration. Additionally, it must have been intuitive enough for the end customer to have no problems with participating in the live stream and making purchases. To achieve these goals, Flyps had to:
- successfully integrate the plug-in with Facebook, Instagram and Youtube,
- allow end clients to shop straight on the live stream,
- provide a simple solution that allows you to manage live shopping using a single computer/phone all by one person.
- provide simultaneous live streaming capabilities on all integrations at once,
- enable interaction both on the website and in social media (and enabling the live organization to manage comments from all sources simultaneously),
- allow saving the broadcast as VOD with full sales functionality!
The solution - building the live shopping plug-in
All the infrastructure needed to run Vidvi is on Google Cloud Platform (GCP). We use Pulumi to manage resources in different environments (separate projects on GCP) and the proper Vidvi services are deployed on Kubernetes clusters.
As a CI, we used Github Actions and deployments on specific environments were managed using Flux CD. Below we present services that enable Vidvi to function so effectively:
Organization Manager (OM)
OM is responsible for managing Vidvi users - this is where the logic for logging in, registering, editing account and organization settings, add-ons or plans that the customer is using at a given moment is contained here. In addition, OM is responsible for authentication and/or authorization with other services included in Vidvi.
Stream manager (SM)
The focal point of Vidvi's operation - SM is to manage broadcasts, their lifecycle and strongly related things like products and coupons. This is where the addresses where a given transmission is to be retransmitted or which products and coupons are currently highlighted are set.
RTM server (RTM)
RTM (real-time messaging) is the service responsible for the operation of chat on Vidvi. It is distinguished by the use of Websockets to minimize delays between sent messages or reactions. It is also this site that moderators use to remove unwanted messages or highlight messages to help the broadcaster. In addition, RTM supports sending and receiving messages from supported integrations such as Facebook to create one common chat for users watching the broadcast on different sites. In addition, it is used to immediately notify viewers that, for example, a new featured product has appeared, and thus viewers can see it without delay.
Transcoder + RTMP proxy
A dedicated instance of this service is created for each transmission. It is responsible for things like ingesting the RTMP stream from the broadcaster, transcoding to different quality and segmenting to HLS format. In addition, it has a module, which we call RTMP proxy, which accepts an RTMP stream and redirects it to many destinations at once, such as Youtube or Facebook.
Notification Center (NC)
NC is the central point from which users are notified about important events on the Vidvi platform, such as automatic termination of a broadcast that the user might have forgotten. It is also thanks to this service that you can track exactly what exactly happened during a given transmission.
Analytics Service (AS) & Reporting Service (RS)
Many statistics are collected during the transmission, such as the number of users in a given minute, the number of messages sent or the number of products added to the basket - AS is where all this data comes, and RS is responsible for periodically processing it so that the user can see already aggregated values and graphs.
Integrations with social media
Vidvi, at the moment, is integrated with three social media platforms:
As part of the integration, it is possible to automatically create broadcasts and retransmit video from Vidvi to these platforms, but also combine chats from these platforms to create one chat where users from different platforms can talk, and moderators can manage these chats from one place. In addition, in order to provide viewers with at least a substitute for Vidvi player functions, automatically generated messages are sent when a product or coupon is highlighted.
Additionally, there is possibility to integrate with any other platform that allows streaming using RTMP.
Techstack for live shopping plug-in
If you’re curious how we managed to build a functioning plug-in, and what technology we relied on, see the figure below:
Conclusion - successful live shopping plug-in.
Creating a live shopping plug-in, or actually creating an effective and popular live shopping plug-in, requires:
- well-prepared front-end,
- properly prepared integrations,
- introducing functionalities that facilitate the work of both people organizing live streaming and end customers doing shopping.
Since Flyps created the entire project (and taking into account its specificity), we had to focus on the needs of organizations using the boost their sales plugin as well as on the end customers to provide them with the best user experience.
Without false modesty, our team of experts handled this task perfectly! Thanks to this, the plug-in helps e-commerce companies to significantly increase the reach of their live sales - thanks to multistreaming to the aforementioned platforms, Vidvi customers enjoy quadrupled reach and sales increase.
And about client: Vidvi - e-commerce product company.
In this case, we worked for a product company that intended to launch a revolutionary product on the market, a live shopping platform that allows you to conduct live shopping on many platforms at the same time.
The client entrusted Flyps with full responsibility for the creation of the product, both from the strictly technical side as well as the creation of features that will affect the business decision makers of potential clients.