Recipes
Retail

Increase loyalty and revenue by personalizing in-store pickup experience

In this recipe, we will highlight how to build an application that in-store sales reps can use to look at a user’s online purchase history during a BOPIS (Buy Online Pickup In-Store) scenario and offer a loyalty coupon for same-day in-store purchase.

Retool

Made by Retool

It’s been a year with a decade’s worth of e-commerce growth, and retailers have needed to flex their online channels like never before. 

At the same time, new developments are making in-store shopping possible again, and many retailers are hoping to combine these battle-tested online channels with more in-store options as a way to entice more shoppers and grow revenue. 

To create this hybrid retail experience, retailers will need to ensure that every online and in-store experience builds on the last—it needs to be a customer-first (not channel-first) approach. And Twilio customers have a unique advantage. Developers can use the suite of Twilio APIs to spin up differentiated hybrid retail experiences in days, not months. In this recipe, we’ll show you can build apps that empower in-store retail employees to create delightful and revenue-driving experiences—all using the Twilio Segment, SendGrid, and messaging APIs with Retool, a leading low-code app builder.

Step 1: Capture user behavioral events and traits

We start by capturing customer data in Segment. To enable this, please follow these steps:

  1. Login to Segment App.

  2. Create a source for each web, mobile, or server application that holds eCommerce events

  3. Make sure to capture as much of the eCommerce spec as possible across all channels

    eCommerce Funnel Events
  4. (Optional) Capture a preferred_channel trait for your users such as email, sms, etc.

  5. Create a server source in Segment that will capture store visit events. Keep the write key handy to be used in Step 5.

  6. Navigate to Profiles → Profiles Settings.

  7. Click ‘Sources’ and ensure these sources are flowing.

segment-source-debugger

Step 2: Enable Segment profile API backend

Segment takes customer data security extremely seriously; hence, this step requires a one-time engineering intervention to ensure a properly secured proxy service is leveraged to provide customer data. 

The reference guide for Segment Profile API is available here. A sample AWS lambda implementation can be accomplished easily using these steps or please contact your Segment account team for more options:

  1. Clone this sample repo

  2. Install the serverless framework using the command npm[/yarn] install -g serverless. Detailed instructions are available here as well.

  3. Configure AWS credentials as listed here.

  4. Create a file under the src directory named prod.env.json with Segment credentials:

    { "PROFILE_API_TOKEN": "<TOKEN>", "SPACE_ID": "<SPACE_ID>" }
  5. Run serverless deploy --stage prod to deploy

  6. Create an IAM user with the proper credentials to invoke this lambda function as per these instructions. You will need this again in Step 5.

Note: Retool offers additional security options such as SSO that can be leveraged to further tighten the scope of who can access customer data.

Step 3: Setup SendGrid (Email)

In this application, the store rep will be able to send a loyalty coupon or product recommendation to the customer picking up in-store. If the customer’s preferred channel is email, we will use SendGrid to send the loyalty coupon or product recommendation information in an email.

If you do not have a Twilio account, we highly recommend doing the SendGrid 5 minute quickstart to get setup. After you are done, please keep the API key handy to be used in Step 5. Otherwise, generate an API key in your current account to be used in Step 5.

Step 4: Setup Twilio (SMS)

In this application, the store rep will be able to send a loyalty coupon or product recommendation to the customer picking up in-store. If the customer’s preferred channel is SMS, we will use Twilio to send the loyalty coupon or product recommendation information in an SMS.

If you do not have a Twilio account, please follow this quickstart guide. Obtain your Account SID and Auth Token from the console to be used in Step 5.

Step 5: Connect Retool and deploy the app

You can now get started with this application in one click by visiting https://retool.com/templates/twilio-segment-app. Click to clone the template and sign up for Retool.

You’ll then be in the app editor view where you can configure your application. First, we are going to connect our resources which are the various APIs (internal or 3rd party) and DBs we need to build an app.

Connect Segment

We’ll want to connect the Lambda function that you wrote to connect to your Segment Source in Step 3.

  • First, you’ll want to go to the resources page and add a Lambda resource. Then enter a name, AWS region, Access Key ID and Secret. More information on connecting to Lambda here: https://docs.retool.com/docs/lambda-integration.

  • Then in the app editor connect all the Lambda queries to that new resource by selecting it from the resource dropdown at the top of the query editor.

connect-segment-retool

Then we’ll want to create a REST API resource.

  • You’ll want to go to the resources page and add a REST API resource. Then enter a name and the base URL: https://api.segment.io/v1/track.

  • For authentication, select Basic Authentication and then enter your API key in Basic auth username with no password. More information on connecting to REST here: https://docs.retool.com/docs/apis.

  • Then in the app editor connect the REST API query to that new resource by selecting it from the resource dropdown at the top of the query editor.

Connect Twilio Sendgrid

Next, we’ll connect the Sendgrid resource function that you created in Step 4.

  • First, you’ll want to go to the resources page and add a Sendgrid resource. Then enter a name and your access token. More information on connecting to Sendgrid here: https://docs.retool.com/docs/sendgrid-integration

  • Then in the app editor connect the Sendgrid query to that new resource.

  • In the body of the query, you’ll want to replace “email” with the Sendgrid registered email that you want to send emails from.

Retool App in Production

And that’s it! Click Preview and you’ll see the Retool app from your users perspective complete with customer data powered by Segment Profile and personalized multi-channel outreach from Twilio Messaging and Twilio Segment.

(Optional) Step 6: Test drive and additional options

Here's how to take your app for a test drive:

  1. Enter the email address of a recent online purchase

  2. View all user attributes and event history

  3. Record a store visit and see it appear in Segment as part of the user profile

  4. Send a coupon or recommendation that will drive the customer to a same-day store purchase

retool segment twilio gif

Additional Options: Once the earlier steps are completed, you have both customer data and your communication channels available to you. Without needing any engineering effort, you can easily add more message types and workflows to enable your in-store sales reps to drive further revenue. 

Wrapping up

Here’s what we’ve done in this recipe:

  • We built a Segment Profile API proxy to query customer data in a secure method

  • We configured Twilio and SendGrid messaging APIs to send personalized email/SMS based on a customer’s preferred communication channel

  • We leveraged the pre-built Retool template to enable store reps to leverage Segment customer data and Twilio/SendGrid messaging APIs to send personalized loyalty or recommendation messages to customers picking up in-store

Getting started is easy

Start connecting your data with Segment.