Case Study

How The Man Company Expanded Marketing Reach with New Features

Industry

E-commerce

Core Technologies

LiquidReactJSShopify

Challenges

The main challenge that The Man Company was facing was the problem of very slow site speed. Their website was slow loading, which had several negative implications. In today's fast-paced digital world, the importance of user experience cannot be understated. The audience expects websites to load quickly and does not have patience. They also need a smooth browsing experience.

If a site takes longer to load, the users quickly become frustrated and abandon the site. This leads to fewer conversions and high bounce rates. 

One of the main challenges faced by The Man Company was the issue of slow site speed on their website. A slow-loading website can have several negative implications for an online business, including lower customer satisfaction, decreased user engagement, and potential loss of sales. 

Search engine rankings are also affected when the website speed is slow, as they may affect the company's online presence and growth. 

Client Requirements

  • Search Tab: Implement a search tab on the homepage for users to easily search for products. 
  • Loyalty Program and Products Page: Integrate a loyalty program and create a dedicated products page. 
  • TMC 2.0: Upgrade the website to Shopify 2.0 
  • Discount Code and Side Cart: Implement a discount code feature and a side cart on the website. 
  • Client Dependence for UI Templates: Develop templates for different product categories to allow clients to independently manage the UI. 
  • CYOB (Curate Your Box): Enable customers to curate their product boxes. 
  • XYZ Collection for Gifts: Create a collection of products for gifting purposes. 
  • Product Bundles: Implement the ability to offer product bundles on the website. 
  • Blog and Podcast Pages: Create dedicated pages for blogs and podcasts on the website. 
  • Dynamic Product Images: Display product images based on selected variants. 
  • Estimated Delivery Time: Provide estimated delivery time for products. 
  • Product Combinations: Enable the display of product combinations on the website. 
  • Upsell Products Inside Cart: Include upsell products in the side cart feature. 
  • Free/Single GWP (Gift with Product): Offer gifts with specific products based on defined price ranges. 
  • Multilevel GWP: Provide different levels of free products based on order value ranges. 
  • Code-based GWP: Customers can apply a discount code to receive free products. 
  • Two Checkouts: Implement the Go Kwik and Shopify checkouts. 
  • Cart: Include mobile number verification during checkout and require OTP (One-Time Password) for Cash on Delivery (COD) orders. 
  • Discount/Coupon Codes: Enable discount or coupon codes for products. 

Solutions

For site speed improvement, the following actions were taken:

  • Removal of unnecessary apps: Unnecessary apps were identified and removed from the website to reduce the load on the server and improve overall site performance.

  • CSS optimization: Multiple CSS files were consolidated into one file, reducing the number of HTTP requests and improving loading times.

Integration of search tab app for search and Flits for products page and Loyalty programs.

  • We created a UI toolkit for the client, allowing them to have a set of pre-defined design components, styles, and elements that can be easily applied to various website sections. This toolkit streamlines creating consistent and visually appealing UI across different product pages.

  • The defined font family ensures that a particular set of fonts is consistently used throughout the website, contributing to a cohesive and professional visual identity.

  • With the title defined on the homepage, we have established a standardized format for the main titles or headings displayed. This maintains consistency and reinforces branding across different sections of the website.

For delivering estimated times, we used the following process:

Delivery Process TMC

  • Retrieve CSU File: Obtain the CSU file with relevant information, including delivery time details.

  • Understand the CSU File Structure: Analyze the structure and format of the CSU file to determine how the delivery time information is presented within it. It may involve identifying specific fields or sections related to delivery estimates.

  • Extract Delivery Time Data: Extract the necessary delivery time data from the CSU file. This will involve parsing the file and locating the relevant fields or sections that contain the estimated delivery information.

  • Convert to JSON Format: Transform the extracted delivery time data into JSON format. JSON (JavaScript Object Notation) is a widely used data interchange format that is easy to read and easy to use.

  • Create JSON Structure: Organize the extracted delivery time data into a JSON structure. This generally involves creating key-value pairs where the keys represent the relevant attributes (e.g., product IDs), and the values represent the corresponding estimated delivery times.

  • Validate and Format JSON: Ensure the converted JSON adheres to the correct syntax and is properly formatted. Use JSON validation tools or libraries to validate the JSON structure and ensure its integrity.

  • Store and Access JSON Data: Save the converted JSON data in a suitable storage system or database.

This procedure allowed us easy access to the estimated delivery time information when needed. 

Apart from this, we have provided various solutions, from curating gifts for customers to discounts and coupon codes.

Technologies and Tools

E-commerce Platform

Shopify 2.0

Frontend Development

React, Liquid

Backend & Customizations

Shopify API Integrations

Performance Optimization

CSS & JS Minification, App Reduction

Results

arrow-icon

Improved User Experience: TMC wanted to give its users a smoother and more pleasurable experience, so Lucent Innovation improved site speed, added a search tab, and optimized the UI. These enhancements resulted in increased user engagement, lower bounce rates, and more customer satisfaction.

arrow-icon

Conversion Rates may have Increased: Including options like product bundles, side carts, and discount codes can increase conversion rates. TMC can entice customers to make purchases and boost sales by providing incentives, streamlining the checkout experience, and offering appealing combinations of products.

arrow-icon

Increased Customer Loyalty: With the help of Lucent Innovation, TMC has launched several initiatives, such as curated gift boxes and discount codes/coupons. These tailored and satisfying interactions encourage customers to purchase from TMC and may lead to brand advocates.

arrow-icon

Operations Simplified: Lucent Innovation developed a UI toolkit. Operations for TMC were streamlined due to the development strategy that prioritizes client independence and the creation of a UI toolkit.

arrow-icon

Expanded Marketing Possibilities: Adding podcast web pages, blog pages, and dynamic product photos gave TMC additional marketing possibilities. These features allowed for creating content, telling stories, and promoting products, which attracted and engaged a larger audience.

Words of Appreciation

"We are grateful to Lucent Innovation for their help. They not only fixed our slow website but also added great features like search tabs and product bundles, which made the shopping experience easier for our customers. We are very happy with the results and appreciate their support."

Rajesh Kumar

Chief Technology Officer

One-stop solution for next-gen tech.