AI-Generated Product Descriptions
In this recipe, we are feeding product data along with customer segment data to an LLM (in this case OpenAI) in order to generate customized product descriptions. The scenario is that we have customers with different priorities viewing the same products. Serving up the same product description to every customer may, however, turn some of them off. If we can appeal directly to a particular customer segment, spin the product information in such a way that it becomes attractive to them, we can increase conversions.
Overall Orchestration Flow
We are using commercetools for our product data, Twilio Segment for customer profiles, and OpenAI to generate the product descriptions.
The front end (a landing page, or PDP perhaps) sends a request to Conscia's DX Engine to retrieve content required to build out the page. In this recipe, we are only compiling and sending back the product description itself. The rest of the content can easily be compiled from commercetools and any other systems required through Conscia, and the Orchestration Flow would include the specific Components from this recipe.
The Flow for this recipe goes like this:
- The front end passes through an ID for the user and an ID for the product.
- The user ID goes to Twilio Segment to retrieve the membership level value.
- The product ID goes to commercetools to retrieve the product name and image.
- Finally the membership level, product name, and product image are sent to OpenAI with instructions for how to interpret the membership level and generate a product description.
Mapping Out DX Engine Elements
- externalId: The ID of the customer is passed in through Context.
- Get Customer Traits - Segment: Selector Component to retrieve the customer's profile information, specifically their membership level.
- membershipLevel: The
membershipLevelContext Field is enriched by theGet Customer Traits - SegmentComponent. It holds the membership level of the customer viewing the website. - productId: The ID of the product the customer is viewing is passed in through Context.
- Get Product - commercetools: Selector Component to retrieve the necessary product data.
- Generate Product Description - OpenAI: This Component uses the product data and the customer's membership level to generate product descriptions geared towards each audience.
The Experience API request will look something like this:
POST {{engineUrl}}/experience/components/_query
X-Customer-Code: {{customerCode}}
Authorization: Bearer {{dxEngineToken}}
{
"componentCodes": ["openai-generate-product-desc"],
"context": {
"externalId": "email:tony@conscia.ai",
"productId": "9204adea-6a0f-4000-a979-9f4f2bf83c5f"
}
}
The Experience API response will include a product description something like this for the budget-conscious shopper:
{
"content": "Discover the Franco Sarto Tall Shafting Riding Boot, designed with a low heel and stylish buckles for a timeless look. Perfect for those who appreciate both fashion and practicality, these boots offer a classic design that complements any wardrobe without breaking the bank. Enjoy the perfect blend of comfort and style at a price that fits your budget."
}
Or this for the high-roller VIP:
{
"content": "Elevate your style with the Franco Sarto Tall Shafting Riding Boot, a perfect blend of elegance and sophistication. Featuring a low heel and chic buckles, these boots are designed for those who appreciate timeless fashion and quality craftsmanship. Indulge in luxury and make a statement with every step."
}
DX Engine Configuration Details
The topics in this section explain how to implement the elements involved in this recipe.
Secrets
Segment Unify Secret
Create a token in Segment Unify, then store that value in a DX Engine Secret:
- Navigate to the Secrets page (Settings --> Secrets).
- Click the + Add Secret button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Secret Code | segment-unify-token |
| Secret Name | Segment Unify Token |
| Secret Value | Enter your Segment Unify token. |
commercetools Client Secret
Create a client secret in commercetools, then store that value in a DX Engine Secret:
- Navigate to the Secrets page (Settings --> Secrets).
- Click the + Add Secret button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Secret Code | commercetools-client-secret |
| Secret Name | commercetools Client Secret |
| Secret Value | Enter your commercetools client secret. |
OpenAI API Key
Create an API key in OpenAI, then store that value in a DX Engine Secret:
- Navigate to the Secrets page (Settings --> Secrets).
- Click the + Add Secret button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Secret Code | open-ai-key |
| Secret Name | OpenAI Key |
| Secret Value | Enter your OpenAI API key. |
Connections
Connection to Segment
- Navigate to the Connections page (Settings --> Connections).
- Click the + Add Connection button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Connection Code | segment-profiles-connection |
| Connection Name | Segment Profiles Connection |
| Connector | Universal API Connector |
| Base URL | Get value from: Literal https://profiles.segment.com/v1 |
| Base Headers | Header: Authorization Value: Get value from: JS Expression Basic ${btoa(secret('segment-unify-token') + ':')} |
| Base Headers | Header: content-type Value: Get value from: Literal application/json |
Connection to commercetools
- Navigate to the Connections page (Settings --> Connections).
- Click the + Add Connection button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Connection Code | commercetools-connection |
| Connection Name | commercetools Connection |
| Connector | Universal API Connector |
| Base URL | Get value from: Literal https://api.us-central1.gcp.commercetools.com/{{projectKey}} |
| Base Headers | Header: Authorization Value: Get value from: JS Expression |
Connection to OpenAI
- Navigate to the Connections page (Settings --> Connections).
- Click the + Add Connection button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Connection Code | open-ai-connection |
| Connection Name | OpenAI Connection |
| Connector | Universal API Connector |
| Base URL | Get value from: Literal https://api.openai.com/v1 |
| Base Headers | Header: Authorization Value: Get value from: JS Expression |
| Base Headers | Header: OpenAI-Organization Value: Get value from: Literal {{organizationID}} |
Context Fields
Membership Level
Create a Context Field to hold the membership level value retrieved from Segment.
- Navigate to the Context Fields page (Settings --> Context Fields).
- Click the + Add Context Field button.
- Enter the following and click Submit:
| Field | Value |
|---|---|
| Context Field Code | membershipLevel |
| Context Field Name | Membership Level |
| Data Type | String` |
You can choose to provide a list of acceptable values for this field, either fixed list or drawn from a source. This is useful if you'll want business users to configure Experience Rules with this field for Real Time Context Evaluation.
Components
Create a Component to retrieve membership level from Segment
- Navigate to the Experience Components page (Manage Experiences --> Components)
- Click the + Add Component button.
- Enter the following and click Submit.
| Field | Value |
|---|---|
| Component Code | segment-customer-traits |
| Component Name | Get Customer Traits - Segment |
| No Rules | Checked |
| Component Type | Conscia - Universal API Connector |
The DX Engine will create and prepare the Component for further configuration. You should see the new Component appear in the Component listing.
- Click Edit.
- Enter the following and click Submit.
| Field | Form Tab | Value |
|---|---|---|
| Connection | Main | Segment Profiles Connection |
| Webservice Path | Main | Get value from: JS Expression/spaces/{{spaceId}}/collections/users/profiles/${contextField('externalId')}/traits |
| Method | Main | GET |
| Context Field Enrichments | Update Context | Context Field: membershipLevel Expression: response.traits.membershipLevel |
Create a Component to retrieve product data from commercetools
- Navigate to the Experience Components page (Manage Experiences --> Components)
- Click the + Add Component button.
- Enter the following and click Submit.
| Field | Value |
|---|---|
| Component Code | commercetools-get-product |
| Component Name | Get Product - Commercetools |
| No Rules | Checked |
| Component Type | Conscia - Universal API Connector |
The DX Engine will create and prepare the Component for further configuration. You should see the new Component appear in the Component listing.
- Click Edit.
- Enter the following and click Submit.
| Field | Form Tab | Value |
|---|---|---|
| Connection | Main | commercetools Connection |
| Webservice Path | Main | Get value from: JS Expression/products/${contextField('productId')} |
| Method | Main | GET |
| Response Transform | Main | _.assign({}, {"productName" : response.masterData.current.name["en-US"], "productImage" : response.masterData.current.masterVariant.images[0].url}) |
I've made use of the Response Transform in this recipe to strip down the Component response to just the two values you need. If you wanted to keep things more flexible, you could use a Mapper Component instead or simply reference the `componentResponse` in the Generate Product Descriptions Component coming up next.
#### Create a Component to generate product descriptions using OpenAI
- Navigate to the **Experience Components** page (Manage Experiences --> Components)
- Click the **+ Add Component** button.
- Enter the following and click **Submit**.
| Field | Value |
| --- | --- |
| Component Code | open-ai-generate-product-desc |
| Component Name | Generate Product Descriptions - OpenAI |
| No Rules | Checked |
| Component Type | Conscia - Universal API Connector |
The DX Engine will create and prepare the Component for further configuration. You should see the new Component appear in the Component listing.
- Click Edit.
- Enter the following and click Submit.
| Field | Form Tab | Value |
| ---- | ---- | ---- |
| Connection | Main | OpenAI Connection |
| Webservice Path | Main | **Get value from:** Literal<br/>`/chat/completions` |
| Method | Main | POST |
| Headers | Main | **Header:** content-type<br/>**Value:**<br/>**Get value from:** Literal<br/>`application/json`|
| Body | Main | **Get value from:** JS Expression |
```js
JSON.stringify({
"model": "gpt-4o",
"temperature": 0.2,
"messages": [
{
"role": "user",
"content": "{ " +
"'productName': " + componentResponse('commercetools-get-product').productName + ", " +
"'productImage': " + componentResponse('commercetools-get-product').productImage + ", " +
"'membershipLevel': " + contextField('membershipLevel') + " }"
},
{
"role": "system",
"content": "You are a virtual merchandising assistant for an ecommerce website. You will be given the productName and productImage of a product that the customer is viewing on the website. " +
"You will also be given the membershipLevel of the customer. If the membershipLevel is Platinum, the customer is a high roller VIP type, willing to spend money for sophistication and style. If the membershipLevel is Bronze, the customer is a no-frills budget-conscious shopper type, not wanting to spend a lot of money and looking for a good deal. Other membershipLevels represent a standard customer. " +
"Write a 2-3 sentence product description based on this information, aiming the description at the type of customer who is viewing the product on the website. Do not reference the customer type."
}
]
})
The chat prompt here is where you can get creative and where you will need to refine the instructions to get the kind of responses you're looking for. You may also have other LLMs already trained that you can connect to and feed in the required parameters.