About the Brand:

Gourmet Garden is an fresh produce store. They can deliver their fresh produce to limited zip codes in limited cities

Problem Statement:

Gourmet Garden wanted the following features:

1. Only the products that can be served in particular Zip-Code to be shown to a customer from that particular Zip-Code. For this, every user had to enter their Zip-Code to browse the website. The Zip-Codes – product mapping is to be done via locations that are created in Shopify
2. They wanted to offer 2 types of delivery options for qualifying products (based on location) in the cart: Express and Standard Delivery.
3. Only a limited no. of products which are stocked at a particular location id are to be available for “Express Delivery”.
4. Any user can choose delivery option “Express” or “Standard” based for every product and timeslots.
5. The shipping rates that are applied to the checkout would depend on no. of products selected for “Express” or “Standard” delivery.

Issues: 

1. On Shopify frontend, there is no way to identify a products location-based inventory.
2. A UI need to be there which clearly defines the availability of each product with respect to the Delivery Type.
3. The Shipping amount calculation is to be dynamic based on no. of products and delivery method.

Solution:

1. Since location-based inventory for variants is not available on the frontend. We needed to create an API to fetch that. We decided to create a database to store location-based inventories for all variants in the store and sync it with Shopify using webhooks. We also created a reconciliatory job using GraphQL Bulk Query to make sure the Database is 100% in sync without any latency. We created an app which used this database to deliver the required API. Using the API, we were able to detect what products can be shown for any Zip-Code added on the frontend.
2. We also created a backend UI where the admin can configure settings related to location id, Zip-Codes, timeslots, shipping charges, etc.
3. For Products-Delivery Type-Time-slot selection, we created a UI/UX on the contact information page. Using the information from the location API and time-slot settings we were able to create a very smooth user experience.
4. For Calculated Shipping rates, we registered our app as a Carrier Service and setup the API’s for Carrier Service to calculate and serve the shipping rates as per the admin settings.

Result:

Using Shopify’s robust GraphQL bulk Query and Rest API’s and the ability to customize checkout in Shopify Plus, we were able to build a very powerful yet very lean solution for the brand. We were able to help the brand in being able to provide “Express Delivery” (Same Day Delivery) to some of its products to the customers and can charge extra for those as well. We were able to help the brand so that now they are able to serve a larger customer base who are looking for same day delivery and are willing to pay for it.