Saral Homes - Custom Calculator App

Challenge: Saral Homes, a company known for its high-quality products, faced a critical obstacle: their online ordering system lacked the ability to offer custom-size pricing. This meant frustrating experiences for both customers and the company.

  • Frustrated Customers:  Customers seeking products with specific dimensions couldn't get instant quotes, leading to a cumbersome post-order process with delays and uncertainty.
  • Inefficient Operations: Missing custom dimension data resulted in repeated customer contacts for clarification, creating unnecessary delays and communication gaps.

Solution: A Custom Calculator App

We partnered with Saral Homes to develop a custom app that streamlined the online ordering process for both customers and the company. Here's a breakdown of the technology behind the app:

  • Tech Stack: The app leverages a combination of modern technologies: Node.js, Express.js, React.js, MongoDB, Polaris, and GraphQL.

Building the App:

  • Starting Point: We utilized a pre-existing developer template to expedite the development process.
  • Database Setup: A MongoDB database was established to store information about custom size calculators and associated pricing details. Mongoose was used to define the data structure.
  • Calculator Information: This includes calculator names, size limitations (width/height), and links to product and price tables.
  • Price Table: This stores sets of prices based on different size combinations (width, height, and corresponding price).
  • Connecting the Pieces: The database was seamlessly integrated with the app, allowing for creation and management of calculators and price tables.
  • Frontend Development: Utilizing React and Polaris, a user-friendly interface was built. This interface enables users to:
  • Create, edit, and delete custom size calculators and price tables.
  • Link price tables to their respective calculators.
  • Manage product inclusion within each calculator.
  • Testing and Implementation: The initial app version was installed on a test store to ensure functionality and a user-friendly interface.

How It Works:

  1. Automated Pricing: When a product page loads, it retrieves the size range (width and height) for that specific product. As the user enters their desired dimensions, the price automatically updates, reflecting the chosen size.
  1. Adding Custom Products: When a customer desires a specifically sized product, the system handles creating a unique product variant within the backend. This is achieved through an API that integrates with the user's input and chosen product ID. Utilizing Shopify's GraphQL API, a new variant with the custom size is created. This newly created variant is then added to the customer's shopping cart, allowing them to proceed with the purchase.

Saral Homes' custom calculator app exemplifies the power of technology in enhancing customer experience and operational efficiency. This solution empowers customers with custom size options, while ensuring smooth communication and streamlined order processing for the company.