This sales conversation demonstrates good design in action. The fictional brand is a retailer, but the design is relevant across sectors. It applies to any use case where a customer narrows down the product or service offerings to arrive at a personalized set of options they can act on.
Below is an overview of the conversation, followed by a step-by-step breakdown. Each step highlights the best practices it applies and notes any special design considerations for a sales journey. To implement this design for your own agent, copy and customize the sample payloads for each step.
Overview
This conversation follows the maxim of "three steps to delight." The basic flow is (1) filter products by category, (2) select a product, (3) proceed to purchase. In this case, purchase happens on the brand's website.
This is a standard flow that you can build on. For example, enable users to add items to a shopping cart and check out directly within the conversation. To build a shopping cart experience and integrate with a payment processor, see the Buy Online Pickup In Store Part 2 codelab.
This sample illustrates the happy path, but it's important to build in fallback responses so users get the help they need even if they stray from the journey you designed.
Conversational turns
- The user begins the conversation with the agent.
The agent sends a welcome message. It uses conversation starters for journeys the brand wants to highlight.
This pithy welcome message sets the stage for a playful and productive interaction. To build trust, it shows the brand's logo and offers a friendly greeting that assures the user they're in the right place. The agent uses a persona to make the automation feel natural. Introducing itself as a "virtual piecefinder" adds a bit of whimsy and clarifies that "Pi" isn't a real person. By stating what it can do, the agent quickly conveys that it's relevant to the user's needs. It also shows conversation starters to entice the user down specific paths. The conversation starters use clear phrases that make it obvious where they lead.
The user taps a conversation starter to purchase products.
Conversation starters make it easy for the user to engage. They can simply tap to take the first step.
JSON payload
{ "context": { "placeId": "", "userInfo": { "displayName": "Sal", "userDeviceLocale": "en-US" }, "resolvedLocale": "en" }, "sendTime": "2022-03-25T05:39:16.854822Z", "conversationId": "1111", "requestId": "123123111", "suggestionResponse": { "message": "conversations/1111/messages/2223", "postbackData": "purchase_puzzles", "createTime": "2022-03-25T05:39:16.311308Z", "text": "Purchase puzzles", "type": "REPLY" }, "agent": "brands/3333/agents/4444" }
The agent asks the user to select a category of products to search.
In a short phrase, the agent confirms the user's intent to search for puzzles. The tone is lively and helps build momentum for the journey ahead. To set the user's expectations, the agent states how many steps are involved in their search. A discourse marker ("First") indicates which step they're on. Step one is a simple question with suggested replies to help the user pinpoint which puzzle they want to buy. The suggested replies are clear and concise.
JSON payload
{ "text": "Let the search begin. We can find the right match for you in 3 steps. First, what would you like to piece together?", "fallback": "Let the search begin! We can find the right match for you in 3 steps. First, what would you like to piece together? You can choose animals, landscapes, or artworks, or ask me to surprise you with a category.", "suggestions": [ { "reply": { "text": "Animals", "postbackData": "option_1" } }, { "reply": { "text": "Landscapes", "postbackData": "option_2" } }, { "reply": { "text": "Artworks", "postbackData": "option_3" } }, { "reply": { "text": "Surprise me", "postbackData": "option_4" } } ] }The user taps a category suggestion.
Suggested replies help users move quickly down the purchase funnel.
JSON payload
{ "context": { "placeId": "", "userInfo": { "displayName": "Sal", "userDeviceLocale": "en-US" }, "resolvedLocale": "en" }, "sendTime": "2022-03-25T05:39:56.149033Z", "conversationId": "1111", "requestId": "123123222", "suggestionResponse": { "message": "conversations/1111/messages/2225", "postbackData": "option_1", "createTime": "2022-03-25T05:39:55.674526Z", "text": "Animals", "type": "REPLY" }, "agent": "brands/3333/agents/4444" }
The agent asks the user to select a subcategory of products to narrow down their search.
Another short and snappy message keeps the conversation flowing. It begins with a simple phrase to validate the user's choice and confirm the agent's understanding. Consistent with the agent's persona, the tone is enthusiastic. The second line is prescriptive without being pushy. The suggested replies include an option to "View other animals." This suggestion to "view more" prevents the need for scrolling through a long list of options.
JSON payload
{ "text": "Animals are my favorite! Tell me the right creature for your jigsaw journey. Then I'll show you some puzzles.", "fallback": "Animals are my favorite! Tell me the right creature for your jigsaw journey. Then I'll show you some puzzles. You can tell me to search for cats, dogs, horses, elephants, or other animals.", "suggestions": [ { "reply": { "text": "Cats", "postbackData": "option_1" } }, { "reply": { "text": "Dogs", "postbackData": "option_2" } }, { "reply": { "text": "Horses", "postbackData": "option_3" } }, { "reply": { "text": "Elephants", "postbackData": "option_4" } }, { "reply": { "text": "View other animals", "postbackData": "option_5" } } ] }The user taps a subcategory suggestion.
JSON payload
{ "context": { "placeId": "", "userInfo": { "displayName": "Sal", "userDeviceLocale": "en-US" }, "resolvedLocale": "en" }, "sendTime": "2022-03-25T05:43:41.852224Z", "conversationId": "1111", "requestId": "123123333", "suggestionResponse": { "message": "conversations/1111/messages/2227", "postbackData": "option_1", "createTime": "2022-03-25T05:43:41.367260Z", "text": "Cats", "type": "REPLY" }, "agent": "brands/3333/agents/4444" }
The agent confirms the user's choice and introduces the product carousel.
To keep things fresh, the agent uses a different phrase to confirm the user's choice. This one includes an emoji, which is appropriate for both the brand and the user journey. When introducing the carousel below, the agent provides extra context to remove ambiguity. The agent notes that the products in the carousel aren't the user's only options. Otherwise, the user may assume that the items on display are the limit of what they can buy.
JSON payload
{ "text": "Cats it is 😻. Here are our bestsellers. If you don't find the right fit, I've got plenty more." }The agent displays a rich card carousel showing specific products for purchase.
The carousel displays a personalized selection of puzzles for the user to choose from. Each rich card in the carousel combines a high-quality image and product details. In this case, the cards provide enough product information and visual stimulus to support a purchase decision. For products that require more research, you can add a suggested action to "View details" on the brand website or use a live agent request suggestion to put users in touch with an expert. Each card also features a call to action—a suggestion to "Select" the product for purchase.
In case the products shown aren't what the user wants, suggestions below the carousel provide further options. They keep the user from getting stuck by enabling them to extend the search ("View other cats"), return to a previous step ("Go back to animals"), or start over ("Go back to menu").
JSON payload
{ "fallback": "Cheeky Cat\n500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$8.99\nhttps://www.cheekycatdetails.com\n\nMr. Maine Coone\n1,000 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$15.99\nhttps://www.mrmainecoonedetails.com\n\nThe Cuddle Cats\n1,500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$19.99\nhttps:www.thecuddlecatsdetails.com\n\nCatty McCat\n2,000 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$24.99\nhttps:www.cattymccatdetails.com\n\nCat Cattison\n2,500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$29.99\nhttps:www.catcattisondetails.com\n\nTell me if you want to view other cats, go back to animals, or go back to the menu.", "richCard": { "carouselCard": { "cardWidth": "MEDIUM", "cardContents": [ { "title": "Cheeky Cat", "description": "500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$8.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtocheekycat.jpg", "forceRefresh": "false" } }, "suggestions": [ { "reply": { "text": "Select", "postbackData": "option_1" } } ] }, { "title": "Mr. Maine Coone", "description": "1,000 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$15.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtomrmainecoone.jpg", "forceRefresh": "false" } }, "suggestions": [ { "reply": { "text": "Select", "postbackData": "option_1" } } ] }, { "title": "The Cuddle Cats", "description": "1,500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$19.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtothecuddlecats.jpg", "forceRefresh": "false" } }, "suggestions": [ { "reply": { "text": "Select", "postbackData": "option_1" } } ] }, { "title": "Catty McCat", "description": "2,000 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$24.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtocattymccat.jpg", "forceRefresh": "false" } }, "suggestions": [ { "reply": { "text": "Select", "postbackData": "option_1" } } ] }, { "title": "Cat Cattison", "description": "2,500 piece cardboard jigsaw puzzle\nFinished size is 26.75 x 19.75 inches\n$29.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtocatcattison.jpg", "forceRefresh": "false" } }, "suggestions": [ { "reply": { "text": "Select", "postbackData": "option_1" } } ] } ] } }, "suggestions": [ { "reply": { "text": "View other Cats", "postbackData": "option_1" } }, { "reply": { "text": "Go back to Animals", "postbackData": "option_2" } }, { "reply": { "text": "Go back to Menu", "postbackData": "option_3" } } ] }
The user taps a suggestion to select a product for purchase.
JSON payload
{ "context": { "placeId": "", "userInfo": { "displayName": "Sal", "userDeviceLocale": "en-US" }, "resolvedLocale": "en" }, "sendTime": "2022-03-25T05:44:22.014084Z", "conversationId": "1111", "requestId": "123123444", "suggestionResponse": { "message": "conversations/1111/messages/2210", "postbackData": "option_1", "createTime": "2022-03-25T05:44:21.537522Z", "text": "Select", "type": "REPLY" }, "agent": "brands/3333/agents/4444" }
The agent confirms the user's choice and transitions them to the brand's website for purchase.
With its playful tone, the agent confirms the user's final product choice. The agent repeats the product name so the user knows exactly what they're set to buy. Since the purchase transaction happens on the brand's website, the agent gives the user a heads-up that they'll be leaving the conversation. It's worth this extra step to smooth the transition, along with a friendly farewell.
JSON payload
{ "text": "Cheeky Cat is a purrfect choice! You can check out on our website. Enjoy your puzzle adventure!" }
The agent displays a rich card with a suggested action to check out.
A standalone rich card reinforces the user's final product choice. It includes only the details that are relevant for purchase. A suggested action to "Check out" empowers the user to take the purchase step.
JSON payload
{ "fallback": "Cheeky Cat:\n500 pieces\n$8.99\n\nCheck out: https://www.puzzleparadise.com", "richCard": { "standaloneCard": { "cardContent": { "title": "Cheeky Cat", "description": "500 pieces\n$8.99", "media": { "height": "TALL", "contentInfo": { "fileUrl": "https://www.pathtocheekycat.jpg", "forceRefresh": "false" } }, "suggestions": [ { "action": { "text": "Check out", "postbackData": "Option 1", "openUrlAction": { "url": "https://www.puzzleparadise.com" } } } ] } } } }The user taps the suggestion and exits to the website for checkout.
JSON payload
{ "context": { "placeId": "", "userInfo": { "displayName": "Sal", "userDeviceLocale": "en-US" }, "resolvedLocale": "en" }, "sendTime": "2022-03-25T05:37:04.859344Z", "conversationId": "1111", "requestId": "123123555", "suggestionResponse": { "message": "conversations/1111/messages/2213", "postbackData": "Option 1", "createTime": "2022-03-25T05:37:04.548212Z", "text": "Check out", "type": "ACTION" }, "agent": "brands/3333/agents/4444" }