Example of Haut.AI SaaS integration with Klaviyo via Zapier (with the recommendation system 2.0)

Steps of Integration

To integrate Haut.AI SaaS with Klaviyo via Zapier, you need to complete a few steps:

1. Set up and configure webhook in Zapier.

2. Test configured webhook.

3. Parse data passed via webhook.

4. Structure data.

5. Send data to Klaviyo.

Set up and configure webhook in Zapier

The first step is to receive data from SaaS to Zapier.

1. Login into your Zapier account.

2. Click on the "Create" button in the top-left corner.

   
3. Select "Zaps" in the dropdown.

   
4. You will see the blank canvas as shown below. Click on the "Trigger" area.

   
5. In the window that pops up, select "Webhooks by Zapier."

   
6. In the window on the right, click on the "Choose an event" dropdown and select "Catch Raw Hook."

   
7. Click "Continue" in the bottom right corner.

   
8. Click "Continue" again on the next step to skip it.

   
9. Copy the webhook URL by clicking on the "Copy" button.

   
10. Now go to your Haut.AI account,

11. Go to "Dataset" and open the dataset connected to your Skin Consultant App. You can find this dataset by going to the Skin Consultant App and clicking on ID of the Linked dataset.

    
12. Click "Settings" in the top menu of the Dataset.

    
13. Scroll down to the "Webhook (for developers)" section.

14. Paste the URL that you copied from Zapier to the URL field.

    
15. In the "Authorization method" field, select "Basic."

16. In the "Authorization key" and "Authorization value" fields, paste any value because Zapier does not require authorization.

17. In the "Request method" field, select "POST."

18. To add Survey answers to the webhook, select "Add survey answers to webhook." See how to configure Survey questions in Step 1.

19. Select "Merge webhooks" to receive one webhooks for all attached applications.

20. Click "Save changes."

Test configured webhook

The next step is to check that data received from SaaS is visible in Zapier.

1. Open your Skin Consultant App.

2. Conduct skin analysis.

3. Go back to your Zapier account.

4. Click "Test trigger."

   
5. If everything is set correctly, you can see webhook results.

   
6. If you click on the record, you will see skin something similar to the screen below.

   
7. Select the record and click "Continue with selected record."

Parse data passed via webhooks

The key important step is to parse received data in order to prepare it for connection with your 3rd party platform (e.g. Klaviyo)

1. For the action step, select "Code by Zapier"

   
2. In the window on the right, select "Run Python" and click "Continue."

   
3. Now, you need to feel the "Input Data."

   
4. Paste raw_data into the left field, as shown on the screen below

   
5. Click on the "+" button and select "Raw Body"

   

Structure data

1. Copy and paste the following code in to the "Code" field and click "Continue".

import json

# Load the raw data from input
raw_data = input_data.get('raw_data', '{}')
data = json.loads(raw_data)
    
# Extract survey questions and answers
survey_questions = [answer['question_text'] for answer in data.get('survey_answers', [])]
survey_answers = [', '.join(answer['answer_values']) for answer in data.get('survey_answers', [])]
subject_id = data.get('subject_id', '')

# Create a dictionary mapping questions to answers
questions_answers_mapping = dict(zip(survey_questions, survey_answers))

# Get all face area results
face_area_results = [algorithm for algorithm in data.get('area_results', []) if algorithm.get('area_name') == 'face']

# For Eye Condition - additional metrics are stored as submetrics
eye_area_condition = [result for result in face_area_results if result.get('tech_name') == 'eye_area_condition']
if len(eye_area_condition) > 0:
    eye_area_condition = eye_area_condition[0]['sub_metrics']
    eye_area_condition = [metric for metric in eye_area_condition if 'score' in metric.get('tech_name')]

# Add Eye Condition additional metrics to all metrics
face_area_results += eye_area_condition

# Perform metrics mapping - take only public name and value
metrics_mapping = {
    area['name']: area['value']
    for area in face_area_results
}

# Extract product recommendations (category as key, list of names as values)
recommendations = {}
recommendation_system_result = data.get('recommendation_system_result', {})

# Handle recommended products
for category, products in recommendation_system_result.get('recommended_products', {}).items():
    recommendations[category] = [product.get('name') for product in products]

# Handle featured products
for category, products in recommendation_system_result.get('featured_products', {}).items():
    if category in recommendations:
        recommendations[category].extend(product.get('name') for product in products)
    else:
        recommendations[category] = [product.get('name') for product in products]

# Get event name
event = data.get('event')

# Prepare final output
output = {
    'Questions_answers': questions_answers_mapping,
    'Metrics': metrics_mapping,
    'Subject_id': subject_id,
    'Event': event,
    'Recommendations': recommendations
}

1. Click on the "Test step" button.

   
2. Check the test results and move to the next step.

   

Handling errors

In rare cases, a photo may take longer than usual to process (more than 60 seconds). In such cases, if you choose the ‘merge webhooks’ option, you will get two webhooks:

• The first webhook will include the results of applications that were completed within 60 seconds. This webhook will contain the parameter "event": "photo_calculated_by_all_apps_timeout"

• The second will include all results from all applications. This webhook will contain the parameter This webhook will contain the parameter "event": "photo_calculated_by_all_apps"

Step-by-step guide for handling errors

• Click "Add step"

  
• Select "Filter by Zapier"

  
• Select "Event" as a field

  
• Select "(Text) Does not contain"

• Paste timeout into the text field

• Now, your Zap will send data to Klaviyo only if the data is complete

Format the data

1. Click on the "+" button on the canvas and select "Formatter" by Zapier

   
2. Click on the "Action event" dropdown, select "Numbers," and click "Continue."

   
3. In the next step, click the "+" icon and select the data item with a phone number from the list. For the format, select "E164" and choose the country code. Click "Continue."

   

Send results to Klaviyo

1. Click on the "+" button on the canvas.

2. Type "Klaviyo" in the search field and select it from the search results.

   
3. Click on the "Action event" dropdown and select "Create Profile."

   
4. Click on the "Account" and connect your Klaviyo account. Once you connect the account, click "Continue."

   
5. Now, you need to map all the structured data from the previous step with Klaviyo fields.

   1. Add custom properties to map the skin analysis results

      
   2. You can either put all the products recommended to the user in one field, or you can put them in several separate fields for each step. In the example, we have shown how to combine all recommended products into one field.

6. Once you finish mapping, click "Continue" and then click "Test step." Check if new record appears in Klaviyo.

   
7. If everything works correctly, click on the "Publish" button.