Development of a Live Shopping Platform With Video Broadcasting

Description

LIVETAG is a video streaming platform for built-in interactive shopping. The solution integrates with e-commerce stores, which ensures a higher engagement of viewers in their purchases at the time of the video presentation.

Tech stack

Frontend & Backend:Yii2 PHP, Angular 11, Centrifugo, SvelteJS, JQuery, Swagger, OBS

iOS:Swift, RXSwift + MVVM, Storyboards

Android:Android SDK, Kotlin, MVVM, MUX SDK

Our role

UX/UI Design, Mobile & Web Development, QA, DevOps, Support

The challenge

The client approached us with the idea of creating a solution for purchases in real-time video broadcasts. According to the client, this platform should integrate with retail stores to synchronize the product assortment. The task was to create a service that would allow broadcasting videos with a built-in shopping cart on all popular streaming platforms. However, our proposal was not initially appropriate for the client's budget.

As a result, the client turned to another team from India. But the quality of their code, solution improvements, and the product's scaling did not suit the founder, so the project was returned to us with new tasks. The key goals at this stage were complete refactoring and improving the solution considering the ready-made base from the previous team. Also, there were strict deadlines since the previous IT contractor took a lot of the client's time.

Project management

After the project returned to Rocketech, we firstly assembled a complete team of specialists under the tech stack selected by the previous contractors. So, the current version of LIVETAG was built in 2 iterations:

Updating and finalizing the basic version of the solution with refactoring on all platforms;
Scaling the widget and introducing necessary functions.

Iteration 1

We devoted this stage to updating the platform's web version and Live Video mobile products. We provided:

Improving the stability of the solution through refactoring the front-end/back-end architecture;
Building algorithms for integrating solutions with e-commerce platforms;
Developing an iOS/Android app for broadcasts;
Adding tools for managing videos and chat;

Implementation of payment algorithms;
Setting the prioritization of displaying products in videos;
Implementation of a player for broadcasts.

As a result of the first stage, we received a completely viable product with the functionality essential for work.

Iteration 2

We devoted this stage to improvements and bug fixes after the previous development team, as well as optimizing the solution for the needs of users. A significant challenge for us was expanding the team with narrow-profile staff under the LIVETAG tech stack updated by the previous team. At this stage, we:

Improved the web version of the solution to simplify interaction with e-commerce users;
Transferred the solution to a new player;
Optimized streaming function with multichannel broadcasting capability;
Improved the ability to manage and work with finished videos in the playlist;
Improved payment functionality for internal currency conversion;

Added a shopping cart and payment to the video broadcast;
Introduced an online chat to communicate with viewers;
Created a statistics section with all data on viewer engagement;
Improved integration with e-commerce to display detailed information on advertised products.

Of the second stage, we have received a modern hybrid video trading format, cheaper than similar ready-made solutions, as the customer required.

Have a digital product idea but don't know where to start?

From the initial market research to launch — we'll happily guide you throughout your business journey.

Integrations

We developed a set of standards for integrating the widget with popular online store platforms like Woocommerce, Magento, Shopify, and Octopus. In addition, our engineers built algorithms for personalized integration of e-commerce with the shopping cart during the broadcast. It allows tracking data on product assortment and balances in customer bases synchronized with the web store.

Video

Our team made a painstaking but essential transition from Vonage to MUX player. That's why LIVETAG now contains videos in HD quality only. Thanks to a new player in the widget, it became possible to store and efficiently manage all the saved videos in the playlist. In addition, with the new MUX player, users can trim videos from past streams in the admin panel in a matter of seconds.

Streaming

Rocketech engineers optimized streaming processes by introducing the OBS Studio utility. With the transition to this advanced tool, users can upload ready-made edited videos. In addition, combining the capabilities of the MUX player with a new utility allowed multistreaming and sharing videos from Facebook, Whatsapps, Weibo, Twitter, Youtube, LinkedIn, Pinterest, and custom RTMP servers. And with Yellow Duck, companies can even stream live on Instagram.

Analytics

With a well-formed backlog list, the right streaming tools, and a player introduced by the Rocketech team, the LIVETAG widget can collect analytics. So, we built algorithms for collecting and displaying data on viewers, video quality, technical systems used on the viewer's side, likes, items moved to the cart, and purchased items from the video. Such information greatly simplifies the analysis of user experience for further improvement of Live Video platform clients.

Live Shopping

The most valuable tool for LIVETAG users is the ability to view the store's products and buy them while watching the video. Our engineers added the ability to view detailed product information during streaming or replay. Moreover, users can immediately view their shopping cart and pay without leaving the online streaming video.

Chat

An important addition to edited broadcasting videos is chatting with users. Sales managers or company representatives can keep users active and engaged by responding to comments or questions right on the air. The chat supports manual moderation, which allows deleting of spam or erroneous messages.

Numbers

5

e-commerce platforms available for integration

7

social media supports online streaming

10

kinds of custom player settings

20

seconds is a broadcast delay with instant reconnection

10,000+

users can be connected to the stream to purchase at the same time

Review

I want to keep them on as long as possible.

Cecilia Tan

Product Owner and Marketing Manager, Livetag SG

Results

Refactoring the web solution and mobile applications on iOS and Android for complete and trouble-free operation in a very tight time frame.

Development of a cross-platform widget for e-commerce solutions, which is several times cheaper than similar advanced products.

The high video quality that really pleases the viewers and increases sales with its look.

A huge number of video management attributes that allow broadcasting both Live and production materials.

A personalized player that strengthens the branding of advertisers.

An extensive list of analytics tools that help to optimize the video sales strategy of brands.

Chat for users and the brand, which helps to keep users involved in product presentation.

Next Case

Talk to us!

Send us a message and we'll get in touch with you as soon as we can.