Keep Calm and Save Ukraine

ClickImage

An efficient SaaS Ecommerce platform for businesses and individuals to add hotspots to images on their websites

Project description

It is a well-known truth that a picture is worth a thousand words. Just looking at a shot, a person can catch extensive information easily and effortlessly. Thus, hotspots have become one of the most crucial tools for making still images more engaging and informative.

Our team created a highly operative SaaS platform enabling users to add contextual pop-ups to required images and display all necessary data with a click of a mouse. The solution consists of a landing page, an admin panel, SPA, back-end API and DB, XML Parser, and an update module. We integrated payment and analytical systems into the product. Also, our specialists added a massive icons library.

Project team

2 Developer
1 QA engineer
1 DevOps
1 PM

Problem introduction

Our client is the founder of the leading banner approval platform. He came to us with the idea to build a responsive web application that would boost sales and automate marketing activities of various e-commerce websites, starting from a shop blog to massive marketplaces.

His main objective was to provide businesses with a comprehensive solution encouraging customer interaction and engagement by adding customizable hotspots (for web) or taps (for mobile) to any image and quickly providing any valuable information, including a product feed and promotional videos.

Tech Challenges

Since the project was not a common eCommerce platform with a set of standard features, we had to cope with several challenges. Firstly, our team’s task was to make the script work well on any website. It was rather tricky without having access to every e-commerce website on the web. To resolve this issue and allow easy debugging during script development, we created browser extensions that add the test script to the visitor’s webpage and thus enabling us to test our solution on dozens of websites. Also, the inbuilt script did not have to affect the website’s performance and loading times. To meet this requirement, our specialists built sophisticated algorithms based on data retrieved from a performance monitor incorporated into our test browser extensions, performing all necessary calculations.

Secondly, our designers dived deeply into the vector image world, configuring SVG colors, shapes, and opacities. Besides, we created our custom solution for downloading and parsing XML files of Google Shopping product feeds.

Finally, this product is a kind of a cross-platform and cross-service solution. So, we had to pay special attention to the integration issue and monitor any changes and conflicts. Our team added an elaborate notification system handling a vast range of errors.

Despite all the challenges, we really enjoyed working on this project and succeeded in delivering a premium product within a limited time.

Core Functionality:

Customizable image builder
XML Parser
Single-time script implementation
Product feed connection
Multidimensional subscription module
Integrated payment system
Extensive management options via admin panel

Solution

Our team developed a unique and sound web application to help e-commerce businesses and individuals increase their sales and automate promotion activities. They can create hotspots, locate them directly on images, customize them, fill in all necessary information about a particular product, add team members or transfer account ownership, add google product feed links, etc.

We provided users with a secure solution enabling them to customize the script independently without fear of data leakage. A dependency on the FontAwesome icons library serves as a source of plain icons for hotspots. Additionally, our specialists introduced the back-end and cloud infrastructure, which queues XML feeds, parses them, executes scheduled updates, and signalizes errors, if any.

Finally, our subscription system facilitates monitoring the process of exceeding the subscription plan limits by notifying users. In case of no reaction from their sides, it simply pauses sync for the XML and informs customers once it is paused. The admin panel’s framework is transparent and allows administrators to view, edit, create, and delete subscription plans directly in the main platform administration tool instead of going to the payment gateway dashboard.

Result

The effective and convenient web application
Easy-to-use hotspots creation
Possibility of creating templates
Customizable tooltips and hotspots
Update module for scheduled actions and notifications
Integration with Chargebee and Google product feed
Implementation of GTM and GA
AWS infrastructure
Advantageous and functional admin panel for users, teams, and subscription plans management
Informative landing page