CINXE.COM
Build a Chatbot with Twilio Studio | Twilio
<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width"/><title>Build a Chatbot with Twilio Studio | Twilio</title><meta name="description" content="Learn how to build a Chatbot with Studio, Twilio's drag-and-drop virtual workflow builder."/><link rel="canonical" href="https://www.twilio.com/docs/studio/tutorials/how-to-build-a-chatbot"/><meta name="next-head-count" content="5"/><link rel="preconnect" href="https://assets.twilio.com"/><script async="" defer="" src="https://consent.trustarc.com/notice?domain=twilio.com&c=teconsent&gtm=1&js=nj&noticeType=bb"></script><meta name="x-twilio-docs-source" content="primary"/><link rel="preload" href="/_next/static/css/12418e876151f57e.css?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" as="style"/><link rel="stylesheet" href="/_next/static/css/12418e876151f57e.css?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" data-n-g=""/><noscript data-n-css=""></noscript><script defer="" nomodule="" src="/_next/static/chunks/polyfills-42372ed130431b0a.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"></script><script src="/_next/static/chunks/webpack-d3ec386faefbf024.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/framework-d65b0fe30fbe55da.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/main-67108fd261318eed.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/pages/_app-b2bc32db37b22173.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/398-ebbc0d3c0be7d4a4.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/741-af6e3e21307ad8e9.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/chunks/pages/docs/%5B...path%5D-c5c89aaab05f1efc.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/nWtU_5WJsvLGK2x62E_3J/_buildManifest.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script><script src="/_next/static/nWtU_5WJsvLGK2x62E_3J/_ssgManifest.js?dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe" defer=""></script></head><body><div id="__next"><style data-emotion="css-global lbobjb">html{font-size:100%;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;}html:lang(ja) .paste-theme-provider,html:lang(ja-JP) .paste-theme-provider{font-family:'Inter var experimental','Inter var',Hiragino Sans,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,Osaka,'MS PGothic',sans-serif;}html:lang(zh-CN) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft YaHei New',微软雅黑,'Microsoft Yahei','Microsoft JhengHei',宋体,SimSun,sans-serif;}html:lang(zh-TW) .paste-theme-provider,html:lang(zh-HK) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}html:lang(ko) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}body{background-color:rgb(255, 255, 255);margin:0;}*,*::after,*::before{box-sizing:border-box;}@media (prefers-reduced-motion: reduce){*{-webkit-animation-duration:0!important;animation-duration:0!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;transition-duration:0!important;scroll-behavior:auto!important;}}:root{--reach-dialog:1;}</style><style data-emotion="css-global 1uje5tv">@font-face{font-family:'Inter var';font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:'Regular';src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter-roman.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'Inter var';font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:'Italic';src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter-italic.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'Inter var experimental';font-weight:100 900;font-display:swap;font-style:oblique 0deg 8deg;src:url("https://assets.twilio.com/public_assets/paste-fonts/1.5.2/Inter.var.woff2?v=3.19") format("woff2");}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansMono';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansMono-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Light.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Light.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-LightItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-LightItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Semibold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Semibold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-SemiboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-SemiboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:normal;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Extrabold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-Extrabold.woff') format('woff');}@font-face{font-family:'TwilioSansText';font-style:italic;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-ExtraboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansText-ExtraboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Light.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Light.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:300;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-LightItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-LightItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Regular.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Regular.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:400;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-RegularItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-RegularItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Medium.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Medium.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:500;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-MediumItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-MediumItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Semibold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Semibold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:600;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-SemiboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-SemiboldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Bold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Bold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:700;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-BoldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-BoldItl.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:normal;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Extrabold.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-Extrabold.woff') format('woff');}@font-face{font-family:'TwilioSansDisplay';font-style:italic;font-display:swap;font-weight:800;src:local(''),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-ExtraboldItl.woff2') format('woff2'),url('https://assets.twilio.com/public_assets/paste-fonts/1.5.2/TwilioSansDisplay-ExtraboldItl.woff') format('woff');}</style><style data-emotion="css 1pzojz9">.css-1pzojz9{color:rgb(18, 28, 45);-webkit-print-color-scheme:light;color-scheme:light;font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;line-height:1.25rem;font-weight:400;font-variant-numeric:tabular-nums;}</style><div class="paste-theme-provider css-1pzojz9"><style data-emotion="css-global lbobjb">html{font-size:100%;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;}html:lang(ja) .paste-theme-provider,html:lang(ja-JP) .paste-theme-provider{font-family:'Inter var experimental','Inter var',Hiragino Sans,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','メイリオ',Meiryo,Osaka,'MS PGothic',sans-serif;}html:lang(zh-CN) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft YaHei New',微软雅黑,'Microsoft Yahei','Microsoft JhengHei',宋体,SimSun,sans-serif;}html:lang(zh-TW) .paste-theme-provider,html:lang(zh-HK) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}html:lang(ko) .paste-theme-provider{font-family:'Inter var experimental','Inter var','Microsoft JhengHei',微軟正黑體,'Microsoft JhengHei UI','Microsoft YaHei',微軟雅黑,宋体,SimSun,sans-serif;}body{background-color:rgb(255, 255, 255);margin:0;}*,*::after,*::before{box-sizing:border-box;}@media (prefers-reduced-motion: reduce){*{-webkit-animation-duration:0!important;animation-duration:0!important;-webkit-animation-iteration-count:1!important;animation-iteration-count:1!important;transition-duration:0!important;scroll-behavior:auto!important;}}:root{--reach-dialog:1;}</style><div class="css-1pzojz9"><style data-emotion="css-global 10ozouv">*{font-variant-ligatures:none;font-feature-settings:"liga" 0;}.DocSearch-Button{background-color:rgb(255, 255, 255);border-radius:4px;box-shadow:0 0 0 1px #8891aa;color:rgb(96, 107, 133);padding-left:0.75rem;padding-right:0.75rem;margin:0;width:100%;}.DocSearch-Button:hover{box-shadow:0 0 0 1px #006dfa;}.DocSearch-Button:active,.DocSearch-Button:focus{box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.DocSearch-Button .DocSearch-Search-Icon{color:rgb(96, 107, 133);width:1rem;height:1rem;}.DocSearch-Button-Placeholder{font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-weight:500;font-style:italic;padding-left:0.75rem;padding-right:0.75rem;}.DocSearch-Button-Key{top:0;padding-bottom:0;}.DocSearch-Container{color:rgb(18, 28, 45);-webkit-print-color-scheme:light;color-scheme:light;font-size:0.875rem;font-family:'TwilioSansText','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;line-height:1.25rem;font-weight:400;font-variant-numeric:tabular-nums;}.DocSearch-Dropdown a{color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;}.DocSearch-Dropdown a:hover{-webkit-text-decoration:none;text-decoration:none;}.DocSearch-SearchBar{padding-bottom:0.25rem;}.DocSearch-Search-Icon{color:rgb(96, 107, 133);}.DocSearch-Input{padding-left:1rem;}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{width:1rem;height:1rem;}.DocSearch-Hits mark{color:rgb(2, 99, 224);}.DocSearch-Hit{padding-bottom:0.5rem;}.DocSearch-Hit a{border-color:rgb(225, 227, 234);border-style:solid;border-width:2px;-webkit-text-decoration:none;text-decoration:none;}.DocSearch-Hit[aria-selected=true] a{border-color:rgb(3, 11, 93);}.DocSearch-Hit-title{font-size:0.875rem;}.DocSearch-Hit-path{font-size:0.75rem;}.DocSearch-Hit-source{color:rgb(18, 28, 45);font-size:0.875rem;font-weight:500;}.DocSearch-Hit-icon{display:none;}.DocSearch-Prefill{color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;}.DocSearch-Prefill:hover{-webkit-text-decoration:none;text-decoration:none;}.DocSearch-Commands-Key{padding-bottom:0;}:root{--docsearch-primary-color:rgb(3, 11, 93);--docsearch-text-color:rgb(18, 28, 45);--docsearch-spacing:1rem;--docsearch-icon-stroke-width:2px;--docsearch-highlight-color:rgb(3, 11, 93);--docsearch-muted-color:rgb(96, 107, 133);--docsearch-container-background:rgba(96, 107, 133, 0.5);--docsearch-logo-color:rgb(96, 107, 133);--docsearch-modal-width:44.5rem;--docsearch-modal-height:600px;--docsearch-modal-background:rgb(255, 255, 255);--docsearch-modal-shadow:0 2px 8px 0 rgba(18, 28, 45, 0.1);--docsearch-searchbox-height:46px;--docsearch-searchbox-background:rgb(18, 28, 45);--docsearch-searchbox-focus-background:rgb(255, 255, 255);--docsearch-searchbox-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;--docsearch-hit-height:56px;--docsearch-hit-color:rgb(18, 28, 45);--docsearch-hit-active-color:rgb(255, 255, 255);--docsearch-hit-background:rgb(255, 255, 255);--docsearch-hit-shadow:none;--docsearch-key-gradient:rgb(244, 244, 246);--docsearch-key-shadow:none;--docsearch-footer-height:44px;--docsearch-footer-background:rgb(255, 255, 255);--docsearch-footer-shadow:none;}html{scroll-behavior:smooth;scroll-padding-top:100px;}@media (max-width: 1385px){html{scroll-padding-top:156px;}}.grecaptcha-badge{visibility:hidden;}</style><style data-emotion="css 12lwncy">.css-12lwncy{box-sizing:border-box;opacity:0;transition-delay:50ms;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;position:relative;z-index:40;}@media screen and (min-width: 768px){.css-12lwncy{opacity:1;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-12lwncy"><style data-emotion="css 1rkak9m">.css-1rkak9m{box-sizing:border-box;background-color:rgb(255, 255, 255);border-radius:4px;box-shadow:0 2px 8px 0 rgba(18, 28, 45, 0.1);left:10px;padding-left:1.25rem;padding-right:1.25rem;padding-top:0.5rem;padding-bottom:0.5rem;position:fixed;top:10px;-webkit-transform:translateY(-150%);-moz-transform:translateY(-150%);-ms-transform:translateY(-150%);transform:translateY(-150%);-webkit-transition:-webkit-transform 0.1s;transition:transform 0.1s;z-index:90;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:1.25rem;column-gap:1.25rem;}.css-1rkak9m:focus-within{-webkit-transform:translateY(0%);-moz-transform:translateY(0%);-ms-transform:translateY(0%);transform:translateY(0%);}</style><div data-paste-element="SIDEBAR_SKIPLINKS" data-paste-core-version="20.7.0" class="css-1rkak9m"><style data-emotion="css lpeit6">.css-lpeit6{box-sizing:border-box;color:rgb(2, 99, 224);font-size:inherit;font-weight:inherit;line-height:inherit;outline:none;-webkit-text-decoration:underline;text-decoration:underline;}.css-lpeit6:active,.css-lpeit6[data-active=true]{color:rgb(6, 3, 58);-webkit-text-decoration:none;text-decoration:none;}.css-lpeit6:focus{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;color:rgb(2, 99, 224);-webkit-text-decoration:underline;text-decoration:underline;border-radius:4px;}.css-lpeit6:hover{color:rgb(3, 11, 93);-webkit-text-decoration:none;text-decoration:none;}</style><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-content-area" class="css-lpeit6">Skip to content</a><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-sidebar-nav" class="css-lpeit6">Skip to navigation</a><a data-paste-element="SIDEBAR_SKIPLINKS_LINK" data-paste-core-version="20.7.0" href="#twilio-docs-topbar" class="css-lpeit6">Skip to topbar</a></div><style data-emotion="css 1ngeyxk">.css-1ngeyxk{box-sizing:border-box;width:100%;overflow:visible;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-right-style:solid;border-right-width:1px;border-right-color:rgb(57, 71, 98);background-color:rgb(18, 28, 45);z-index:50;position:fixed;top:0;left:0;bottom:0;}@media screen and (min-width: 768px){.css-1ngeyxk{width:15rem;}}</style><aside data-paste-element="SIDEBAR" data-paste-core-version="20.7.0" style="opacity:1;width:15rem;transform:translateX(0%)" id=":R2lasm:" class="css-1ngeyxk"><style data-emotion="css 144b354">.css-144b354{box-sizing:border-box;padding-left:1.25rem;padding-right:1.25rem;min-height:4.75rem;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(57, 71, 98);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-column-gap:1rem;column-gap:1rem;overflow:hidden;}</style><div data-paste-element="SIDEBAR_HEADER" data-paste-core-version="20.7.0" class="css-144b354"><style data-emotion="css 16k9fbc">.css-16k9fbc{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(255, 255, 255);background-color:rgb(18, 28, 45);box-shadow:0 0 0 1px #394762;padding:0.5rem;}.css-16k9fbc:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);box-shadow:0 0 0 1px #f4f4f6;}.css-16k9fbc:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);}.css-16k9fbc:active,.css-16k9fbc[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #ffffff;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);}</style><a data-paste-element="SIDEBAR_HEADER_ICON_BUTTON" data-paste-core-version="20.7.0" href="/docs" type="button" aria-busy="false" class="css-16k9fbc"><style data-emotion="css 1lgr57j">.css-1lgr57j{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-text-decoration:inherit;text-decoration:inherit;opacity:1;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-column-gap:0.25rem;column-gap:0.25rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><style data-emotion="css pe4vrq">.css-pe4vrq{box-sizing:border-box;line-height:0;display:block;color:currentColor;width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LogoTwilioIcon-:R9j6mlasm:"><title id="LogoTwilioIcon-:R9j6mlasm:">Go to the Twilio Docs home page</title><path fill="currentColor" fill-rule="evenodd" d="M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10A10 10 0 0010 0zm0 17.333a7.333 7.333 0 110-14.666 7.333 7.333 0 010 14.666zm4.533-9.8a2.067 2.067 0 11-2.066-2.066 2.08 2.08 0 012.066 2.066zm0 4.934a2.067 2.067 0 11-2.066-2.067 2.08 2.08 0 012.066 2.067zm-4.933 0A2.067 2.067 0 117.533 10.4 2.08 2.08 0 019.6 12.467zm0-4.934a2.067 2.067 0 11-2.067-2.066A2.08 2.08 0 019.6 7.533z"></path></svg></span></span></a><style data-emotion="css bt2jq2">.css-bt2jq2{box-sizing:border-box;opacity:1;font-size:0.875rem;font-weight:600;line-height:1.25rem;letter-spacing:-.02em;color:rgb(255, 255, 255);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0;}</style><div data-paste-element="SIDEBAR_HEADER_LABEL" data-paste-core-version="20.7.0" class="css-bt2jq2">Twilio Docs</div></div><style data-emotion="css 1r1miiz">.css-1r1miiz{box-sizing:border-box;max-height:100%;overflow:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><div data-paste-element="SIDEBAR_BODY" data-paste-core-version="20.7.0" class="css-1r1miiz"><style data-emotion="css 1j8kdpc">.css-1j8kdpc{box-sizing:border-box;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;max-height:100%;overflow-y:auto;overflow-x:hidden;padding-top:1rem;padding-bottom:1rem;padding-left:1.25rem;padding-right:1.25rem;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><style data-emotion="css 1jrfwwl">.css-1jrfwwl{overflow-scrolling:touch;background:linear-gradient(rgb(18, 28, 45) 33%, rgba(20,28,44, 0)),linear-gradient(rgba(20,28,44, 0), rgb(18, 28, 45) 66%) 0 100%,radial-gradient(farthest-side at 50% 100%, rgba(57, 71, 98, 0.5), rgba(0,0,0,0)) 0 100%;background-repeat:no-repeat;-webkit-background-size:100% 15px,100% 15px,100% 5px,100% 5px;background-size:100% 15px,100% 15px,100% 5px,100% 5px;background-attachment:local,local,scroll,scroll;box-sizing:border-box;-webkit-transition:opacity 150ms ease;transition:opacity 150ms ease;max-height:100%;overflow-y:auto;overflow-x:hidden;padding-top:1rem;padding-bottom:1rem;padding-left:1.25rem;padding-right:1.25rem;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}.css-1jrfwwl::-webkit-scrollbar{width:6px;}.css-1jrfwwl::-webkit-scrollbar-track{margin-top:8px;background:rgb(18, 28, 45);}.css-1jrfwwl::-webkit-scrollbar-thumb{background:rgb(57, 71, 98);border-radius:10px;}.css-1jrfwwl::-webkit-scrollbar-thumb:hover{background:rgb(57, 71, 98);}</style><nav data-paste-element="SIDEBAR_NAVIGATION" data-paste-core-version="20.7.0" aria-label="main" id="twilio-docs-sidebar-nav" class="css-1jrfwwl"><style data-emotion="css 4zrz0j">.css-4zrz0j{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.5rem;padding-right:0.5rem;margin-bottom:0.5rem;width:100%;}.css-4zrz0j:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-4zrz0j:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio" class="css-4zrz0j"><style data-emotion="css qxhhlx">.css-qxhhlx{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-column-gap:0.25rem;column-gap:0.25rem;-webkit-transition:all 120ms ease;transition:all 120ms ease;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;float:none;opacity:1;white-space:normal;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Twilio Studio</span></a><style data-emotion="css 17onuso">.css-17onuso{box-sizing:border-box;display:block;margin-bottom:0.5rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><style data-emotion="css 1icrb9o">.css-1icrb9o{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-column-gap:0.5rem;column-gap:0.5rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><style data-emotion="css 1vx51jp">.css-1vx51jp{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.875rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.25rem;column-gap:0.25rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;}.css-1vx51jp:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":Ralamlasm:" class="css-1vx51jp"><style data-emotion="css f76d15">.css-f76d15{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:rgb(136, 145, 170);height:1.25rem;width:1.25rem;-webkit-transition:-webkit-transform 150ms ease;transition:transform 150ms ease;-webkit-transform:translateX(0) rotate(0deg);-moz-transform:translateX(0) rotate(0deg);-ms-transform:translateX(0) rotate(0deg);transform:translateX(0) rotate(0deg);}</style><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><style data-emotion="css pft8gl">.css-pft8gl{box-sizing:border-box;line-height:0;display:block;color:inherit;width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:R9kqalamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><style data-emotion="css 1m2bqrv">.css-1m2bqrv{box-sizing:border-box;display:block;margin-left:0.25rem;-webkit-transition:all 120ms ease;transition:all 120ms ease;float:none;opacity:1;white-space:normal;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Getting Started</span></div></div><style data-emotion="css 1nm6rmy">.css-1nm6rmy{box-sizing:border-box;padding-left:1.5rem;color:rgb(202, 205, 216);margin-top:0.25rem;}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":Ralamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><style data-emotion="css lafmnu">.css-lafmnu{box-sizing:border-box;font-style:normal;font-weight:400;font-size:0.75rem;line-height:1.25rem;color:rgb(202, 205, 216);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.25rem;padding-bottom:0.25rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.75rem;padding-right:0.5rem;margin-bottom:0.25rem;width:100%;}.css-lafmnu:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-lafmnu:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Product Overview</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/user-guide" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Studio Usage Guide</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/user-guide/get-started" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Getting Started Guide</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/subflows" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Using Subflows</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/user-guide/studio-faq" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Studio FAQ</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/user-guide/studio-troubleshooting" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Studio Troubleshooting</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/liquid-template-language" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Liquid Template Language</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Widget Library</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/studio-changelog" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Changelog</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><style data-emotion="css ecye55">.css-ecye55{box-sizing:border-box;font-style:normal;font-weight:600;font-size:0.875rem;line-height:1.25rem;color:rgb(255, 255, 255);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.25rem;column-gap:0.25rem;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;position:relative;-webkit-text-decoration:none;text-decoration:none;}.css-ecye55:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}</style><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="true" aria-controls=":Rilamlasm:" class="css-ecye55"><style data-emotion="css 127bfmf">.css-127bfmf{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;color:rgb(136, 145, 170);height:1.25rem;width:1.25rem;-webkit-transition:-webkit-transform 150ms ease;transition:transform 150ms ease;-webkit-transform:translateX(0) rotate(90deg);-moz-transform:translateX(0) rotate(90deg);-ms-transform:translateX(0) rotate(90deg);transform:translateX(0) rotate(90deg);}</style><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-127bfmf"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:R9kqilamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Tutorials</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":Rilamlasm:" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">All Studio Tutorials</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-build-an-ivr" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Build an IVR</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-conduct-a-survey" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Conduct a Survey</span></a><style data-emotion="css bxygmn">.css-bxygmn{box-sizing:border-box;font-style:normal;font-weight:600;font-size:0.75rem;line-height:1.25rem;color:rgb(255, 255, 255);-webkit-transition:all 120ms ease;transition:all 120ms ease;border-radius:4px;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:0.5rem;column-gap:0.5rem;outline:none;padding-top:0.25rem;padding-bottom:0.25rem;position:relative;-webkit-text-decoration:none;text-decoration:none;background:none;border:none;overflow:hidden;padding-left:1.75rem;padding-right:0.5rem;margin-bottom:0.25rem;width:100%;background-color:rgb(31, 48, 76);}.css-bxygmn:focus{box-shadow:0 0 0 1px #ffffff,inset 0 0 0 3px rgba(255, 255, 255, 0.2);}.css-bxygmn:hover{-webkit-text-decoration:underline;text-decoration:underline;}</style><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-build-a-chatbot" aria-current="page" class="css-bxygmn"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Build a Chatbot</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-send-appointment-reminders" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Send Appointment Reminders</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-set-up-auto-responder" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Set up an SMS Auto-Responder</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-forward-calls" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Forward Calls</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-post-sms-to-slack" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Post Messages to Slack</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/customer-support-menu" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">WhatsApp Customer Support Menu</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/using-conversations-with-studio" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Using the Twilio Conversations Integration</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":Rqlamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:R9kqqlamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Widgets</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":Rqlamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/trigger-start" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Trigger (Start) Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-wait-reply" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Send & Wait For Reply Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/split-based-on" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Split Based On... Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-message" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Send Message Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/sayplay" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Say/Play Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/gather-input-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Gather Input On Call Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-function" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Run Function Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-subflow" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Run Subflow</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/make-outgoing-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Make Outgoing Call Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/connect-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Connect Call To Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/http-request" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Make HTTP Request Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/record-voicemail" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Record Voicemail Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/enqueue-call" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Enqueue Call</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-flex" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Send to Flex Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/capture-payments" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Capture Payments</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/set-variables" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Set Variables Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/fork-stream" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Fork Stream</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/call-recording" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Call Recording</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/twiml-redirect" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">TwiML Redirect Widget</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/connect-virtual-agent" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Connect Virtual Agent</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/connect-virtual-agent-flex" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Connect Virtual Agent for Flex (Public Beta)</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/search-for-a-profile" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Search for a Profile (Public Beta)</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R12lamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:R9kr2lamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">REST API v2</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R12lamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Overview</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/studio-flows-api-quickstart" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Quickstart</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/flow" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Flow</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/flow-revision" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Flow Revision</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/flow-validate" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Flow Validate</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/test-user" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Test User</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/execution" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Execution</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/execution-context" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Execution Context</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/step" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Step</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/v2/step-context" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Step Context</span></a></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE" data-paste-core-version="20.7.0" class="css-17onuso"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_WRAPPER" data-paste-core-version="20.7.0" class="css-1icrb9o"><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":R1alamlasm:" class="css-1vx51jp"><span data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_HEADING_EXPAND_ICON" data-paste-core-version="20.7.0" class="css-f76d15"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pft8gl"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" aria-labelledby="ChevronDisclosureIcon-:R9kralamlasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M9.707 6.293a1 1 0 00-1.497 1.32l.083.094L10.585 10l-2.292 2.293a1 1 0 00-.083 1.32l.083.094a1 1 0 001.32.083l.094-.083 3-3a1 1 0 00.083-1.32l-.083-.094-3-3z"></path></svg></span></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1m2bqrv">Rest API v1</span></div></div><div data-paste-element="SIDEBAR_NAVIGATION_DISCLOSURE_CONTENT" data-paste-core-version="20.7.0" id=":R1alamlasm:" hidden="" style="display:none" class="css-1nm6rmy"><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Overview</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/flow" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Flow</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/execution" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Execution Resource</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/execution-context" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Execution Context</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/step" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Step</span></a><a data-paste-element="SIDEBAR_NAVIGATION_ITEM" data-paste-core-version="20.7.0" href="/docs/studio/rest-api/step-context" class="css-lafmnu"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-qxhhlx">Step Context</span></a></div></div></nav></div></aside></div><style data-emotion="css 1tfs3ue">.css-1tfs3ue{box-sizing:border-box;margin-left:0;position:relative;background-color:rgb(255, 255, 255);}@media screen and (min-width: 768px){.css-1tfs3ue{margin-left:15rem;}}</style><div data-paste-element="SIDEBAR_PUSH_CONTENT_WRAPPER" data-paste-core-version="20.7.0" class="css-1tfs3ue"><style data-emotion="css 14kurmn">.css-14kurmn{box-sizing:border-box;width:100%;min-height:4.75rem;background-color:rgb(249, 249, 250);border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgb(225, 227, 234);padding-left:1.5rem;padding-right:1.5rem;position:-webkit-sticky;position:sticky;top:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:1.5rem;column-gap:1.5rem;z-index:40;}</style><div data-paste-element="TOPBAR" data-paste-core-version="20.7.0" id="twilio-docs-topbar" class="css-14kurmn"><style data-emotion="css 1dkvjfb">.css-1dkvjfb{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-1dkvjfb{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-1dkvjfb"><style data-emotion="css 1nye0dd">.css-1nye0dd{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;min-width:0;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1nye0dd"><style data-emotion="css 19wcrnc">.css-19wcrnc{position:relative;-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);}.css-19wcrnc:hover{-webkit-text-decoration:underline;text-decoration:underline;}.css-19wcrnc:focus{outline:none;box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;border-radius:2px;}</style><a class="css-19wcrnc" href="/docs"><style data-emotion="css 8jah14">.css-8jah14{box-sizing:border-box;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><span data-paste-element="MEDIA_OBJECT" data-paste-core-version="20.7.0" class="css-8jah14"><style data-emotion="css and4r">.css-and4r{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;margin-right:0.75rem;}</style><span data-paste-element="MEDIA_FIGURE" data-paste-core-version="20.7.0" class="css-and4r"><style data-emotion="css jsh2a3">.css-jsh2a3{box-sizing:border-box;line-height:0;display:block;color:rgb(242, 47, 70);width:2.5rem;height:2.5rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-jsh2a3"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LogoTwilioIcon-:R2da66tasm:"><title id="LogoTwilioIcon-:R2da66tasm:">Twilio Logo</title><path fill="currentColor" fill-rule="evenodd" d="M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10A10 10 0 0010 0zm0 17.333a7.333 7.333 0 110-14.666 7.333 7.333 0 010 14.666zm4.533-9.8a2.067 2.067 0 11-2.066-2.066 2.08 2.08 0 012.066 2.066zm0 4.934a2.067 2.067 0 11-2.066-2.067 2.08 2.08 0 012.066 2.067zm-4.933 0A2.067 2.067 0 117.533 10.4 2.08 2.08 0 019.6 12.467zm0-4.934a2.067 2.067 0 11-2.067-2.066A2.08 2.08 0 019.6 7.533z"></path></svg></span></span><style data-emotion="css 1i39mnm">.css-1i39mnm{box-sizing:border-box;-webkit-flex:1;-ms-flex:1;flex:1;min-width:0;}</style><span data-paste-element="MEDIA_BODY" data-paste-core-version="20.7.0" class="css-1i39mnm"><style data-emotion="css 7aad9x">.css-7aad9x{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1rem;line-height:1.25rem;}</style><div data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-7aad9x">Twilio Docs</div></span></span></a></div></div><style data-emotion="css 8o6zg9">.css-8o6zg9{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-8o6zg9{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-8o6zg9"><style data-emotion="css miaxae">.css-miaxae{box-sizing:border-box;min-width:2.25rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-miaxae"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div><style data-emotion="css 1b15v5e">.css-1b15v5e{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 150ms ease-in,box-shadow 150ms ease-in,color 150ms ease-in;transition:background-color 150ms ease-in,box-shadow 150ms ease-in,color 150ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(18, 28, 45);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #cacdd8;padding:0.25rem;}.css-1b15v5e:hover{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #006dfa;color:rgb(2, 99, 224);}.css-1b15v5e:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.css-1b15v5e:active,.css-1b15v5e[data-active=true]{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #06033a;color:rgb(6, 3, 58);}.css-1b15v5e:disabled,.css-1b15v5e:disabled:focus,.css-1b15v5e:disabled:hover,.css-1b15v5e[aria-disabled=true],.css-1b15v5e[aria-disabled=true]:focus,.css-1b15v5e[aria-disabled=true]:hover{background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #e1e3ea;color:rgb(174, 178, 193);}.css-1b15v5e[aria-pressed=true]{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #006dfa;color:rgb(2, 99, 224);}.css-1b15v5e[aria-pressed=true]:hover{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #030b5d;color:rgb(3, 11, 93);}.css-1b15v5e[aria-pressed=true]:active,.css-1b15v5e[aria-pressed=true][data-active=true]{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #06033a;color:rgb(6, 3, 58);}.css-1b15v5e[aria-pressed=true]:focus{background-color:rgb(244, 249, 255);box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;color:rgb(2, 99, 224);}.css-1b15v5e[aria-pressed=true]:disabled,.css-1b15v5e[aria-pressed=true][aria-disabled=true]{background-color:rgb(225, 227, 234);box-shadow:0 0 0 1px #e1e3ea;color:rgb(255, 255, 255);}</style><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="true" aria-label="Open main navigation" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><style data-emotion="css 15m1pao">.css-15m1pao{box-sizing:border-box;width:1.75rem;height:1.75rem;position:relative;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-15m1pao"><style data-emotion="css pwk8hy">.css-pwk8hy{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:7px;left:6px;-webkit-transform:translateX(6px) translateY(4px) rotate(45deg);-moz-transform:translateX(6px) translateY(4px) rotate(45deg);-ms-transform:translateX(6px) translateY(4px) rotate(45deg);transform:translateX(6px) translateY(4px) rotate(45deg);opacity:0;}</style><span color="colorTextIcon" transform="translateX(6px) translateY(4px) rotate(45deg)" opacity="0" class="css-pwk8hy"></span><style data-emotion="css 11r4jzp">.css-11r4jzp{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:13px;left:6px;-webkit-transform:translateX(2px) translateY(-5px) rotate(45deg);-moz-transform:translateX(2px) translateY(-5px) rotate(45deg);-ms-transform:translateX(2px) translateY(-5px) rotate(45deg);transform:translateX(2px) translateY(-5px) rotate(45deg);}</style><span color="colorTextIcon" transform="translateX(2px) translateY(-5px) rotate(45deg)" class="css-11r4jzp"></span><style data-emotion="css 1j6de5r">.css-1j6de5r{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:13px;left:6px;-webkit-transform:translateX(2px) translateY(6px) rotate(-45deg);-moz-transform:translateX(2px) translateY(6px) rotate(-45deg);-ms-transform:translateX(2px) translateY(6px) rotate(-45deg);transform:translateX(2px) translateY(6px) rotate(-45deg);}</style><span color="colorTextIcon" transform="translateX(2px) translateY(6px) rotate(-45deg)" class="css-1j6de5r"></span><style data-emotion="css 1odqdkr">.css-1odqdkr{position:absolute;width:1rem;height:3px;border-radius:8px;-webkit-transition:-webkit-transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transition:transform 0.25s ease-in-out,opacity 0.25s ease-in-out;transform-origin:left center;background-color:rgb(96, 107, 133);top:19px;left:6px;-webkit-transform:translateX(6px) translateY(-4px) rotate(-45deg);-moz-transform:translateX(6px) translateY(-4px) rotate(-45deg);-ms-transform:translateX(6px) translateY(-4px) rotate(-45deg);transform:translateX(6px) translateY(-4px) rotate(-45deg);opacity:0;}</style><span color="colorTextIcon" transform="translateX(6px) translateY(-4px) rotate(-45deg)" opacity="0" class="css-1odqdkr"></span></div></span></button></div><style data-emotion="css hemv1x">.css-hemv1x{box-sizing:border-box;display:none;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-hemv1x{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}@media screen and (min-width: 1024px){.css-hemv1x{display:none;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-hemv1x"><style data-emotion="css 1grha7z">.css-1grha7z{box-sizing:border-box;min-width:150px;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1grha7z"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div></div><style data-emotion="css iqez3g">.css-iqez3g{box-sizing:border-box;display:none;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-iqez3g{display:none;}}@media screen and (min-width: 1024px){.css-iqez3g{display:none;}}@media screen and (min-width: 1385px){.css-iqez3g{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-iqez3g"><style data-emotion="css dnwo4n">.css-dnwo4n{box-sizing:border-box;margin-bottom:0;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;overflow:hidden;}</style><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Twilio products" class="css-dnwo4n"><style data-emotion="css ts22oj">.css-ts22oj{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}</style><style data-emotion="css 1ywodxz">.css-1ywodxz{overflow-x:auto;overflow-y:hidden;overflow-scrolling:touch;box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}@supports (-moz-appearance:none){.css-1ywodxz{padding-bottom:0px;scrollbar-width:none;}}.css-1ywodxz::-webkit-scrollbar{height:0;}.css-1ywodxz::-webkit-scrollbar-track{background:transparent;}</style><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><style data-emotion="css v2gylz">.css-v2gylz{box-sizing:border-box;list-style-type:none;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-pack:start;-ms-flex-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start;padding:0;margin:0;-webkit-column-gap:1rem;column-gap:1rem;border-bottom-width:0;border-bottom-style:none;border-bottom-color:rgb(225, 227, 234);}</style><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><style data-emotion="css m5glei">.css-m5glei{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-width:0;}</style><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><style data-emotion="css 1jrsz7z">.css-1jrsz7z{box-sizing:border-box;color:rgb(96, 107, 133);min-width:3rem;text-align:center;font-size:0.875rem;font-weight:500;overflow:hidden;position:relative;text-overflow:ellipsis;-webkit-transition:border-color 100ms ease,color 100ms ease;transition:border-color 100ms ease,color 100ms ease;white-space:nowrap;-webkit-text-decoration:none;text-decoration:none;width:100%;display:block;border-bottom-color:transparent;border-bottom-style:solid;border-bottom-width:1px;padding-bottom:0.75rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.75rem;border-top-left-radius:8px;border-top-right-radius:8px;color:rgb(18, 28, 45);}.css-1jrsz7z:hover{border-bottom-color:rgb(3, 11, 93);border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}.css-1jrsz7z:focus{border-top-left-radius:8px;border-top-right-radius:8px;box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;outline:none;}</style><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/messaging" class="css-1jrsz7z">Messaging</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/voice" class="css-1jrsz7z">Voice</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless" class="css-1jrsz7z">Serverless</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/flex" class="css-1jrsz7z">Flex</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio" class="css-1jrsz7z">Studio</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs" class="css-1jrsz7z">All docs...</a></li></ul></div></nav></div><style data-emotion="css sljj2y">.css-sljj2y{box-sizing:border-box;display:none;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-column-gap:1rem;column-gap:1rem;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}@media screen and (min-width: 768px){.css-sljj2y{display:none;}}@media screen and (min-width: 1024px){.css-sljj2y{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="TOPBAR_ACTIONS" data-paste-core-version="20.7.0" class="css-sljj2y"><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Libraries and help" class="css-dnwo4n"><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" href="/docs/libraries" class="css-1jrsz7z">SDKs</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://help.twilio.com" class="css-1jrsz7z"><style data-emotion="css sncxrr">.css-sncxrr{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-sncxrr">Help<span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Ralal6m6tasm:"><title id="LinkExternalIcon-:Ralal6m6tasm:">Help</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></div></a></li></ul></div></nav><style data-emotion="css inbhe0">.css-inbhe0{box-sizing:border-box;margin-left:1rem;margin-right:1rem;min-width:12rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-inbhe0"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search" disabled=""><span class="DocSearch-Button-Container"><svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 20 20" aria-hidden="true"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button></div><nav data-paste-element="IN_PAGE_NAVIGATION" data-paste-core-version="20.7.0" aria-label="Log in or sign up" class="css-dnwo4n"><div data-paste-element="IN_PAGE_NAVIGATION_SCROLL_WRAPPER" data-paste-core-version="20.7.0" class="css-1ywodxz"><ul data-paste-element="IN_PAGE_NAVIGATION_ITEMS" data-paste-core-version="20.7.0" class="css-v2gylz"><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://www.twilio.com/login" class="css-1jrsz7z">Log in</a></li><li data-paste-element="TOPBAR_NAV_ITEM" data-paste-core-version="20.7.0" class="css-m5glei"><a data-paste-element="TOPBAR_NAV_ITEM_ANCHOR" data-paste-core-version="20.7.0" rel="noreferrer noopener" target="_blank" href="https://www.twilio.com/try-twilio" class="css-1jrsz7z">Sign up</a></li></ul></div></nav></div></div><style data-emotion="css m2wd1f">.css-m2wd1f{box-sizing:border-box;padding-top:5.75rem;padding-left:1.5rem;padding-right:1.5rem;background-color:rgb(255, 255, 255);position:relative;margin-left:auto;margin-right:auto;max-width:77rem;box-sizing:content-box;}@media screen and (min-width: 768px){.css-m2wd1f{padding-top:5.75rem;padding-left:1.5rem;padding-right:1.5rem;}}@media screen and (min-width: 1024px){.css-m2wd1f{padding-top:5.75rem;padding-left:3.25rem;padding-right:3.25rem;}}@media screen and (min-width: 1385px){.css-m2wd1f{padding-top:2.25rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id="twilio-docs-content-area" class="css-m2wd1f"><style data-emotion="css 146sg2s">.css-146sg2s{box-sizing:border-box;display:block;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}@media screen and (min-width: 768px){.css-146sg2s{display:block;}}@media screen and (min-width: 1024px){.css-146sg2s{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-146sg2s"><style data-emotion="css 1jcpq9j">.css-1jcpq9j{box-sizing:border-box;display:none;-webkit-order:2;-ms-flex-order:2;order:2;margin-left:4.25rem;width:18.5rem;}@media screen and (min-width: 768px){.css-1jcpq9j{display:none;}}@media screen and (min-width: 1024px){.css-1jcpq9j{display:none;}}@media screen and (min-width: 1385px){.css-1jcpq9j{display:block;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id="twilio-docs-content-aside-area" class="css-1jcpq9j"><style data-emotion="css 5v6lp">.css-5v6lp{box-sizing:border-box;position:-webkit-sticky;position:sticky;top:100px;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-5v6lp"><style data-emotion="css 1j4yy0t">.css-1j4yy0t{box-sizing:border-box;max-height:calc(100vh - 76px - 24px - 9rem);display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1j4yy0t"><style data-emotion="css 1vgbamy">.css-1vgbamy{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.25rem;margin-bottom:0.5rem;font-weight:600;letter-spacing:-.02em;display:block;}</style><span data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-1vgbamy">On this page</span><style data-emotion="css zs6taj">.css-zs6taj{box-sizing:border-box;overflow:auto;margin-bottom:1.75rem;-webkit-flex:auto;-ms-flex:auto;flex:auto;}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" aria-label="document outline" class="css-zs6taj"><style data-emotion="css 15sthfg">.css-15sthfg{margin:0;padding:0;list-style:none;border-left-width:1px;border-left-style:solid;border-left-color:rgb(202, 205, 216);}</style><ul class="css-15sthfg"><style data-emotion="css 7tz84n">.css-7tz84n{display:block;margin-top:1rem;font-size:0.875rem;line-height:1.5rem;border-radius:2px;}.css-7tz84n.is-current{font-weight:600;}.css-7tz84n.is-current a{color:rgb(2, 99, 224);border-color:rgb(0, 109, 250);}.css-7tz84n:focus-within{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;}</style><li class="is-current css-7tz84n"><style data-emotion="css yczov4">.css-yczov4{box-sizing:border-box;padding-left:2rem;color:rgb(96, 107, 133);-webkit-text-decoration:none;text-decoration:none;display:inline-block;width:100%;border-left-color:transparent;border-left-style:solid;border-left-width:2px;}.css-yczov4:focus{outline:none;border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}.css-yczov4:hover{border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#prerequisites" class="css-yczov4">Prerequisites</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-your-flow" class="css-yczov4">Create your Flow</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#prompt-the-user-for-an-order" class="css-yczov4">Prompt the user for an order</a></li><style data-emotion="css 4ao0a4">.css-4ao0a4{display:block;margin-top:0.5rem;font-size:0.75rem;line-height:1.25rem;border-radius:2px;}.css-4ao0a4.is-current{font-weight:600;}.css-4ao0a4.is-current a{color:rgb(2, 99, 224);border-color:rgb(0, 109, 250);}.css-4ao0a4:focus-within{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;}</style><li class=" css-4ao0a4"><style data-emotion="css bc5avt">.css-bc5avt{box-sizing:border-box;padding-left:3.25rem;color:rgb(96, 107, 133);-webkit-text-decoration:none;text-decoration:none;display:inline-block;width:100%;border-left-color:transparent;border-left-style:solid;border-left-width:2px;}.css-bc5avt:focus{outline:none;border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}.css-bc5avt:hover{border-left-color:rgb(3, 11, 93);color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-a-send--wait-for-reply-widget" class="css-bc5avt">Add a Send & Wait for Reply Widget</a></li><li class=" css-4ao0a4"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#configure-the-send--wait-for-reply-widget" class="css-bc5avt">Configure the Send & Wait for Reply Widget</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#split-based-on-input" class="css-yczov4">Split Based on Input</a></li><li class=" css-4ao0a4"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-and-configure-the-split-based-on-widget" class="css-bc5avt">Add and configure the Split Based On... Widget</a></li><li class=" css-4ao0a4"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-transitions-to-handle-customer-input" class="css-bc5avt">Add Transitions to handle customer input</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#triggering-a-twilio-function" class="css-yczov4">Triggering a Twilio Function</a></li><li class=" css-4ao0a4"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-and-configure-a-run-function-widget" class="css-bc5avt">Add and configure a Run Function Widget</a></li><li class=" css-4ao0a4"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#build-a-twilio-function" class="css-bc5avt">Build a Twilio Function</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#human-handoff" class="css-yczov4">Human Handoff</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#make-an-outgoing-call" class="css-yczov4">Make an Outgoing Call</a></li><li class=" css-7tz84n"><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#the-finished-product" class="css-yczov4">The Finished Product</a></li></ul></nav></div></div></div><style data-emotion="css 1gmyo3z">.css-1gmyo3z{position:relative;min-width:0;width:100%;word-wrap:break-word;max-width:57.5rem;}.css-1gmyo3z div+hr+section>hr{display:none;}.css-1gmyo3z div+hr+style+section>hr{display:none;}.css-1gmyo3z div+hr+hr{display:none;}</style><style data-emotion="css ykb4uo">.css-ykb4uo{box-sizing:border-box;position:relative;min-width:0;width:100%;word-wrap:break-word;max-width:57.5rem;}.css-ykb4uo div+hr+section>hr{display:none;}.css-ykb4uo div+hr+style+section>hr{display:none;}.css-ykb4uo div+hr+hr{display:none;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ykb4uo"><style data-emotion="css 2g10on">.css-2g10on{box-sizing:border-box;display:block;}@media screen and (min-width: 768px){.css-2g10on{display:block;}}@media screen and (min-width: 1024px){.css-2g10on{display:block;}}@media screen and (min-width: 1385px){.css-2g10on{display:none;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-2g10on"><style data-emotion="css 6yc7tt">.css-6yc7tt{box-sizing:border-box;display:block;position:fixed;top:76px;margin-left:-1.5rem;margin-right:-1.5rem;padding-left:1.5rem;padding-top:1.5rem;padding-bottom:1.5rem;background-color:rgb(255, 255, 255);width:-webkit-fill-available;width:-moz-available;width:fill-available;z-index:20;}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-6yc7tt"><style data-emotion="css zv9zrj">.css-zv9zrj{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(18, 28, 45);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #cacdd8;padding-top:0.5rem;padding-bottom:0.5rem;padding-left:0.75rem;padding-right:0.75rem;font-size:0.875rem;line-height:1.25rem;}.css-zv9zrj:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(2, 99, 224);background-color:rgb(255, 255, 255);box-shadow:0 0 0 1px #006dfa;}.css-zv9zrj:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #cacdd8,0 0 0 3px #ffffff,0 0 0 4px #006dfa,0 0 0 6px #cce4ff;}.css-zv9zrj:active,.css-zv9zrj[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #001489;color:rgb(0, 20, 137);background-color:rgb(244, 249, 255);}</style><button data-paste-element="MENU_BUTTON" data-paste-core-version="20.7.0" type="button" aria-expanded="false" aria-controls=":Rhlaatasm:" aria-haspopup="menu" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j">On this page<span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="ChevronDownIcon-:R56dhlaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M6.293 8.293a1 1 0 011.32-.083l.094.083L10 10.585l2.293-2.292a1 1 0 011.32-.083l.094.083a1 1 0 01.083 1.32l-.083.094-3 3a1 1 0 01-1.32.083l-.094-.083-3-3a1 1 0 010-1.414z"></path></svg></span></span></button><style data-emotion="css 31h1qt">.css-31h1qt{box-sizing:border-box;background-color:rgb(255, 255, 255);border-style:solid;border-width:1px;border-color:rgb(225, 227, 234);border-radius:8px;box-shadow:0 4px 16px 0 rgba(18, 28, 45, 0.2);max-width:18.5rem;min-width:12rem;z-index:20;padding-top:0.5rem;padding-bottom:0.5rem;overflow-y:scroll;max-height:18.5rem;}.css-31h1qt:focus{outline:none;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" id=":Rhlaatasm:" hidden="" style="display:none;position:fixed;left:100%;top:100%" role="menu" tabindex="-1" data-dialog="true" aria-orientation="vertical" aria-label="document outline" class="css-31h1qt"><style data-emotion="css oa1jzu">.css-oa1jzu{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:none;display:block;text-align:left;font-family:inherit;font-size:0.875rem;font-weight:400;line-height:1.25rem;margin:0;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;border-left-style:solid;border-left-width:2px;border-color:transparent;cursor:pointer;padding-left:1.5rem;padding-right:1.5rem;width:100%;color:rgb(18, 28, 45);-webkit-text-decoration:none;text-decoration:none;color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:hover{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:focus{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-oa1jzu:disabled,.css-oa1jzu:disabled:focus,.css-oa1jzu:disabled:hover,.css-oa1jzu[aria-disabled=true],.css-oa1jzu[aria-disabled=true]:focus,.css-oa1jzu[aria-disabled=true]:hover{color:rgb(174, 178, 193);cursor:not-allowed;background-color:rgb(255, 255, 255);border-color:transparent;}</style><a data-paste-element="MOBILE_TOC_MENU_LINK_ACTIVE" data-paste-core-version="20.7.0" href="#prerequisites" id=":Rhlaatasm:-1" role="menuitem" class="css-oa1jzu"><style data-emotion="css roynbj">.css-roynbj{box-sizing:border-box;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Prerequisites</div></a><style data-emotion="css rrw0kl">.css-rrw0kl{box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;border:none;display:block;text-align:left;font-family:inherit;font-size:0.875rem;font-weight:400;line-height:1.25rem;margin:0;outline:none;padding-top:0.5rem;padding-bottom:0.5rem;border-left-style:solid;border-left-width:2px;border-color:transparent;cursor:pointer;padding-left:1.5rem;padding-right:1.5rem;width:100%;color:rgb(18, 28, 45);-webkit-text-decoration:none;text-decoration:none;}.css-rrw0kl:hover{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-rrw0kl:focus{color:rgb(2, 99, 224);background-color:rgb(244, 249, 255);border-color:rgb(0, 109, 250);}.css-rrw0kl:disabled,.css-rrw0kl:disabled:focus,.css-rrw0kl:disabled:hover,.css-rrw0kl[aria-disabled=true],.css-rrw0kl[aria-disabled=true]:focus,.css-rrw0kl[aria-disabled=true]:hover{color:rgb(174, 178, 193);cursor:not-allowed;background-color:rgb(255, 255, 255);border-color:transparent;}</style><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#create-your-flow" id=":Rhlaatasm:-2" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Create your Flow</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#prompt-the-user-for-an-order" id=":Rhlaatasm:-3" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Prompt the user for an order</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#add-a-send--wait-for-reply-widget" id=":Rhlaatasm:-4" role="menuitem" class="css-rrw0kl"><style data-emotion="css kyczyy">.css-kyczyy{box-sizing:border-box;padding-left:1.25rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Add a Send & Wait for Reply Widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#configure-the-send--wait-for-reply-widget" id=":Rhlaatasm:-5" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Configure the Send & Wait for Reply Widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#split-based-on-input" id=":Rhlaatasm:-6" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Split Based on Input</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#add-and-configure-the-split-based-on-widget" id=":Rhlaatasm:-7" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Add and configure the Split Based On... Widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#add-transitions-to-handle-customer-input" id=":Rhlaatasm:-8" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Add Transitions to handle customer input</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#triggering-a-twilio-function" id=":Rhlaatasm:-9" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Triggering a Twilio Function</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#add-and-configure-a-run-function-widget" id=":Rhlaatasm:-10" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Add and configure a Run Function Widget</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#build-a-twilio-function" id=":Rhlaatasm:-11" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-kyczyy">Build a Twilio Function</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#human-handoff" id=":Rhlaatasm:-12" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Human Handoff</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#make-an-outgoing-call" id=":Rhlaatasm:-13" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Make an Outgoing Call</div></a><a data-paste-element="MOBILE_TOC_MENU_LINK" data-paste-core-version="20.7.0" href="#the-finished-product" id=":Rhlaatasm:-14" role="menuitem" class="css-rrw0kl"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">The Finished Product</div></a></div></nav></div><style data-emotion="css m8ey6p">.css-m8ey6p{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:baseline;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-column-gap:0.75rem;column-gap:0.75rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 10br7e4">.css-10br7e4{margin:0;padding:0;color:rgb(18, 28, 45);font-size:2rem;line-height:2.5rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:block;}</style><h1 data-paste-element="HEADING" data-paste-core-version="20.6.0" class="css-10br7e4">Build a Chatbot with Twilio Studio</h1></div><style data-emotion="css 7lkj4y">section:focus-within .css-7lkj4y,section:hover .css-7lkj4y{opacity:1;}</style><style data-emotion="css 136zex2">.css-136zex2{box-sizing:border-box;opacity:1;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out;}section:focus-within .css-136zex2,section:hover .css-136zex2{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-136zex2"><style data-emotion="css knmi57">.css-knmi57{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-column-gap:0.75rem;column-gap:0.75rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlaalaatasm:"><title id="ThumbsUpIcon-:R2cqlaalaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalaalaatasm:"><title id="ThumbsDownIcon-:R2dalaalaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><style data-emotion="css 1y5brhz">.css-1y5brhz{box-sizing:border-box;margin:0;margin-bottom:2.25rem;margin-top:2.25rem;border-width:0;border-color:rgb(225, 227, 234);border-style:solid;border-bottom-width:1px;width:auto;}</style><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><style data-emotion="css tcah8o">.css-tcah8o{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;font-weight:400;margin-bottom:1.5rem;}</style><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Chatbots are a great way to help your users accomplish simple tasks in a friendly, conversational manner. Let's look at how to build a simple Flow that responds to incoming text messages and chats with your users to help them order a coffee.</p> <style data-emotion="css slcqjs">.css-slcqjs{box-sizing:border-box;margin-bottom:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><style data-emotion="css 9jba6l">.css-9jba6l{position:relative;}.css-9jba6l embed,.css-9jba6l iframe,.css-9jba6l object,.css-9jba6l video{position:absolute;top:0;left:0;height:100%;width:100%;}</style><div style="padding-bottom:56.25%" class="css-9jba6l"><style data-emotion="css q0wqz">.css-q0wqz{box-sizing:border-box;position:absolute;top:0;right:0;bottom:0;left:0;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-q0wqz"> <div class=""><div id="" class=""></div></div></div></div></div> <section id="prerequisites-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css gt12nx">.css-gt12nx{box-sizing:border-box;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;margin-bottom:1.25rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><style data-emotion="css 16k5vxt">.css-16k5vxt{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1.5rem;line-height:2rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:inline;}</style><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="prerequisites" class="css-16k5vxt">Prerequisites</h2><style data-emotion="css f02h4i">.css-f02h4i{box-sizing:border-box;margin-bottom:0;-webkit-text-decoration:none;text-decoration:none;margin-left:0.5rem;color:rgb(96, 107, 133);border-radius:2px;outline:none;display:inline-block;vertical-align:text-bottom;}.css-f02h4i:hover{color:rgb(3, 11, 93);}.css-f02h4i:focus{box-shadow:0 0 0 2px #ffffff,0 0 0 3px #006dfa,0 0 0 5px #cce4ff;color:rgb(3, 11, 93);}</style><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#prerequisites" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9k9claatasm:"><title id="LinkIcon-:Rl9k9claatasm:">prerequisites page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><style data-emotion="css 1kam78h">.css-1kam78h{box-sizing:border-box;opacity:0;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out;}section:focus-within .css-1kam78h,section:hover .css-1kam78h{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plak9claatasm:"><title id="ThumbsUpIcon-:R4plak9claatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlak9claatasm:"><title id="ThumbsDownIcon-:R4qlak9claatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To complete this tutorial, you will need to complete the following prerequisites. You can skip ahead to <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/tutorials/how-to-build-a-chatbot#create-your-flow" title="Create your Flow" class="css-lpeit6">Create your Flow</a> if you've already completed these tasks.</p><style data-emotion="css 1bt452l">.css-1bt452l{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;margin-bottom:1.5rem;font-weight:400;margin-left:1.5rem;list-style-type:disc;}</style><ul data-paste-element="UNORDERED_LIST" data-paste-core-version="20.6.0" class="css-1bt452l"> <style data-emotion="css 1pp5a8v">.css-1pp5a8v{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;font-weight:400;margin-bottom:0.5rem;margin-top:0.5rem;}</style><li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Sign up for a Twilio account — you can <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/try-twilio" rel="noreferrer noopener" target="_blank" title="create a free account" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">create a free account<style data-emotion="css 1ezs782">.css-1ezs782{box-sizing:border-box;display:inline-block;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;vertical-align:middle;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:R5akkpclaatasm:"><title id="LinkExternalIcon-:R5akkpclaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> if you don't have one already.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Purchase a Twilio phone number. Learn how to <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/messaging/guides/how-to-use-your-free-trial-account" title="purchase a phone number with the Twilio documentation" class="css-lpeit6">purchase a phone number with the Twilio documentation</a>. Please note that the number purchasing process varies by region.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Some familiarity with <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions" title="Twilio Functions" class="css-lpeit6">Twilio Functions</a>.</li> </ul><style data-emotion="css irnnze">.css-irnnze{margin-top:1.5rem;margin-bottom:1.5rem;}.css-irnnze h1,.css-irnnze h2,.css-irnnze h3,.css-irnnze h4,.css-irnnze h5,.css-irnnze h6,.css-irnnze p,.css-irnnze li,.css-irnnze ul,.css-irnnze ol,.css-irnnze [data-paste-element=DISCLOSURE] span[data-paste-element=HEADING]{color:inherit;}[data-paste-element=HORIZONTAL_TAB_PANEL] .css-irnnze{margin-top:0;}</style><style data-emotion="css rj5eb">.css-rj5eb{box-sizing:border-box;margin-top:1.5rem;margin-bottom:1.5rem;}.css-rj5eb h1,.css-rj5eb h2,.css-rj5eb h3,.css-rj5eb h4,.css-rj5eb h5,.css-rj5eb h6,.css-rj5eb p,.css-rj5eb li,.css-rj5eb ul,.css-rj5eb ol,.css-rj5eb [data-paste-element=DISCLOSURE] span[data-paste-element=HEADING]{color:inherit;}[data-paste-element=HORIZONTAL_TAB_PANEL] .css-rj5eb{margin-top:0;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-rj5eb"><style data-emotion="css 1tn0jga">.css-1tn0jga{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;padding:1.5rem;border-left-style:solid;border-left-width:2px;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;-webkit-column-gap:1rem;column-gap:1rem;background-color:rgb(249, 249, 250);color:rgb(141, 49, 24);border-color:rgb(255, 179, 122);}</style><div data-paste-element="CALLOUT" data-paste-core-version="20.7.0" class="css-1tn0jga"><div data-paste-element="CALLOUT_ICON" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 5ybmgr">.css-5ybmgr{box-sizing:border-box;line-height:0;display:block;color:rgb(195, 83, 35);width:1.25rem;height:1.25rem;-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}</style><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-5ybmgr"><svg role="img" aria-hidden="true" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="WarningIcon-:R36l1claatasm:"><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M17.798 14.791L11.316 3.744c-.582-.992-2.05-.992-2.632 0L2.202 14.79C1.625 15.776 2.354 17 3.518 17h12.964c1.164 0 1.893-1.224 1.316-2.209zM9.99 8h.02c.611.007 1.073.592.978 1.244l-.428 2.238c-.04.296-.278.518-.557.518h-.006c-.279 0-.516-.222-.557-.518l-.428-2.238C8.917 8.592 9.386 8 9.99 8zm.01 7a1 1 0 100-2 1 1 0 000 2z"></path></svg></span><style data-emotion="css 1cbdvo6">.css-1cbdvo6{box-sizing:border-box;border:none;clip:rect(0 0 0 0);height:1px;margin:-0.125rem;overflow:hidden;padding:0;position:absolute;text-transform:none;white-space:nowrap;width:1px;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">(warning)</span></div><style data-emotion="css fkfdww">.css-fkfdww{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;row-gap:0.5rem;-webkit-flex:1;-ms-flex:1;flex:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-fkfdww"><style data-emotion="css kevsq9">.css-kevsq9{margin:0;padding:0;color:currentColor;font-size:0.875rem;line-height:1.25rem;font-weight:600;}</style><h2 data-paste-element="CALLOUT_HEADING" data-paste-core-version="20.6.0" class="css-kevsq9">Warning</h2><style data-emotion="css 8tmauh">.css-8tmauh{display:grid;grid-gap:0;word-break:break-word;}.css-8tmauh >:last-child{margin-bottom:0;}.css-8tmauh ul,.css-8tmauh ol{margin-top:-0.5rem;}</style><style data-emotion="css 1ircowi">.css-1ircowi{box-sizing:border-box;display:grid;grid-gap:0;word-break:break-word;}.css-1ircowi >:last-child{margin-bottom:0;}.css-1ircowi ul,.css-1ircowi ol{margin-top:-0.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ircowi"><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">This demo tutorial is best suited for use with a single Twilio Phone number. To scale this Flow with <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/messaging/services" title="Twilio Messaging Services" class="css-lpeit6">Twilio Messaging Services</a>, please <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/en-us/help/sales" rel="noreferrer noopener" target="_blank" title="reach out to discuss your use case" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">reach out to discuss your use case<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlaalal1claatasm:"><title id="LinkExternalIcon-:Rlaalal1claatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>.</p></div></div></div></div></section> <section id="create-your-flow-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="create-your-flow" class="css-16k5vxt">Create your Flow</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#create-your-flow" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9k9slaatasm:"><title id="LinkIcon-:Rl9k9slaatasm:">create-your-flow page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plak9slaatasm:"><title id="ThumbsUpIcon-:R4plak9slaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlak9slaatasm:"><title id="ThumbsDownIcon-:R4qlak9slaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">You'll create a Twilio Studio Flow from Twilio's starter template in this tutorial. By the end, you'll understand how to construct a chatbot with minimal building blocks in place. You can also use the <strong>Messaging Chatbot</strong> template to begin with most of the pieces already in place.</p><style data-emotion="css w38rkw">.css-w38rkw{margin:0;padding:0;color:rgb(18, 28, 45);font-size:0.875rem;line-height:1.5rem;margin-bottom:1.5rem;font-weight:400;margin-left:1.5rem;list-style-type:decimal;}</style><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Log into your Twilio account and navigate to the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/studio/" rel="noreferrer noopener" target="_blank" title="Studio Dashboard" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Studio Dashboard<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Ral8kpslaatasm:"><title id="LinkExternalIcon-:Ral8kpslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Create a flow</strong>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">A modal will display where you can name your flow — this tutorial will use "Barista Bot."</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Select <strong>Next</strong>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">The modal will load several template options. Each template provides a different foundation of building blocks.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Select <strong>Start from scratch</strong> to follow along with the rest of this tutorial. You can also select <strong>Messaging Chatbot</strong> to start with most of the pieces already on your Canvas and connected to one another.</li> </ol><style data-emotion="css 1cxfq70">.css-1cxfq70{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;margin-bottom:1.5rem;}li .css-1cxfq70{margin-top:1.5rem;}.css-1cxfq70 div{display:inline-block;position:relative;margin:auto;max-width:100%;height:auto;}.css-1cxfq70 div:hover button{opacity:1;}.css-1cxfq70 div img{display:block;margin:auto;max-width:100%;max-height:31.5rem;height:auto;object-fit:contain;border-radius:4px;cursor:-webkit-zoom-in;cursor:zoom-in;}.css-1cxfq70 div button{opacity:0;position:absolute;top:1rem;right:1rem;-webkit-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;}.css-1cxfq70 div button:focus,.css-1cxfq70 div button:hover{opacity:1;}</style><style data-emotion="css wszb6a">.css-wszb6a{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;margin-bottom:1.5rem;}li .css-wszb6a{margin-top:1.5rem;}.css-wszb6a div{display:inline-block;position:relative;margin:auto;max-width:100%;height:auto;}.css-wszb6a div:hover button{opacity:1;}.css-wszb6a div img{display:block;margin:auto;max-width:100%;max-height:31.5rem;height:auto;object-fit:contain;border-radius:4px;cursor:-webkit-zoom-in;cursor:zoom-in;}.css-wszb6a div button{opacity:0;position:absolute;top:1rem;right:1rem;-webkit-transition:opacity .2s ease-in-out;transition:opacity .2s ease-in-out;}.css-wszb6a div button:focus,.css-wszb6a div button:hover{opacity:1;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Barista Bot Flow." loading="lazy" width="1194" height="472" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1194 472'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AOPi4v/Lzs//7u/x//f39/8AyMnJ/8rKyP+ys7T/ABcj/92WGcQnkukgAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc1253b859b3abeeab049a7a2543bd9ca5a396984a1c3731962992a57dc879b04.png&w=1200&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc1253b859b3abeeab049a7a2543bd9ca5a396984a1c3731962992a57dc879b04.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fc1253b859b3abeeab049a7a2543bd9ca5a396984a1c3731962992a57dc879b04.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6daj1slaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once the Studio Flow is created, you'll see a Canvas with a Trigger Widget already in place. This Widget starts your Flow when it's triggered by an event that you specify. In this case, you want to receive SMS messages from customers, so you will trigger the Flow with an incoming message. You will add more Widgets throughout this tutorial by dragging them from the <strong>Widget Library</strong> on the right side of the Canvas.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot arrow pointing to Incoming Message transition of Trigger (Start) Widget." loading="lazy" width="1600" height="458" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 458'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAFklEQVR4nGPYt2jpf3tlDTB+eeHqfwBL+QmkeM72uAAAAABJRU5ErkJggg=='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fd5a554f534b9cffc4461382ac140d8f77368b96887261946aa78451325e4944d.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fd5a554f534b9cffc4461382ac140d8f77368b96887261946aa78451325e4944d.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fd5a554f534b9cffc4461382ac140d8f77368b96887261946aa78451325e4944d.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajhslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="prompt-the-user-for-an-order-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="prompt-the-user-for-an-order" class="css-16k5vxt">Prompt the user for an order</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#prompt-the-user-for-an-order" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rakqaclaatasm:"><title id="LinkIcon-:Rakqaclaatasm:">prompt-the-user-for-an-order page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlaaclaatasm:"><title id="ThumbsUpIcon-:R2cqlaaclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalaaclaatasm:"><title id="ThumbsDownIcon-:R2dalaaclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">When your bot receives a message, you will need to reply, prompting the customer for a coffee order.</p></section> <section id="add-a-send--wait-for-reply-widget-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css a8lapc">.css-a8lapc{box-sizing:border-box;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;margin-bottom:1rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><style data-emotion="css yftbgj">.css-yftbgj{margin:0;padding:0;color:rgb(18, 28, 45);font-size:1.25rem;line-height:1.75rem;margin-bottom:0;font-weight:600;letter-spacing:-.02em;display:inline;}</style><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="add-a-send--wait-for-reply-widget" class="css-yftbgj">Add a Send & Wait for Reply Widget</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-a-send--wait-for-reply-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rakqaslaatasm:"><title id="LinkIcon-:Rakqaslaatasm:">add-a-send--wait-for-reply-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlaaslaatasm:"><title id="ThumbsUpIcon-:R2cqlaaslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalaaslaatasm:"><title id="ThumbsDownIcon-:R2dalaaslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Start by dragging a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/send-wait-reply" title="Send & Wait for Reply Widget" class="css-lpeit6">Send & Wait for Reply Widget</a></strong> onto the Canvas from the <strong>Widget Library</strong>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Connect it to the <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/trigger-start" title="Trigger (Start) Widget" class="css-lpeit6">Trigger (Start) Widget</a></strong> by dragging the red dot at the bottom of <strong>Incoming Call</strong> Transition to the grey dot at the corner of the new <strong>Send & Wait for Reply</strong> Widget.</li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">You can use this <strong>Send & Wait for Reply</strong> Widget to deliver an SMS to the user. In this case, you will ask the user what kind of coffee they want to order. You can expect the customer to reply with one of the options you specify.</p></section> <section id="configure-the-send--wait-for-reply-widget-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="configure-the-send--wait-for-reply-widget" class="css-yftbgj">Configure the Send & Wait for Reply Widget</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#configure-the-send--wait-for-reply-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kbclaatasm:"><title id="LinkIcon-:Rl9kbclaatasm:">configure-the-send--wait-for-reply-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakbclaatasm:"><title id="ThumbsUpIcon-:R4plakbclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakbclaatasm:"><title id="ThumbsDownIcon-:R4qlakbclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click the <strong>Send & Wait for Reply</strong> Widget on the Canvas and select the Widget's <strong>Config</strong> tab.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">You can name the Widget anything you like — this tutorial will use <style data-emotion="css 1kwd7zr">.css-1kwd7zr{box-sizing:border-box;border-width:1px;border-style:solid;border-radius:4px;font-family:'TwilioSansMono',Courier,monospace;font-size:inherit;line-height:inherit;padding-left:0.25rem;padding-right:0.25rem;color:inherit;background-color:rgb(249, 249, 250);border-color:rgb(202, 205, 216);}</style><code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">order_prompt</code></li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">In the Widget's <strong>Message Body</strong>, add a friendly response that will be sent to the customer once your Flow is triggered — see the sample text below.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">You can leave the remaining Widget fields empty or set to their default values and click <strong>Save</strong>.</li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Sample <strong>Message Body</strong> text:</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><style data-emotion="css 1ft5k6i">.css-1ft5k6i{box-sizing:border-box;background-color:rgb(31, 48, 76);border-radius:4px;overflow:hidden;}</style><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><style data-emotion="css 1d8ad8q">.css-1d8ad8q{box-sizing:border-box;background-color:rgb(18, 28, 45);display:grid;grid-template-columns:1fr auto;grid-template-areas:"code-block button-group";-webkit-column-gap:0.75rem;column-gap:0.75rem;border-radius:4px;padding-top:1.25rem;padding-bottom:1.25rem;}</style><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1d8ad8q"><style data-emotion="css 1gqdom6">.css-1gqdom6{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:0.75rem;column-gap:0.75rem;grid-area:button-group;padding-right:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1gqdom6"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 11aawc9">.css-11aawc9{box-sizing:border-box;width:auto;-webkit-appearance:none;-moz-appearance:none;-ms-appearance:none;appearance:none;background:none;display:inline-block;border:none;outline:none;-webkit-transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;transition:background-color 100ms ease-in,box-shadow 100ms ease-in,color 100ms ease-in;font-family:inherit;font-weight:600;-webkit-text-decoration:none;text-decoration:none;position:relative;margin:0;border-radius:4px;cursor:pointer;color:rgb(255, 255, 255);background-color:rgb(18, 28, 45);box-shadow:0 0 0 1px #394762;padding:0.25rem;}.css-11aawc9:hover{-webkit-text-decoration:none;text-decoration:none;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);box-shadow:0 0 0 1px #f4f4f6;}.css-11aawc9:focus{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);}.css-11aawc9:active,.css-11aawc9[data-active=true]{-webkit-text-decoration:none;text-decoration:none;box-shadow:0 0 0 1px #ffffff;color:rgb(255, 255, 255);background-color:rgb(31, 48, 76);}</style><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":Rj6l3claatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R39jj6l3claatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><style data-emotion="css 1f9wiu0">.css-1f9wiu0{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-x:auto;grid-area:code-block;padding-left:1.5rem;}</style><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1f9wiu0"><style data-emotion="css 1p78m0">.css-1p78m0{display:grid;}.css-1p78m0:focus{outline:none;box-shadow:inset 0 0 0 1px #006dfa,inset 0 0 0 3px #cce4ff;border-radius:4px;}</style><pre data-theme="github-dark" data-lang="shellscript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div><span style="color:#FFA657">Welcome</span> <span style="color:#A5D6FF">to our automated ordering system. Please reply with one of the following: latte, cappuccino, americano, cortado, or cold brew.</span></div></div></pre></div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot order_prompt Widget shown with configuration." loading="lazy" width="1600" height="757" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 757'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKUlEQVR4nGOwVNb4L8/A9L8+v+j/nPnz/zMUllf8v37v/n8QmDNt+n8AIUkUkjDiI1wAAAAASUVORK5CYII='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F8f3920a1d60d7e9f6d6b0bd9428e295c058487d1032921a57dea463f2092eb8c.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F8f3920a1d60d7e9f6d6b0bd9428e295c058487d1032921a57dea463f2092eb8c.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F8f3920a1d60d7e9f6d6b0bd9428e295c058487d1032921a57dea463f2092eb8c.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajbclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Your Flow is now prepared to reply to an inbound message and wait for a response. Once a response is received, you will need to take action based on its content. You can use a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/split-based-on" title="Split Based On... Widget" class="css-lpeit6">Split Based On... Widget</a></strong> to handle this next step.</p></section> <section id="split-based-on-input-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="split-based-on-input" class="css-16k5vxt">Split Based on Input</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#split-based-on-input" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rakqbslaatasm:"><title id="LinkIcon-:Rakqbslaatasm:">split-based-on-input page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlabslaatasm:"><title id="ThumbsUpIcon-:R2cqlabslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalabslaatasm:"><title id="ThumbsDownIcon-:R2dalabslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The <strong>Split Based On…</strong> Widget allows you to distinguish among input (the customer's response, no response, and errors). It does this by setting a variable that you can test the input against.</p></section> <section id="add-and-configure-the-split-based-on-widget-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="add-and-configure-the-split-based-on-widget" class="css-yftbgj">Add and configure the Split Based On... Widget</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-and-configure-the-split-based-on-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rakqcclaatasm:"><title id="LinkIcon-:Rakqcclaatasm:">add-and-configure-the-split-based-on-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqlacclaatasm:"><title id="ThumbsUpIcon-:R2cqlacclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2dalacclaatasm:"><title id="ThumbsDownIcon-:R2dalacclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Drag a <strong>Split Based On...</strong> Widget to the Canvas.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Connect the <strong>Send & Wait for Reply</strong> Widget to the <strong>Split Based On...</strong> Widget by dragging the grey dot at the bottom of <strong>Send & Wait for Reply</strong> Widget's <strong>Reply</strong> to the grey dot at the corner of the new <strong>Split Based On...</strong> Widget.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click on the <strong>Split Based On...</strong> Widget and select the <strong>Config</strong> tab.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">You can now name the Widget — this tutorial will use <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">split_order</code>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">To set a variable to test input against, select <strong>order_prompt ></strong> <strong>inbound.Body</strong> from the <strong>Variable to Test</strong> dropdown menu. This variable will contain the message body text sent by the customer.</li> </ol><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Split Order Variable to Test field shown." loading="lazy" width="986" height="1200" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 986 1200'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAYAAABLLYUHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAP0lEQVR4nAE0AMv/AOjp6v+FhIT/wcLD/wDf3+L/kY+P/6enp/8A5ujq/5ubnP+6urr/AMW+wP8eBw3/0tfX/9BSJHQeKfqrAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F859b7026fa6823b64e1ac411d04067057e0fe77bfdf7b538f67ba47161fbff32.png&w=1080&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F859b7026fa6823b64e1ac411d04067057e0fe77bfdf7b538f67ba47161fbff32.png&w=2048&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F859b7026fa6823b64e1ac411d04067057e0fe77bfdf7b538f67ba47161fbff32.png&w=2048&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R36l9sclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="add-transitions-to-handle-customer-input-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="add-transitions-to-handle-customer-input" class="css-yftbgj">Add Transitions to handle customer input</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-transitions-to-handle-customer-input" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kcslaatasm:"><title id="LinkIcon-:Rl9kcslaatasm:">add-transitions-to-handle-customer-input page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakcslaatasm:"><title id="ThumbsUpIcon-:R4plakcslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakcslaatasm:"><title id="ThumbsDownIcon-:R4qlakcslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Next, you need to declare the choices you're looking for in the customer's response — <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">latte</code>, <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cappuccino</code>, <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">americano</code>, <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cortado</code>, and <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cold brew</code>.</p><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click the red <strong>New</strong> button at the bottom of the <strong>Split Based On...</strong> Widget to reveal the Widget's <strong>Transition On...</strong> dropdown menu. You can alternatively select the <strong>Transitions</strong> tab after clicking on the Widget.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Select <strong>Condition Matches</strong> to create a new Transition.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">From the Widget's <strong>Transitions</strong> tab, find the new <strong>Transition</strong> that you just created. It will be under the heading <strong>If Value Equal_To</strong>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Select <strong>Matches Any Of</strong> from the first dropdown menu. You can now set the values you want to match from the customer's response — <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">latte</code><em>,</em> <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cappuccino</code><em>,</em> <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">americano</code><em>,</em> <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cortado</code><em>,</em> and <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">cold brew</code>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v"><strong>Save</strong> the new Transition and it will appear on the Widget.</li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Variable <strong>Matches Any Of</strong> values</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1d8ad8q"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1gqdom6"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":Rj6lcslaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R39jj6lcslaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1f9wiu0"><pre data-theme="github-dark" data-lang="shellscript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div><span style="color:#FFA657">latte,</span> <span style="color:#A5D6FF">cappuccino, americano, cortado, cold brew</span></div></div></pre></div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Split Order Widget with Transition configuration shown." loading="lazy" width="1600" height="793" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 793'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/ADs9Pv8vMTL/ysnN/zw+Pv8Apaeo/4yMj/+fm57/Lyss/yezElKzrqqCAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F1ca1998c62b8c9908b1299eac9a8d1110069b9325ccd228b1e5881f50de5edd8.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F1ca1998c62b8c9908b1299eac9a8d1110069b9325ccd228b1e5881f50de5edd8.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F1ca1998c62b8c9908b1299eac9a8d1110069b9325ccd228b1e5881f50de5edd8.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajkslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="triggering-a-twilio-function-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="triggering-a-twilio-function" class="css-16k5vxt">Triggering a Twilio Function</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#triggering-a-twilio-function" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rakqdclaatasm:"><title id="LinkIcon-:Rakqdclaatasm:">triggering-a-twilio-function page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R2cqladclaatasm:"><title id="ThumbsUpIcon-:R2cqladclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R2daladclaatasm:"><title id="ThumbsDownIcon-:R2daladclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">If the user responds with something that the bot recognizes (one of your five drinks), you should send a request to the barista system to complete the order. You can use a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/run-function" title="Run Function Widget" class="css-lpeit6">Run Function Widget</a></strong> to do this.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o"><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/serverless/functions-assets/functions" title="Twilio Functions" class="css-lpeit6">Twilio Functions</a> is a serverless environment that allows you to write Twilio applications without managing infrastructure. Twilio Functions are perfect for event-driven applications like the Barista Bot.</p></section> <section id="add-and-configure-a-run-function-widget-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="add-and-configure-a-run-function-widget" class="css-yftbgj">Add and configure a Run Function Widget</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#add-and-configure-a-run-function-widget" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kdslaatasm:"><title id="LinkIcon-:Rl9kdslaatasm:">add-and-configure-a-run-function-widget page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakdslaatasm:"><title id="ThumbsUpIcon-:R4plakdslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakdslaatasm:"><title id="ThumbsDownIcon-:R4qlakdslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Drag a <strong>Run Function</strong> Widget onto the Canvas. This Widget is available in the <strong>Widget Library</strong> from <strong>Tools & Execute Code > Run Function</strong>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click on the <strong>Run Function</strong> Widget to configure it. You can name it anything you like — this tutorial will use <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">request_barista</code>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Connect the condition you just set in your <strong>Split Based On...</strong> Widget to your <strong>Run Function</strong> Widget.</li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Before you can finish configuring your widget, you must create a Twilio Function. Once created, you will have a URL to add to your <strong>Run Function</strong> Widget.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot split_order Widget connecting to request_barista Widget." loading="lazy" width="1600" height="1250" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 1250'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AISEhf8XGCH/aWJn/+jm5/8AvcDA/5SWnf+Ni5L/ysvN/wDz9PX/5ujp/15iZP+fo6f/Nb0iab97hVEAAAAASUVORK5CYII='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffd3b38186b2886a76c374465019c1a339f4edaeccbf02ec87a2acc3089249138.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffd3b38186b2886a76c374465019c1a339f4edaeccbf02ec87a2acc3089249138.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffd3b38186b2886a76c374465019c1a339f4edaeccbf02ec87a2acc3089249138.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6daj5slaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="build-a-twilio-function-section-indexable"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-a8lapc"><h3 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="build-a-twilio-function" class="css-yftbgj">Build a Twilio Function</h3><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#build-a-twilio-function" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1aj8eclaatasm:"><title id="LinkIcon-:R1aj8eclaatasm:">build-a-twilio-function page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R9jal8eclaatasm:"><title id="ThumbsUpIcon-:R9jal8eclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R9lal8eclaatasm:"><title id="ThumbsDownIcon-:R9lal8eclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><ol data-paste-element="ORDERED_LIST" data-paste-core-version="20.6.0" class="css-w38rkw"> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">To build a Twilio Function, navigate to the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/runtime/functions/manage" rel="noreferrer noopener" target="_blank" title="Twilio Functions" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Twilio Functions<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:R2l518mclaatasm:"><title id="LinkExternalIcon-:R2l518mclaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> section of the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/runtime/functions/manage" rel="noreferrer noopener" target="_blank" title="Twilio Console." class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Twilio Console.<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:R2l918mclaatasm:"><title id="LinkExternalIcon-:R2l918mclaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a></li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Create Service.</strong></li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">A modal will appear where you can name your Service. The name cannot be changed after you create the Service. You can name the Service anything you like — this tutorial will use <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">Tutorial</code>.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Next</strong>. You will be taken to the Functions interface.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Click <strong>Add +</strong> at the top of the Function's page to add a Function to your environment.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Add a path for the Function. You can make the path anything you like — this tutorial uses <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">/barista-bot</code></li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Some example code will be placed in the file editor. This editor is where you will place the code sample below.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">With your code in place, click <strong>Save</strong> and select <strong>Copy URL</strong> from the bottom of the code editor window.</li> <li data-paste-element="LIST_ITEM" data-paste-core-version="20.6.0" class="css-1pp5a8v">Select <strong>Deploy All</strong> to make your function live. Your Studio Flow will now be able to call the Function.</li> </ol><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">You can now return to your Studio Flow.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">For this tutorial, you will log the customers order with the Function using the following code sample. If you are handling a drink order, you should call another service or write to a database from your Function at this point.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-slcqjs"><div data-paste-element="CODE_BLOCK_WRAPPER" data-paste-core-version="20.7.0" class="css-1ft5k6i"><style data-emotion="css 1lrte93">.css-1lrte93{box-sizing:border-box;background-color:rgb(18, 28, 45);display:grid;grid-template-rows:auto 1fr;grid-template-areas:"button-group" "code-block";row-gap:0.25rem;padding-top:1rem;}</style><div data-paste-element="CODE_BLOCK" data-paste-core-version="20.7.0" class="css-1lrte93"><style data-emotion="css ba3ttd">.css-ba3ttd{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-column-gap:0.75rem;column-gap:0.75rem;-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;grid-area:button-group;padding-right:1.5rem;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-ba3ttd"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><button data-paste-element="CODE_BLOCK_COPY_BUTTON" data-paste-core-version="20.7.0" type="button" tabindex="0" aria-describedby=":R16d9eclaatasm:" aria-busy="false" class="css-11aawc9"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="CopyIcon-:R6j76d9eclaatasm:"><path fill="currentColor" fill-rule="evenodd" d="M13.469 2.5c.63 0 1.15.48 1.212 1.094l.007.125-.001 1.593h1.407c.73 0 1.331.558 1.4 1.271l.006.136v9.375c0 .776-.63 1.406-1.406 1.406H6.719c-.777 0-1.407-.63-1.407-1.406v-1.407H3.719c-.631 0-1.15-.48-1.213-1.094L2.5 13.47v-9.75c0-.631.48-1.15 1.094-1.213L3.72 2.5h9.75zm2.625 3.75H6.719a.469.469 0 00-.469.469v9.375c0 .259.21.468.469.468h9.375c.259 0 .468-.21.468-.468V6.719a.469.469 0 00-.468-.469zm-2.625-2.813h-9.75a.281.281 0 00-.274.217l-.007.065v9.75c0 .133.092.244.216.274l.065.007 1.593-.001v-7.03c0-.731.558-1.332 1.271-1.4l.136-.006 7.031-.001V3.719a.281.281 0 00-.217-.274l-.064-.007z"></path></svg></span><span data-paste-element="BOX" data-paste-core-version="20.7.0" aria-live="polite" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1cbdvo6">Copy code block</span></span></span></span></button></div></div><style data-emotion="css 1yf26d7">.css-1yf26d7{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow-x:auto;grid-area:code-block;}</style><div data-paste-element="CODE_BLOCK_CONTENT" data-paste-core-version="20.7.0" class="css-1yf26d7"><pre data-theme="github-dark" data-lang="javascript" style="color:white;font-family:'TwilioSansMono', Courier, monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;font-size:1em;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;margin:0;overflow:auto;background:inherit;width:100%;padding-bottom:2rem" tabindex="0" class="css-1p78m0" data-ch="true"><div style="min-width:fit-content"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css 519pyc">.css-519pyc{box-sizing:border-box;display:inline-block;box-sizing:content-box;opacity:0.5;padding-left:1.5rem;padding-right:1.5ch;text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;min-width:1ch;}</style><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">1</span><style data-emotion="css luzz01">.css-luzz01{box-sizing:border-box;display:inline-block;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#79C0FF">exports</span><span style="color:#C9D1D9">.</span><span style="color:#D2A8FF">handler</span> <span style="color:#FF7B72">= function</span><span style="color:#C9D1D9">(</span><span style="color:#FFA657">context</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">event</span><span style="color:#C9D1D9">,</span> <span style="color:#FFA657">callback</span><span style="color:#C9D1D9">) {</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">2</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#C9D1D9">console.</span><span style="color:#D2A8FF">log</span><span style="color:#C9D1D9">(event.drink);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">3</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div> <span style="color:#D2A8FF">callback</span><span style="color:#C9D1D9">(</span><span style="color:#79C0FF">null</span><span style="color:#C9D1D9">,</span> <span style="color:#A5D6FF">'success'</span><span style="color:#C9D1D9">);</span> </div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-519pyc">4</span><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-luzz01"><div><span style="color:#C9D1D9">};</span></div></div></div></div></pre></div></div></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Function shown within Twilio Functions console." loading="lazy" width="1600" height="632" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 632'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/ABsfIv+VlpP/y83L/+vr6/8AxcXH/62trf/W1tX/srKy/3koGCbZDDgQAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F01b1edfee79fb7c8fec64ed3bf67558685988fa33978e67c708102fe3e5733af.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F01b1edfee79fb7c8fec64ed3bf67558685988fa33978e67c708102fe3e5733af.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F01b1edfee79fb7c8fec64ed3bf67558685988fa33978e67c708102fe3e5733af.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql5mclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Make sure to save your Function and go back to the Function widget inside your Twilio Studio flow. Select the Service where you created the Function, select <strong>ui</strong> for the Environment, and choose the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">barista-bot</code> Function.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">You can also add a parameter to the request which is just a value that will be sent to the Function. Scroll down to the section for <strong>Function Parameters</strong> and create a field called <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">drink</code>. The value can then be set to the same variable we're checking in our split above: <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">{{widgets.order_prompt.inbound.Body}}</code> (where <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">order_prompt</code> matches the name of your initial prompt widget).</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Function parameters in configuration." loading="lazy" width="1372" height="1186" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1372 1186'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AFZWVv8YGBn/VVVV/318ff8AhouN/yMkJP9lZWX/YWJi/wBBNjn/iIWF/87Q0P+bm5v/YRcak7ey0lgAAAAASUVORK5CYII='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F056c23aea72c78d16ad1b2952fa164c8c6dd076bed94302023963c8ed59ef397.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F056c23aea72c78d16ad1b2952fa164c8c6dd076bed94302023963c8ed59ef397.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F056c23aea72c78d16ad1b2952fa164c8c6dd076bed94302023963c8ed59ef397.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql6eclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once the request goes out to our barista function, we're all set! Our user will get the coffee they ordered, all from a pretty simple interaction.</p></section> <section id="human-handoff-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="human-handoff" class="css-16k5vxt">Human Handoff</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#human-handoff" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9keslaatasm:"><title id="LinkIcon-:Rl9keslaatasm:">human-handoff page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakeslaatasm:"><title id="ThumbsUpIcon-:R4plakeslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakeslaatasm:"><title id="ThumbsDownIcon-:R4qlakeslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">But what if the user doesn't enter one of our five coffee choices? We still want to help them out. Sometimes the best solution is for the chatbot to hand things off to a human. If the user enters something that isn't on our list, let's offer to give them a phone call so the barista can get the order directly. We'll drag another <strong>Send & Wait For Reply</strong> Widget onto the Canvas, and this time connect it to the No Condition Matches transition on our <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">split_order</code> widget.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot ask_to_call Widget added connected to No Condition Matches condition." loading="lazy" width="1600" height="999" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 999'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKklEQVR4nGO4ePH6f01N0/8xobH/QYCBjZP//+x5i/9PmTL9/7ZtO/4DAFdfFOE3nex3AAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fe2f3fee462f7546ce24b6bccc01026beb729abdf74b88aa9cca092ff172ee5a6.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fe2f3fee462f7546ce24b6bccc01026beb729abdf74b88aa9cca092ff172ee5a6.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fe2f3fee462f7546ce24b6bccc01026beb729abdf74b88aa9cca092ff172ee5a6.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6daiuslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">For the message prompt, we'll put "We want to make sure you get your coffee, even if we're not quite sure how you take it. We'll connect you to a barista directly — is now a good time to call?" Another <strong>Split Based On...</strong> Widget will help us handle the user's response here — if they type "Y" or "yes" we can make the call to the barista. Let's drag the Widget onto the Canvas and select the <code data-paste-element="INLINE_CODE" data-paste-core-version="20.7.0" class="css-1kwd7zr">inbound.Body</code> Liquid variable of our latest <strong>Send & Wait For Reply</strong> as the variable to test, then create our conditions.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot split_on_call Widget connected from ask_to_call Widget." loading="lazy" width="1270" height="1226" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1270 1226'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAT0lEQVR4nAFEALv/AOzu8P9+fn//cHBy/9/g4v8A6uno/ywoJP9RU1X/7u/x/wDZ2dn/uru7/9fY2f/w9PX/AKOkp/8CBgb/W0dL/9/d3/9PrS7DfN4xpQAAAABJRU5ErkJggg=='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F0fe458f8a437ff690de197ba845fccc60bf6966b36b1c068788966c6bbaacdae.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F0fe458f8a437ff690de197ba845fccc60bf6966b36b1c068788966c6bbaacdae.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F0fe458f8a437ff690de197ba845fccc60bf6966b36b1c068788966c6bbaacdae.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajeslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="make-an-outgoing-call-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="make-an-outgoing-call" class="css-16k5vxt">Make an Outgoing Call</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#make-an-outgoing-call" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:Rl9kfclaatasm:"><title id="LinkIcon-:Rl9kfclaatasm:">make-an-outgoing-call page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R4plakfclaatasm:"><title id="ThumbsUpIcon-:R4plakfclaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R4qlakfclaatasm:"><title id="ThumbsDownIcon-:R4qlakfclaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">From here, we can drag a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/make-outgoing-call" title="Make Outgoing Call Widget" class="css-lpeit6">Make Outgoing Call Widget</a></strong> onto the Canvas and connect it to our 'y, yes' condition. Studio will trigger an outbound call from the Flow to the user so they can speak with a barista.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Make Outgoing Call v2 Widget directed towards {{contact.channel.address}} Liquid variable." loading="lazy" width="1116" height="1188" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1116 1188'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAT0lEQVR4nAFEALv/ANzd3v+DhYb/mpSX/+3t7/8AztDT/1BSWv+LeH//2NXX/wDk5en/ycrL/9LV1f/y9fb/ANLV1f8EBgf/dXV2//v9/f+TkDFiuM8vYgAAAABJRU5ErkJggg=='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffc473d71d01c8659e3856aeaba035cc952a1c6d693b8009ac24e1038fadb8368.png&w=1200&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffc473d71d01c8659e3856aeaba035cc952a1c6d693b8009ac24e1038fadb8368.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Ffc473d71d01c8659e3856aeaba035cc952a1c6d693b8009ac24e1038fadb8368.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6daivclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once the user picks up, we'll use a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/sayplay" title="Say/Play Widget" class="css-lpeit6">Say/Play Widget</a></strong> to announce that we're connecting them to the barista, and then a <strong><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="/docs/studio/widget-library/connect-call" title="Connect Call To Widget" class="css-lpeit6">Connect Call To Widget</a></strong> to connect them once the message is finished playing. Drag these Widgets onto the Canvas and connect the dots.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Connect to Barista using Say/Play Widget and Connect Call To Widget." loading="lazy" width="892" height="1278" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 892 1278'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAYAAABLLYUHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAP0lEQVR4nAE0AMv/AM3R0v8ZGxv/uLm5/wCbn5//Wlxd/+Di5P8AlZub/7m9u//q6+3/AN/g4f8REhP/r7Cx/2QxIhRq0wqeAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F442cbd654322d71696015ba670223f15f58516f1e20383d21706713a0627f3fe.png&w=1080&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F442cbd654322d71696015ba670223f15f58516f1e20383d21706713a0627f3fe.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F442cbd654322d71696015ba670223f15f58516f1e20383d21706713a0627f3fe.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:R6dajfclaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--></section> <section id="the-finished-product-section-indexable"><hr data-paste-element="SEPARATOR" data-paste-core-version="20.7.0" aria-orientation="horizontal" class="css-1y5brhz"/><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-m8ey6p"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-gt12nx"><h2 data-paste-element="HEADING" data-paste-core-version="20.6.0" id="the-finished-product" class="css-16k5vxt">The Finished Product</h2><a data-paste-element="BOX" data-paste-core-version="20.7.0" href="#the-finished-product" class="css-f02h4i"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="LinkIcon-:R1aj8fslaatasm:"><title id="LinkIcon-:R1aj8fslaatasm:">the-finished-product page anchor</title><path fill="currentColor" d="M13.074 5.674a2.3 2.3 0 013.252 3.252l-2.97 2.97A2.3 2.3 0 019.869 8.92a.5.5 0 10-.808-.588 3.3 3.3 0 005.004 4.272l2.97-2.97a3.3 3.3 0 00-4.667-4.666l-.467.466a.5.5 0 10.707.707l.467-.466z"></path><path fill="currentColor" d="M9.18 7.163a2.3 2.3 0 011.952 3.65.5.5 0 10.809.59A3.3 3.3 0 006.936 7.13l-2.97 2.97a3.3 3.3 0 004.667 4.667l.58-.58a.5.5 0 10-.707-.707l-.58.58a2.3 2.3 0 11-3.252-3.252l2.97-2.97c.409-.41.958-.652 1.536-.675z"></path></svg></span></a></div></div><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1kam78h"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-knmi57"><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsUpIcon-:R9jal8fslaatasm:"><title id="ThumbsUpIcon-:R9jal8fslaatasm:">Positive Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M6.5 7.45c.194-.216.406-.451.628-.707.799-.922 1.608-1.972 1.898-2.838.314-.938 1.139-1.487 1.966-1.395a1.57 1.57 0 011.085.621c.277.363.423.85.423 1.43 0 .327-.081.645-.174.924-.062.186-.139.383-.208.56l-.088.226c-.092.245-.15.432-.166.582-.014.134.01.19.033.222l.001.001a.415.415 0 00.1.058 1.9 1.9 0 00.371.11c.32.068.725.106 1.152.124.632.026 1.237.01 1.634-.002.147-.004.265-.008.345-.008.25 0 .731.008 1.158.218.224.11.443.28.603.537.159.256.239.567.239.924 0 1.218-.524 3.647-1.553 5.695-.31.616-.693.885-1.18 1.193-.574.364-1.145.575-1.767.575h-3c-1.116 0-2.204-.418-3.002-.883a6.393 6.393 0 01-.498-.322v.372a.5.5 0 01-.5.5H3a.5.5 0 01-.5-.5V7a.5.5 0 01.5-.5h3a.5.5 0 01.5.5v.45zm3.474-3.228c.186-.554.611-.751.909-.718a.57.57 0 01.399.233c.114.15.218.409.218.824 0 .17-.044.37-.123.61a9.287 9.287 0 01-.177.474c-.034.087-.07.177-.105.273-.095.252-.194.542-.225.827-.032.297.005.636.23.935.135.178.322.291.491.367.175.078.372.134.571.176.4.084.869.125 1.317.144.676.028 1.382.008 1.767-.003.118-.003.206-.006.254-.006.25 0 .519.018.717.115.088.044.15.098.194.168.044.07.089.19.089.396 0 1.04-.476 3.316-1.447 5.246-.184.367-.375.516-.82.797-.468.296-.855.42-1.233.42h-3c-.884 0-1.796-.338-2.498-.747a4.464 4.464 0 01-.813-.591 1.36 1.36 0 01-.184-.207l-.005-.008V8.968a7.331 7.331 0 01.329-.39l.308-.343c.223-.246.483-.534.746-.837.788-.909 1.73-2.097 2.091-3.176zM5.5 7.5h-2v7.667h2V7.5z"></path></svg></span></span></button><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" aria-pressed="false" type="button" aria-busy="false" class="css-1b15v5e"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" width="100%" height="100%" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" aria-labelledby="ThumbsDownIcon-:R9lal8fslaatasm:"><title id="ThumbsDownIcon-:R9lal8fslaatasm:">Negative Feedback</title><path fill="currentColor" fill-rule="evenodd" clip-rule="evenodd" d="M13.5 12.55c-.194.215-.406.451-.628.707-.799.921-1.608 1.972-1.898 2.838-.314.938-1.139 1.487-1.966 1.395a1.57 1.57 0 01-1.085-.621c-.277-.363-.423-.85-.423-1.43 0-.327.081-.645.174-.924.062-.186.139-.383.208-.56l.088-.226c.092-.245.15-.432.166-.582.014-.134-.01-.19-.033-.222l-.001-.001a.416.416 0 00-.1-.058 1.902 1.902 0 00-.371-.11 7.35 7.35 0 00-1.152-.124 22.958 22.958 0 00-1.634.002 14.2 14.2 0 01-.345.008c-.25 0-.731-.008-1.158-.218a1.451 1.451 0 01-.603-.537c-.159-.257-.239-.567-.239-.924 0-1.218.524-3.648 1.553-5.696.31-.616.693-.884 1.18-1.192C5.807 3.71 6.378 3.5 7 3.5h3c1.116 0 2.204.417 3.002.883.178.104.345.212.498.321v-.37a.5.5 0 01.5-.5h3a.5.5 0 01.5.5V13a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5v-.45zm-3.474 3.227c-.186.554-.611.752-.909.72a.571.571 0 01-.399-.234c-.114-.15-.218-.409-.218-.824a2 2 0 01.123-.61c.054-.16.113-.312.177-.475.034-.086.07-.176.105-.272.095-.252.194-.542.225-.828.032-.296-.005-.635-.23-.934a1.23 1.23 0 00-.491-.367 2.874 2.874 0 00-.571-.176 8.31 8.31 0 00-1.317-.144c-.676-.029-1.381-.008-1.767.003-.118.003-.206.006-.254.006-.25 0-.519-.018-.717-.115a.452.452 0 01-.194-.168c-.044-.07-.089-.19-.089-.396 0-1.04.476-3.316 1.447-5.247.184-.366.375-.515.82-.796.468-.296.855-.42 1.233-.42h3c.884 0 1.796.337 2.498.747.349.203.628.414.813.59.093.09.152.16.184.208l.005.007v4.98a7.245 7.245 0 01-.329.39 54.1 54.1 0 01-.308.342c-.223.247-.483.534-.746.838-.788.909-1.73 2.096-2.091 3.175zM14.5 12.5h2V4.833h-2V12.5z"></path></svg></span></span></button></div></div></div><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">The final state of the Canvas is that we have our <strong>Trigger (Start)</strong> Widget take an incoming message, connect to a <strong>Send & Wait For Reply</strong> Widget, then to a <strong>Split Based On…</strong> Widget, with transitions to either a Twilio Function (successful order) or another <strong>Send & Wait For Reply</strong> (unsuccessful order). This second <strong>Send & Wait For Reply</strong> connects to a <strong>Split Based On…</strong> Widget, which ultimately leads to a <strong>Make Outgoing Call</strong> Widget that calls the user from the bot, a <strong>Say/Play</strong> Widget that announces the connection, and a <strong>Connect Call To</strong> Widget which connects the user to the barista by voice.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Twilio Studio Tutorial Baristabot Full Studio Flow." loading="lazy" width="832" height="1458" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 832 1458'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAECAYAAACk7+45AAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nGMw1tb7H+Ef/J8hOzv3f31983+GwuKS/0ePHv/PEBoZ/f/s+Qv/ATJ4E2Fi0SXcAAAAAElFTkSuQmCC'/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F376685e87f3d508fea70700eb193a86ca6b6bdcf65606edeaedd2ebcf595b2f8.png&w=1080&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F376685e87f3d508fea70700eb193a86ca6b6bdcf65606edeaedd2ebcf595b2f8.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2F376685e87f3d508fea70700eb193a86ca6b6bdcf65606edeaedd2ebcf595b2f8.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql4vslaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Once you're happy with your Flow and you've published all changes, you can connect it to a Twilio Number so people can start interacting with it.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Navigate to the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://www.twilio.com/console/phone-numbers/incoming" rel="noreferrer noopener" target="_blank" title="Active Numbers section of the Twilio Console" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Active Numbers section of the Twilio Console<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rl99fslaatasm:"><title id="LinkExternalIcon-:Rl99fslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> and click on the number you'd like to connect to the Flow. (If you do not have any phone numbers, you can <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://help.twilio.com/hc/en-us/articles/223135247-How-to-Search-for-and-Buy-a-Twilio-Phone-Number-from-Console" rel="noreferrer noopener" target="_blank" title="purchase one from the Console" class="css-lpeit6"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">purchase one from the Console<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rla9fslaatasm:"><title id="LinkExternalIcon-:Rla9fslaatasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>.)</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">After clicking on the number, you will see its configuration menu where you can connect the number to your Studio Flow.</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">To trigger a Studio Flow with an Incoming Message, scroll down to the Messaging section in the configuration menu. Under <strong>Configure with Other Handlers</strong>, select the dropdown option "Webhook, TwiML Bin, Function, Studio Flow, Proxy Service". Then, under <strong>A Message Comes In</strong>, select the dropdown option "Studio Flow". You'll see another dropdown menu appear where you can select the Studio Flow you'd like to connect to when a message comes in to this number.</p><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wszb6a"><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj"><img alt="Configure a Studio Flow to connect to a Messaging number." loading="lazy" width="1570" height="850" decoding="async" data-nimg="1" style="color:transparent;background-size:cover;background-position:50% 50%;background-repeat:no-repeat;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1570 850'%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='none' style='filter: url(%23b);' href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKUlEQVR4nGNQV9f4v3nzlv/Pnj///+v37/8MHh4e/3t7e8ECr1+//g8AeuwYIcmrahAAAAAASUVORK5CYII='/%3E%3C/svg%3E")" srcSet="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fbe596b31cd689ac1f172f83460ba69d0ab4bd416e5faa2f63309921377f8fbbf.png&w=1920&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 1x, /_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fbe596b31cd689ac1f172f83460ba69d0ab4bd416e5faa2f63309921377f8fbbf.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe 2x" src="/_next/image?url=https%3A%2F%2Fdocs-assets.prod.twilio.com%2Fbe596b31cd689ac1f172f83460ba69d0ab4bd416e5faa2f63309921377f8fbbf.png&w=3840&q=75&dpl=dpl_3ZuqWh1QtrSXCRJG4oqPP5VViMwe"/><button data-paste-element="BUTTON" data-paste-core-version="20.7.0" type="button" aria-busy="false" class="css-zv9zrj"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1lgr57j"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" fill="none" viewBox="0 0 20 20" aria-labelledby="ZoomInIcon-:Rcql67slaatasm:"><path fill="currentColor" d="M5.5 8a.5.5 0 000 1H8v2.5a.5.5 0 101 0V9h2.5a.5.5 0 000-1H9V5.5a.5.5 0 00-1 0V8H5.5z"></path><path fill="currentColor" fill-rule="evenodd" d="M12.8 13.507a6.543 6.543 0 01-10.303-7.47 6.542 6.542 0 1111.01 6.762l4.347 4.347a.5.5 0 11-.708.707l-4.345-4.346zM5.464 3.933a5.542 5.542 0 016.997 8.526l-.014.015a5.543 5.543 0 11-6.983-8.54z" clip-rule="evenodd"></path></svg></span>Expand image</span></button></div></div><!--$--><!--/$--><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Choose the Flow you'd like to connect the number to, and then press <strong>Save</strong> to save these changes. Your Flow is now connected to your Twilio number!</p><p data-paste-element="PARAGRAPH" data-paste-core-version="20.6.0" class="css-tcah8o">Congratulations! You've made a chatbot that is smart enough to route a coffee order to a barista system, or to hand off to a human if things get tricky. What other chatbots will you build next?</p></section></div></div></div><style data-emotion="css n7gvag">.css-n7gvag{box-sizing:border-box;margin-top:2rem;margin-bottom:2rem;margin-left:1.75rem;margin-right:1.75rem;padding-top:4.75rem;position:relative;}@media screen and (min-width: 768px){.css-n7gvag{margin-top:2rem;margin-bottom:2rem;margin-left:1.75rem;margin-right:1.75rem;}}@media screen and (min-width: 1024px){.css-n7gvag{margin-top:3rem;margin-bottom:3rem;margin-left:2.25rem;margin-right:2.25rem;}}@media screen and (min-width: 1385px){.css-n7gvag{margin-left:2.75rem;margin-right:2.75rem;}}</style><footer data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-n7gvag"><style data-emotion="css pg6uce">.css-pg6uce{box-sizing:border-box;border-radius:4px;background-color:rgb(18, 28, 45);margin-top:0;padding-top:0;}@media screen and (min-width: 768px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1024px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1385px){.css-pg6uce{margin-top:0;padding-top:0;}}@media screen and (min-width: 1942px){.css-pg6uce{margin-top:4.75rem;padding-top:4.75rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-pg6uce"><style data-emotion="css wzkleb">.css-wzkleb{box-sizing:border-box;max-width:77rem;padding:2rem;margin-top:0.125rem;margin-left:auto;margin-right:auto;position:relative;}@media screen and (min-width: 768px){.css-wzkleb{padding:4.25rem;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-wzkleb"><style data-emotion="css 1xkeua1">.css-1xkeua1{box-sizing:border-box;display:none;right:0;position:absolute;}@media screen and (min-width: 768px){.css-1xkeua1{display:none;}}@media screen and (min-width: 1024px){.css-1xkeua1{display:none;}}@media screen and (min-width: 1385px){.css-1xkeua1{display:block;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1xkeua1"><img aria-hidden="true" role="img" alt="" loading="lazy" width="460" height="324" decoding="async" data-nimg="1" style="color:transparent" src="/_next/static/media/footer-min.eb6c3e3d.svg"/></div><style data-emotion="css 1bt0omd">.css-1bt0omd{box-sizing:border-box;position:relative;}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1bt0omd"><style data-emotion="css 1uxvx9z">.css-1uxvx9z{box-sizing:border-box;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-bottom:1.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1uxvx9z{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1uxvx9z"><style data-emotion="css 1aljbmp">.css-1aljbmp{margin:0;padding:0;color:rgb(255, 255, 255);font-size:1.25rem;line-height:1.75rem;font-family:'TwilioSansDisplay','Inter var experimental','Inter var',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',sans-serif;font-weight:800;margin-top:0.75rem;}@media screen and (min-width: 768px){.css-1aljbmp{font-size:2rem;line-height:2.5rem;margin-top:0;}}</style><h2 data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-1aljbmp">Need some help?</h2></div><style data-emotion="css 1hxyz3w">.css-1hxyz3w{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;text-align:center;}@media screen and (min-width: 768px){.css-1hxyz3w{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><nav data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1hxyz3w"><style data-emotion="css 1b5a60l">.css-1b5a60l{box-sizing:border-box;-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin-bottom:1.25rem;margin-right:0;max-width:100%;}@media screen and (min-width: 768px){.css-1b5a60l{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;margin-right:3rem;max-width:100%;}}@media screen and (min-width: 1024px){.css-1b5a60l{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;max-width:100%;}}@media screen and (min-width: 1385px){.css-1b5a60l{-webkit-box-flex:0;-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0;max-width:calc(100% - 28rem);}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1b5a60l"><style data-emotion="css w6f2uy">.css-w6f2uy{margin:0;padding:0;color:rgb(255, 255, 255);font-size:1rem;line-height:1.25rem;}</style><p data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-w6f2uy">We all do sometimes; code is hard. Get help now from our <style data-emotion="css 1az6u6g">.css-1az6u6g{box-sizing:border-box;color:rgb(255, 255, 255);font-size:inherit;font-weight:inherit;line-height:inherit;outline:none;-webkit-text-decoration:underline;text-decoration:underline;}.css-1az6u6g:active,.css-1az6u6g[data-active=true]{color:rgb(255, 255, 255);-webkit-text-decoration:none;text-decoration:none;}.css-1az6u6g:focus{box-shadow:0 0 0 1px #394762,0 0 0 3px #121c2d,0 0 0 4px #ffffff,0 0 0 6px rgba(255, 255, 255, 0.2);color:rgb(255, 255, 255);-webkit-text-decoration:underline;text-decoration:underline;border-radius:4px;}.css-1az6u6g:hover{color:rgb(255, 255, 255);-webkit-text-decoration:none;text-decoration:none;}</style><a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://help.twilio.com" rel="noreferrer noopener" target="_blank" title="support team" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">support team<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rl9ailaetasm:"><title id="LinkExternalIcon-:Rl9ailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a>, or lean on the wisdom of the crowd by visiting Twilio's <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://stackoverflow.com/collectives/twilio" rel="noreferrer noopener" target="_blank" title="Stack Overflow Collective" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Stack Overflow Collective<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlaailaetasm:"><title id="LinkExternalIcon-:Rlaailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> or browsing the <a data-paste-element="ANCHOR" data-paste-core-version="20.7.0" href="https://stackoverflow.com/questions/tagged/twilio" rel="noreferrer noopener" target="_blank" title="Twilio tag" class="css-1az6u6g"><span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-roynbj">Twilio tag<span data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1ezs782"><span data-paste-element="ICON" data-paste-core-version="20.7.0" class="css-pe4vrq"><svg role="img" aria-hidden="false" xmlns="http://www.w3.org/2000/svg" width="100%" height="100%" viewBox="0 0 20 20" aria-labelledby="LinkExternalIcon-:Rlbailaetasm:"><title id="LinkExternalIcon-:Rlbailaetasm:">(link takes you to an external page)</title><path fill="currentColor" fill-rule="evenodd" d="M8.4 4.5a.5.5 0 01.5.5v.1a.5.5 0 01-.5.5H5.6v8.8h8.8v-2.8a.5.5 0 01.41-.492l.09-.008h.1a.5.5 0 01.492.41l.008.09V15a.5.5 0 01-.41.492L15 15.5H5a.5.5 0 01-.492-.41L4.5 15V5a.5.5 0 01.41-.492L5 4.5h3.4zm6.6 0a.5.5 0 01.5.5v.1l-.001.01.001 3.29a.5.5 0 01-.5.5h-.1a.5.5 0 01-.5-.5l-.001-1.935-3.967 3.967a.611.611 0 01-.78.07l-.084-.07a.611.611 0 01-.07-.78l.07-.084L13.534 5.6H11.6a.5.5 0 01-.5-.5V5a.5.5 0 01.5-.5H15z"></path></svg></span></span></span></a> on Stack Overflow.</p></div></nav><style data-emotion="css 1o3xt00">.css-1o3xt00{box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;margin-top:2.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1o3xt00{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1o3xt00"><style data-emotion="css 2ch0jy">.css-2ch0jy{box-sizing:border-box;display:block;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-flex-wrap:wrap;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}@media screen and (min-width: 768px){.css-2ch0jy{display:block;}}@media screen and (min-width: 1024px){.css-2ch0jy{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}}</style><div data-paste-element="STACK" data-paste-core-version="20.7.0" class="css-2ch0jy"><style data-emotion="css 1hsc1sb">.css-1hsc1sb{box-sizing:border-box;margin-right:0;margin-bottom:1.25rem;}@media screen and (min-width: 768px){.css-1hsc1sb{margin-right:0;margin-bottom:1.25rem;}}@media screen and (min-width: 1024px){.css-1hsc1sb{margin-right:1.25rem;margin-bottom:0;}}</style><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-1hsc1sb"><style data-emotion="css 6i08t">.css-6i08t{color:rgb(255, 255, 255);}</style><a class="css-6i08t" href="/en-us/legal/tos">Terms of service</a></div><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-1hsc1sb"><a class="css-6i08t" href="/en-us/legal/privacy">Privacy Policy</a></div><div data-paste-element="STACK_CHILD" data-paste-core-version="20.7.0" class="css-roynbj"><style data-emotion="css g9v2ra">.css-g9v2ra{margin:0;padding:0;color:rgb(255, 255, 255);font-size:0.875rem;line-height:1.25rem;}</style><p data-paste-element="TEXT" data-paste-core-version="20.6.0" class="css-g9v2ra">Copyright © 2024 Twilio Inc.</p></div></div></div><style data-emotion="css 1gyumqz">.css-1gyumqz{box-sizing:border-box;margin-top:2.75rem;text-align:center;}@media screen and (min-width: 768px){.css-1gyumqz{text-align:left;}}</style><div data-paste-element="BOX" data-paste-core-version="20.7.0" class="css-1gyumqz"><a href="https://twilio.com/" aria-label="Go to Twilio homepage"><span style="color:rgb(255, 255, 255);width:5.5rem;height:1.5rem;display:inline-block"><svg aria-hidden="true" aria-labelledby=":Rklaetasm:" height="100%" role="img" viewBox="0 0 88 24" width="100%"><title id=":Rklaetasm:">Twilio</title><path fill="currentColor" d="M11.52 9.04c0 1.36-1.12 2.48-2.48 2.48-1.36 0-2.48-1.12-2.48-2.48 0-1.36 1.12-2.48 2.48-2.48 1.36 0 2.48 1.12 2.48 2.48zm-2.48 3.44c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zM24 12c0 6.64-5.36 12-12 12S0 18.64 0 12 5.36 0 12 0s12 5.36 12 12zm-3.2 0c0-4.88-3.92-8.8-8.8-8.8-4.88 0-8.8 3.92-8.8 8.8 0 4.88 3.92 8.8 8.8 8.8 4.88 0 8.8-3.92 8.8-8.8zm-5.84.48c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zm0-5.92c-1.36 0-2.48 1.12-2.48 2.48 0 1.36 1.12 2.48 2.48 2.48 1.36 0 2.48-1.12 2.48-2.48 0-1.36-1.12-2.48-2.48-2.48zm41.28-1.84c.08 0 .16.08.24.16v2.56c0 .16-.16.24-.24.24H52c-.16 0-.24-.16-.24-.24V4.96c0-.16.16-.24.24-.24h4.24zm-.08 3.6H48c-.08 0-.24.08-.24.24l-1.04 4-.08.24-1.28-4.24c0-.08-.16-.24-.24-.24h-3.2c-.08 0-.24.08-.24.24l-1.2 4-.08.24-.08-.24-.48-2-.48-2c0-.08-.16-.24-.24-.24h-6.4V4.88c0-.08-.16-.24-.32-.16L28.4 6c-.16 0-.24.08-.24.24V8.4h-1.04c-.08 0-.24.08-.24.24v3.04c0 .08.08.24.24.24h1.04v3.76c0 2.64 1.44 3.84 4.08 3.84 1.12 0 2.16-.24 2.88-.64v-3.2c0-.16-.16-.24-.24-.16-.4.16-.8.24-1.12.24-.72 0-1.12-.32-1.12-1.12v-2.72h2.32c.08 0 .24-.08.24-.24V9.12l3.04 10.08c0 .08.16.24.24.24h3.36c.08 0 .24-.08.24-.24l1.44-4.48.72 2.32.64 2.16c0 .08.16.24.24.24h3.36c.08 0 .24-.08.24-.24l3.04-10.08V19.2c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V8.56c0-.08-.08-.24-.16-.24zm5.36-3.6h-4.08c-.08 0-.24.08-.24.24v14.16c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V4.88c0-.08-.08-.16-.24-.16zm5.44 0h-4.24c-.08 0-.24.08-.24.24v2.48c0 .08.08.24.24.24h4.24c.08 0 .24-.08.24-.24V4.88c0-.08-.08-.16-.24-.16zm-.08 3.6H62.8c-.08 0-.24.08-.24.24v10.48c0 .08.08.24.24.24h4.08c.08 0 .24-.08.24-.24V8.56c0-.08-.08-.24-.24-.24zm12.88 5.44c0 3.04-2.56 5.68-6.16 5.68-3.52 0-6.08-2.64-6.08-5.68 0-3.04 2.56-5.68 6.16-5.68 3.52 0 6.08 2.64 6.08 5.68zm-4.32.08c0-1.12-.8-2-1.76-1.92-1.04 0-1.76.88-1.76 1.92s.8 1.92 1.76 1.92c1.04 0 1.76-.88 1.76-1.92z"></path></svg></span></a></div></div></div></div></footer><!--$--><!--/$--></div></div></div></div><div id="consent_blackbar"></div><div id="teconsent" style="position:fixed;bottom:0;right:0;z-index:30"></div><script id="__NEXT_DATA__" type="application/json">{"props":{"pageProps":{"source":{"compiledSource":"\"use strict\";\nconst {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n a: \"a\",\n \"aspect-ratio\": \"aspect-ratio\",\n code: \"code\",\n em: \"em\",\n h2: \"h2\",\n h3: \"h3\",\n li: \"li\",\n ol: \"ol\",\n p: \"p\",\n section: \"section\",\n strong: \"strong\",\n ul: \"ul\",\n \"youtube-embed\": \"youtube-embed\",\n ..._provideComponents(),\n ...props.components\n }, _component0 = _components[\"aspect-ratio\"], _component1 = _components[\"youtube-embed\"], {CodeBlock, Image, Warning} = _components;\n if (!CodeBlock) _missingMdxReference(\"CodeBlock\", true);\n if (!Image) _missingMdxReference(\"Image\", true);\n if (!Warning) _missingMdxReference(\"Warning\", true);\n return _jsxs(_Fragment, {\n children: [_jsx(_components.p, {\n children: \"Chatbots are a great way to help your users accomplish simple tasks in a friendly, conversational manner. Let's look at how to build a simple Flow that responds to incoming text messages and chats with your users to help them order a coffee.\"\n }), \"\\n\", _jsxs(_component0, {\n children: [\"\\n \", _jsxs(_component1, {\n videoid: \"VRxirse1UfQ\",\n children: [\"\\n \", _jsx(_component0, {})]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"prerequisites-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"prerequisites\",\n children: \"Prerequisites\"\n }), _jsxs(_components.p, {\n children: [\"To complete this tutorial, you will need to complete the following prerequisites. You can skip ahead to \", _jsx(_components.a, {\n href: \"#create-your-flow\",\n children: \"Create your Flow\"\n }), \" if you've already completed these tasks.\"]\n }), _jsxs(_components.ul, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Sign up for a Twilio account — you can \", _jsx(_components.a, {\n href: \"https://www.twilio.com/try-twilio\",\n children: \"create a free account\"\n }), \" if you don't have one already.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Purchase a Twilio phone number. Learn how to \", _jsx(_components.a, {\n href: \"/docs/messaging/guides/how-to-use-your-free-trial-account\",\n children: \"purchase a phone number with the Twilio documentation\"\n }), \". Please note that the number purchasing process varies by region.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Some familiarity with \", _jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/functions\",\n children: \"Twilio Functions\"\n }), \".\"]\n }), \"\\n\"]\n }), _jsx(Warning, {\n children: _jsxs(_components.p, {\n children: [\"This demo tutorial is best suited for use with a single Twilio Phone number. To scale this Flow with \", _jsx(_components.a, {\n href: \"/docs/messaging/services\",\n children: \"Twilio Messaging Services\"\n }), \", please \", _jsx(_components.a, {\n href: \"https://www.twilio.com/en-us/help/sales\",\n children: \"reach out to discuss your use case\"\n }), \".\"]\n })\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"create-your-flow-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"create-your-flow\",\n children: \"Create your Flow\"\n }), _jsxs(_components.p, {\n children: [\"You'll create a Twilio Studio Flow from Twilio's starter template in this tutorial. By the end, you'll understand how to construct a chatbot with minimal building blocks in place. You can also use the \", _jsx(_components.strong, {\n children: \"Messaging Chatbot\"\n }), \" template to begin with most of the pieces already in place.\"]\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Log into your Twilio account and navigate to the \", _jsx(_components.a, {\n href: \"https://www.twilio.com/console/studio/\",\n children: \"Studio Dashboard\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Create a flow\"\n }), \".\"]\n }), \"\\n\", _jsx(_components.li, {\n children: \"A modal will display where you can name your flow — this tutorial will use \\\"Barista Bot.\\\"\"\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Select \", _jsx(_components.strong, {\n children: \"Next\"\n }), \".\"]\n }), \"\\n\", _jsx(_components.li, {\n children: \"The modal will load several template options. Each template provides a different foundation of building blocks.\"\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Select \", _jsx(_components.strong, {\n children: \"Start from scratch\"\n }), \" to follow along with the rest of this tutorial. You can also select \", _jsx(_components.strong, {\n children: \"Messaging Chatbot\"\n }), \" to start with most of the pieces already on your Canvas and connected to one another.\"]\n }), \"\\n\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/c1253b859b3abeeab049a7a2543bd9ca5a396984a1c3731962992a57dc879b04.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/AOPi4v/Lzs//7u/x//f39/8AyMnJ/8rKyP+ys7T/ABcj/92WGcQnkukgAAAAAElFTkSuQmCC\",\n width: 1194,\n height: 472,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Barista Bot Flow.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"Once the Studio Flow is created, you'll see a Canvas with a Trigger Widget already in place. This Widget starts your Flow when it's triggered by an event that you specify. In this case, you want to receive SMS messages from customers, so you will trigger the Flow with an incoming message. You will add more Widgets throughout this tutorial by dragging them from the \", _jsx(_components.strong, {\n children: \"Widget Library\"\n }), \" on the right side of the Canvas.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/d5a554f534b9cffc4461382ac140d8f77368b96887261946aa78451325e4944d.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABCAYAAAD5PA/NAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAFklEQVR4nGPYt2jpf3tlDTB+eeHqfwBL+QmkeM72uAAAAABJRU5ErkJggg==\",\n width: 1600,\n height: 458,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot arrow pointing to Incoming Message transition of Trigger (Start) Widget.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"prompt-the-user-for-an-order-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"prompt-the-user-for-an-order\",\n children: \"Prompt the user for an order\"\n }), _jsx(_components.p, {\n children: \"When your bot receives a message, you will need to reply, prompting the customer for a coffee order.\"\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"add-a-send--wait-for-reply-widget-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"add-a-send--wait-for-reply-widget\",\n children: \"Add a Send \u0026 Wait for Reply Widget\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Start by dragging a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/send-wait-reply\",\n children: \"Send \u0026 Wait for Reply Widget\"\n })\n }), \" onto the Canvas from the \", _jsx(_components.strong, {\n children: \"Widget Library\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Connect it to the \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/trigger-start\",\n children: \"Trigger (Start) Widget\"\n })\n }), \" by dragging the red dot at the bottom of \", _jsx(_components.strong, {\n children: \"Incoming Call\"\n }), \" Transition to the grey dot at the corner of the new \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait for Reply\"\n }), \" Widget.\"]\n }), \"\\n\"]\n }), _jsxs(_components.p, {\n children: [\"You can use this \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait for Reply\"\n }), \" Widget to deliver an SMS to the user. In this case, you will ask the user what kind of coffee they want to order. You can expect the customer to reply with one of the options you specify.\"]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"configure-the-send--wait-for-reply-widget-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"configure-the-send--wait-for-reply-widget\",\n children: \"Configure the Send \u0026 Wait for Reply Widget\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Click the \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait for Reply\"\n }), \" Widget on the Canvas and select the Widget's \", _jsx(_components.strong, {\n children: \"Config\"\n }), \" tab.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"You can name the Widget anything you like — this tutorial will use \", _jsx(_components.code, {\n children: \"order_prompt\"\n })]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"In the Widget's \", _jsx(_components.strong, {\n children: \"Message Body\"\n }), \", add a friendly response that will be sent to the customer once your Flow is triggered — see the sample text below.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"You can leave the remaining Widget fields empty or set to their default values and click \", _jsx(_components.strong, {\n children: \"Save\"\n }), \".\"]\n }), \"\\n\"]\n }), _jsxs(_components.p, {\n children: [\"Sample \", _jsx(_components.strong, {\n children: \"Message Body\"\n }), \" text:\"]\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"Welcome to our automated ordering system. Please reply with one of the following: latte, cappuccino, americano, cortado, or cold brew.\",\n \"lang\": \"shellscript\",\n \"meta\": \"\",\n \"code\": \"Welcome to our automated ordering system. Please reply with one of the following: latte, cappuccino, americano, cortado, or cold brew.\",\n \"tokens\": [[\"Welcome\", \"#FFA657\"], \" \", [\"to our automated ordering system. Please reply with one of the following: latte, cappuccino, americano, cortado, or cold brew.\", \"#A5D6FF\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/8f3920a1d60d7e9f6d6b0bd9428e295c058487d1032921a57dea463f2092eb8c.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKUlEQVR4nGOwVNb4L8/A9L8+v+j/nPnz/zMUllf8v37v/n8QmDNt+n8AIUkUkjDiI1wAAAAASUVORK5CYII=\",\n width: 1600,\n height: 757,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot order_prompt Widget shown with configuration.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"Your Flow is now prepared to reply to an inbound message and wait for a response. Once a response is received, you will need to take action based on its content. You can use a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/split-based-on\",\n children: \"Split Based On... Widget\"\n })\n }), \" to handle this next step.\"]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"split-based-on-input-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"split-based-on-input\",\n children: \"Split Based on Input\"\n }), _jsxs(_components.p, {\n children: [\"The \", _jsx(_components.strong, {\n children: \"Split Based On…\"\n }), \" Widget allows you to distinguish among input (the customer's response, no response, and errors). It does this by setting a variable that you can test the input against.\"]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"add-and-configure-the-split-based-on-widget-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"add-and-configure-the-split-based-on-widget\",\n children: \"Add and configure the Split Based On... Widget\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Drag a \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget to the Canvas.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Connect the \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait for Reply\"\n }), \" Widget to the \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget by dragging the grey dot at the bottom of \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait for Reply\"\n }), \" Widget's \", _jsx(_components.strong, {\n children: \"Reply\"\n }), \" to the grey dot at the corner of the new \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click on the \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget and select the \", _jsx(_components.strong, {\n children: \"Config\"\n }), \" tab.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"You can now name the Widget — this tutorial will use \", _jsx(_components.code, {\n children: \"split_order\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"To set a variable to test input against, select \", _jsx(_components.strong, {\n children: \"order_prompt \u003e\"\n }), \" \", _jsx(_components.strong, {\n children: \"inbound.Body\"\n }), \" from the \", _jsx(_components.strong, {\n children: \"Variable to Test\"\n }), \" dropdown menu. This variable will contain the message body text sent by the customer.\"]\n }), \"\\n\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/859b7026fa6823b64e1ac411d04067057e0fe77bfdf7b538f67ba47161fbff32.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAYAAABLLYUHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAP0lEQVR4nAE0AMv/AOjp6v+FhIT/wcLD/wDf3+L/kY+P/6enp/8A5ujq/5ubnP+6urr/AMW+wP8eBw3/0tfX/9BSJHQeKfqrAAAAAElFTkSuQmCC\",\n width: 986,\n height: 1200,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Split Order Variable to Test field shown.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"add-transitions-to-handle-customer-input-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"add-transitions-to-handle-customer-input\",\n children: \"Add Transitions to handle customer input\"\n }), _jsxs(_components.p, {\n children: [\"Next, you need to declare the choices you're looking for in the customer's response — \", _jsx(_components.code, {\n children: \"latte\"\n }), \", \", _jsx(_components.code, {\n children: \"cappuccino\"\n }), \", \", _jsx(_components.code, {\n children: \"americano\"\n }), \", \", _jsx(_components.code, {\n children: \"cortado\"\n }), \", and \", _jsx(_components.code, {\n children: \"cold brew\"\n }), \".\"]\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Click the red \", _jsx(_components.strong, {\n children: \"New\"\n }), \" button at the bottom of the \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget to reveal the Widget's \", _jsx(_components.strong, {\n children: \"Transition On...\"\n }), \" dropdown menu. You can alternatively select the \", _jsx(_components.strong, {\n children: \"Transitions\"\n }), \" tab after clicking on the Widget.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Select \", _jsx(_components.strong, {\n children: \"Condition Matches\"\n }), \" to create a new Transition.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"From the Widget's \", _jsx(_components.strong, {\n children: \"Transitions\"\n }), \" tab, find the new \", _jsx(_components.strong, {\n children: \"Transition\"\n }), \" that you just created. It will be under the heading \", _jsx(_components.strong, {\n children: \"If Value Equal_To\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Select \", _jsx(_components.strong, {\n children: \"Matches Any Of\"\n }), \" from the first dropdown menu. You can now set the values you want to match from the customer's response — \", _jsx(_components.code, {\n children: \"latte\"\n }), _jsx(_components.em, {\n children: \",\"\n }), \" \", _jsx(_components.code, {\n children: \"cappuccino\"\n }), _jsx(_components.em, {\n children: \",\"\n }), \" \", _jsx(_components.code, {\n children: \"americano\"\n }), _jsx(_components.em, {\n children: \",\"\n }), \" \", _jsx(_components.code, {\n children: \"cortado\"\n }), _jsx(_components.em, {\n children: \",\"\n }), \" and \", _jsx(_components.code, {\n children: \"cold brew\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [_jsx(_components.strong, {\n children: \"Save\"\n }), \" the new Transition and it will appear on the Widget.\"]\n }), \"\\n\"]\n }), _jsxs(_components.p, {\n children: [\"Variable \", _jsx(_components.strong, {\n children: \"Matches Any Of\"\n }), \" values\"]\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"latte, cappuccino, americano, cortado, cold brew\",\n \"lang\": \"shellscript\",\n \"meta\": \"\",\n \"code\": \"latte, cappuccino, americano, cortado, cold brew\",\n \"tokens\": [[\"latte,\", \"#FFA657\"], \" \", [\"cappuccino, americano, cortado, cold brew\", \"#A5D6FF\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/1ca1998c62b8c9908b1299eac9a8d1110069b9325ccd228b1e5881f50de5edd8.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/ADs9Pv8vMTL/ysnN/zw+Pv8Apaeo/4yMj/+fm57/Lyss/yezElKzrqqCAAAAAElFTkSuQmCC\",\n width: 1600,\n height: 793,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Split Order Widget with Transition configuration shown.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"triggering-a-twilio-function-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"triggering-a-twilio-function\",\n children: \"Triggering a Twilio Function\"\n }), _jsxs(_components.p, {\n children: [\"If the user responds with something that the bot recognizes (one of your five drinks), you should send a request to the barista system to complete the order. You can use a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/run-function\",\n children: \"Run Function Widget\"\n })\n }), \" to do this.\"]\n }), _jsxs(_components.p, {\n children: [_jsx(_components.a, {\n href: \"/docs/serverless/functions-assets/functions\",\n children: \"Twilio Functions\"\n }), \" is a serverless environment that allows you to write Twilio applications without managing infrastructure. Twilio Functions are perfect for event-driven applications like the Barista Bot.\"]\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"add-and-configure-a-run-function-widget-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"add-and-configure-a-run-function-widget\",\n children: \"Add and configure a Run Function Widget\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"Drag a \", _jsx(_components.strong, {\n children: \"Run Function\"\n }), \" Widget onto the Canvas. This Widget is available in the \", _jsx(_components.strong, {\n children: \"Widget Library\"\n }), \" from \", _jsx(_components.strong, {\n children: \"Tools \u0026 Execute Code \u003e Run Function\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click on the \", _jsx(_components.strong, {\n children: \"Run Function\"\n }), \" Widget to configure it. You can name it anything you like — this tutorial will use \", _jsx(_components.code, {\n children: \"request_barista\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Connect the condition you just set in your \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget to your \", _jsx(_components.strong, {\n children: \"Run Function\"\n }), \" Widget.\"]\n }), \"\\n\"]\n }), _jsxs(_components.p, {\n children: [\"Before you can finish configuring your widget, you must create a Twilio Function. Once created, you will have a URL to add to your \", _jsx(_components.strong, {\n children: \"Run Function\"\n }), \" Widget.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/fd3b38186b2886a76c374465019c1a339f4edaeccbf02ec87a2acc3089249138.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AISEhf8XGCH/aWJn/+jm5/8AvcDA/5SWnf+Ni5L/ysvN/wDz9PX/5ujp/15iZP+fo6f/Nb0iab97hVEAAAAASUVORK5CYII=\",\n width: 1600,\n height: 1250,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot split_order Widget connecting to request_barista Widget.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"build-a-twilio-function-section-indexable\",\n children: [_jsx(_components.h3, {\n id: \"build-a-twilio-function\",\n children: \"Build a Twilio Function\"\n }), _jsxs(_components.ol, {\n children: [\"\\n\", _jsxs(_components.li, {\n children: [\"To build a Twilio Function, navigate to the \", _jsx(_components.a, {\n href: \"https://www.twilio.com/console/runtime/functions/manage\",\n children: \"Twilio Functions\"\n }), \" section of the \", _jsx(_components.a, {\n href: \"https://www.twilio.com/console/runtime/functions/manage\",\n children: \"Twilio Console.\"\n })]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Create Service.\"\n })]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"A modal will appear where you can name your Service. The name cannot be changed after you create the Service. You can name the Service anything you like — this tutorial will use \", _jsx(_components.code, {\n children: \"Tutorial\"\n }), \".\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Next\"\n }), \". You will be taken to the Functions interface.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Click \", _jsx(_components.strong, {\n children: \"Add +\"\n }), \" at the top of the Function's page to add a Function to your environment.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Add a path for the Function. You can make the path anything you like — this tutorial uses \", _jsx(_components.code, {\n children: \"/barista-bot\"\n })]\n }), \"\\n\", _jsx(_components.li, {\n children: \"Some example code will be placed in the file editor. This editor is where you will place the code sample below.\"\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"With your code in place, click \", _jsx(_components.strong, {\n children: \"Save\"\n }), \" and select \", _jsx(_components.strong, {\n children: \"Copy URL\"\n }), \" from the bottom of the code editor window.\"]\n }), \"\\n\", _jsxs(_components.li, {\n children: [\"Select \", _jsx(_components.strong, {\n children: \"Deploy All\"\n }), \" to make your function live. Your Studio Flow will now be able to call the Function.\"]\n }), \"\\n\"]\n }), _jsx(_components.p, {\n children: \"You can now return to your Studio Flow.\"\n }), _jsx(_components.p, {\n children: \"For this tutorial, you will log the customers order with the Function using the following code sample. If you are handling a drink order, you should call another service or write to a database from your Function at this point.\"\n }), _jsx(CodeBlock, {\n codeblock: {\n \"value\": \"exports.handler = function(context, event, callback) {\\n console.log(event.drink);\\n callback(null, 'success');\\n};\",\n \"lang\": \"javascript\",\n \"meta\": \"\",\n \"code\": \"exports.handler = function(context, event, callback) {\\n console.log(event.drink);\\n callback(null, 'success');\\n};\",\n \"tokens\": [[\"exports\", \"#79C0FF\"], [\".\", \"#C9D1D9\"], [\"handler\", \"#D2A8FF\"], \" \", [\"= function\", \"#FF7B72\"], [\"(\", \"#C9D1D9\"], [\"context\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"event\", \"#FFA657\"], [\",\", \"#C9D1D9\"], \" \", [\"callback\", \"#FFA657\"], [\") {\", \"#C9D1D9\"], \"\\n \", [\"console.\", \"#C9D1D9\"], [\"log\", \"#D2A8FF\"], [\"(event.drink);\", \"#C9D1D9\"], \"\\n \", [\"callback\", \"#D2A8FF\"], [\"(\", \"#C9D1D9\"], [\"null\", \"#79C0FF\"], [\",\", \"#C9D1D9\"], \" \", [\"'success'\", \"#A5D6FF\"], [\");\", \"#C9D1D9\"], \"\\n\", [\"};\", \"#C9D1D9\"]],\n \"annotations\": [],\n \"themeName\": \"github-dark\",\n \"style\": {\n \"color\": \"#c9d1d9\",\n \"background\": \"#0d1117\"\n }\n }\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/01b1edfee79fb7c8fec64ed3bf67558685988fa33978e67c708102fe3e5733af.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nAEiAN3/ABsfIv+VlpP/y83L/+vr6/8AxcXH/62trf/W1tX/srKy/3koGCbZDDgQAAAAAElFTkSuQmCC\",\n width: 1600,\n height: 632,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Function shown within Twilio Functions console.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"Make sure to save your Function and go back to the Function widget inside your Twilio Studio flow. Select the Service where you created the Function, select \", _jsx(_components.strong, {\n children: \"ui\"\n }), \" for the Environment, and choose the \", _jsx(_components.code, {\n children: \"barista-bot\"\n }), \" Function.\"]\n }), _jsxs(_components.p, {\n children: [\"You can also add a parameter to the request which is just a value that will be sent to the Function. Scroll down to the section for \", _jsx(_components.strong, {\n children: \"Function Parameters\"\n }), \" and create a field called \", _jsx(_components.code, {\n children: \"drink\"\n }), \". The value can then be set to the same variable we're checking in our split above: \", _jsx(_components.code, {\n children: \"{{widgets.order_prompt.inbound.Body}}\"\n }), \" (where \", _jsx(_components.code, {\n children: \"order_prompt\"\n }), \" matches the name of your initial prompt widget).\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/056c23aea72c78d16ad1b2952fa164c8c6dd076bed94302023963c8ed59ef397.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAYAAAC09K7GAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAPklEQVR4nAEzAMz/AFZWVv8YGBn/VVVV/318ff8AhouN/yMkJP9lZWX/YWJi/wBBNjn/iIWF/87Q0P+bm5v/YRcak7ey0lgAAAAASUVORK5CYII=\",\n width: 1372,\n height: 1186,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Function parameters in configuration.\",\n unoptimized: false\n }), _jsx(_components.p, {\n children: \"Once the request goes out to our barista function, we're all set! Our user will get the coffee they ordered, all from a pretty simple interaction.\"\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"human-handoff-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"human-handoff\",\n children: \"Human Handoff\"\n }), _jsxs(_components.p, {\n children: [\"But what if the user doesn't enter one of our five coffee choices? We still want to help them out. Sometimes the best solution is for the chatbot to hand things off to a human. If the user enters something that isn't on our list, let's offer to give them a phone call so the barista can get the order directly. We'll drag another \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait For Reply\"\n }), \" Widget onto the Canvas, and this time connect it to the No Condition Matches transition on our \", _jsx(_components.code, {\n children: \"split_order\"\n }), \" widget.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/e2f3fee462f7546ce24b6bccc01026beb729abdf74b88aa9cca092ff172ee5a6.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKklEQVR4nGO4ePH6f01N0/8xobH/QYCBjZP//+x5i/9PmTL9/7ZtO/4DAFdfFOE3nex3AAAAAElFTkSuQmCC\",\n width: 1600,\n height: 999,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot ask_to_call Widget added connected to No Condition Matches condition.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"For the message prompt, we'll put \\\"We want to make sure you get your coffee, even if we're not quite sure how you take it. We'll connect you to a barista directly — is now a good time to call?\\\" Another \", _jsx(_components.strong, {\n children: \"Split Based On...\"\n }), \" Widget will help us handle the user's response here — if they type \\\"Y\\\" or \\\"yes\\\" we can make the call to the barista. Let's drag the Widget onto the Canvas and select the \", _jsx(_components.code, {\n children: \"inbound.Body\"\n }), \" Liquid variable of our latest \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait For Reply\"\n }), \" as the variable to test, then create our conditions.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/0fe458f8a437ff690de197ba845fccc60bf6966b36b1c068788966c6bbaacdae.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAT0lEQVR4nAFEALv/AOzu8P9+fn//cHBy/9/g4v8A6uno/ywoJP9RU1X/7u/x/wDZ2dn/uru7/9fY2f/w9PX/AKOkp/8CBgb/W0dL/9/d3/9PrS7DfN4xpQAAAABJRU5ErkJggg==\",\n width: 1270,\n height: 1226,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot split_on_call Widget connected from ask_to_call Widget.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"make-an-outgoing-call-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"make-an-outgoing-call\",\n children: \"Make an Outgoing Call\"\n }), _jsxs(_components.p, {\n children: [\"From here, we can drag a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/make-outgoing-call\",\n children: \"Make Outgoing Call Widget\"\n })\n }), \" onto the Canvas and connect it to our 'y, yes' condition. Studio will trigger an outbound call from the Flow to the user so they can speak with a barista.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/fc473d71d01c8659e3856aeaba035cc952a1c6d693b8009ac24e1038fadb8368.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAACXBIWXMAABYlAAAWJQFJUiTwAAAAT0lEQVR4nAFEALv/ANzd3v+DhYb/mpSX/+3t7/8AztDT/1BSWv+LeH//2NXX/wDk5en/ycrL/9LV1f/y9fb/ANLV1f8EBgf/dXV2//v9/f+TkDFiuM8vYgAAAABJRU5ErkJggg==\",\n width: 1116,\n height: 1188,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Make Outgoing Call v2 Widget directed towards {{contact.channel.address}} Liquid variable.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"Once the user picks up, we'll use a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/sayplay\",\n children: \"Say/Play Widget\"\n })\n }), \" to announce that we're connecting them to the barista, and then a \", _jsx(_components.strong, {\n children: _jsx(_components.a, {\n href: \"/docs/studio/widget-library/connect-call\",\n children: \"Connect Call To Widget\"\n })\n }), \" to connect them once the message is finished playing. Drag these Widgets onto the Canvas and connect the dots.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/442cbd654322d71696015ba670223f15f58516f1e20383d21706713a0627f3fe.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAAECAYAAABLLYUHAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAP0lEQVR4nAE0AMv/AM3R0v8ZGxv/uLm5/wCbn5//Wlxd/+Di5P8AlZub/7m9u//q6+3/AN/g4f8REhP/r7Cx/2QxIhRq0wqeAAAAAElFTkSuQmCC\",\n width: 892,\n height: 1278,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Connect to Barista using Say/Play Widget and Connect Call To Widget.\",\n unoptimized: false\n })]\n }), \"\\n\", _jsxs(_components.section, {\n id: \"the-finished-product-section-indexable\",\n children: [_jsx(_components.h2, {\n id: \"the-finished-product\",\n children: \"The Finished Product\"\n }), _jsxs(_components.p, {\n children: [\"The final state of the Canvas is that we have our \", _jsx(_components.strong, {\n children: \"Trigger (Start)\"\n }), \" Widget take an incoming message, connect to a \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait For Reply\"\n }), \" Widget, then to a \", _jsx(_components.strong, {\n children: \"Split Based On…\"\n }), \" Widget, with transitions to either a Twilio Function (successful order) or another \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait For Reply\"\n }), \" (unsuccessful order). This second \", _jsx(_components.strong, {\n children: \"Send \u0026 Wait For Reply\"\n }), \" connects to a \", _jsx(_components.strong, {\n children: \"Split Based On…\"\n }), \" Widget, which ultimately leads to a \", _jsx(_components.strong, {\n children: \"Make Outgoing Call\"\n }), \" Widget that calls the user from the bot, a \", _jsx(_components.strong, {\n children: \"Say/Play\"\n }), \" Widget that announces the connection, and a \", _jsx(_components.strong, {\n children: \"Connect Call To\"\n }), \" Widget which connects the user to the barista by voice.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/376685e87f3d508fea70700eb193a86ca6b6bdcf65606edeaedd2ebcf595b2f8.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAAECAYAAACk7+45AAAACXBIWXMAABYlAAAWJQFJUiTwAAAALUlEQVR4nGMw1tb7H+Ef/J8hOzv3f31983+GwuKS/0ePHv/PEBoZ/f/s+Qv/ATJ4E2Fi0SXcAAAAAElFTkSuQmCC\",\n width: 832,\n height: 1458,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Twilio Studio Tutorial Baristabot Full Studio Flow.\",\n unoptimized: false\n }), _jsx(_components.p, {\n children: \"Once you're happy with your Flow and you've published all changes, you can connect it to a Twilio Number so people can start interacting with it.\"\n }), _jsxs(_components.p, {\n children: [\"Navigate to the \", _jsx(_components.a, {\n href: \"https://www.twilio.com/console/phone-numbers/incoming\",\n children: \"Active Numbers section of the Twilio Console\"\n }), \" and click on the number you'd like to connect to the Flow. (If you do not have any phone numbers, you can \", _jsx(_components.a, {\n href: \"https://help.twilio.com/hc/en-us/articles/223135247-How-to-Search-for-and-Buy-a-Twilio-Phone-Number-from-Console\",\n children: \"purchase one from the Console\"\n }), \".)\"]\n }), _jsx(_components.p, {\n children: \"After clicking on the number, you will see its configuration menu where you can connect the number to your Studio Flow.\"\n }), _jsxs(_components.p, {\n children: [\"To trigger a Studio Flow with an Incoming Message, scroll down to the Messaging section in the configuration menu. Under \", _jsx(_components.strong, {\n children: \"Configure with Other Handlers\"\n }), \", select the dropdown option \\\"Webhook, TwiML Bin, Function, Studio Flow, Proxy Service\\\". Then, under \", _jsx(_components.strong, {\n children: \"A Message Comes In\"\n }), \", select the dropdown option \\\"Studio Flow\\\". You'll see another dropdown menu appear where you can select the Studio Flow you'd like to connect to when a message comes in to this number.\"]\n }), _jsx(Image, {\n src: \"https://docs-assets.prod.twilio.com/be596b31cd689ac1f172f83460ba69d0ab4bd416e5faa2f63309921377f8fbbf.png\",\n blurDataURL: \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAKUlEQVR4nGNQV9f4v3nzlv/Pnj///+v37/8MHh4e/3t7e8ECr1+//g8AeuwYIcmrahAAAAAASUVORK5CYII=\",\n width: 1570,\n height: 850,\n isOpaque: true,\n placeholder: \"blur\",\n alt: \"Configure a Studio Flow to connect to a Messaging number.\",\n unoptimized: false\n }), _jsxs(_components.p, {\n children: [\"Choose the Flow you'd like to connect the number to, and then press \", _jsx(_components.strong, {\n children: \"Save\"\n }), \" to save these changes. Your Flow is now connected to your Twilio number!\"]\n }), _jsx(_components.p, {\n children: \"Congratulations! You've made a chatbot that is smart enough to route a coffee order to a barista system, or to hand off to a human if things get tricky. What other chatbots will you build next?\"\n })]\n })]\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\nfunction _missingMdxReference(id, component) {\n throw new Error(\"Expected \" + (component ? \"component\" : \"object\") + \" `\" + id + \"` to be defined: you likely forgot to import, pass, or provide it.\");\n}\n","frontmatter":{"title":"Build a Chatbot with Twilio Studio","seo_description":"Learn how to build a Chatbot with Studio, Twilio's drag-and-drop virtual workflow builder.","show_breadcrumbs":false,"page_type":"docs","headings":[{"depth":2,"value":"Prerequisites","id":"prerequisites"},{"depth":2,"value":"Create your Flow","id":"create-your-flow"},{"depth":2,"value":"Prompt the user for an order","id":"prompt-the-user-for-an-order"},{"depth":3,"value":"Add a Send \u0026 Wait for Reply Widget","id":"add-a-send--wait-for-reply-widget"},{"depth":3,"value":"Configure the Send \u0026 Wait for Reply Widget","id":"configure-the-send--wait-for-reply-widget"},{"depth":2,"value":"Split Based on Input","id":"split-based-on-input"},{"depth":3,"value":"Add and configure the Split Based On... Widget","id":"add-and-configure-the-split-based-on-widget"},{"depth":3,"value":"Add Transitions to handle customer input","id":"add-transitions-to-handle-customer-input"},{"depth":2,"value":"Triggering a Twilio Function","id":"triggering-a-twilio-function"},{"depth":3,"value":"Add and configure a Run Function Widget","id":"add-and-configure-a-run-function-widget"},{"depth":3,"value":"Build a Twilio Function","id":"build-a-twilio-function"},{"depth":2,"value":"Human Handoff","id":"human-handoff"},{"depth":2,"value":"Make an Outgoing Call","id":"make-an-outgoing-call"},{"depth":2,"value":"The Finished Product","id":"the-finished-product"}]},"scope":{}},"matter":{"title":"Build a Chatbot with Twilio Studio","seo_description":"Learn how to build a Chatbot with Studio, Twilio's drag-and-drop virtual workflow builder.","show_breadcrumbs":false,"page_type":"docs","headings":[{"depth":2,"value":"Prerequisites","id":"prerequisites"},{"depth":2,"value":"Create your Flow","id":"create-your-flow"},{"depth":2,"value":"Prompt the user for an order","id":"prompt-the-user-for-an-order"},{"depth":3,"value":"Add a Send \u0026 Wait for Reply Widget","id":"add-a-send--wait-for-reply-widget"},{"depth":3,"value":"Configure the Send \u0026 Wait for Reply Widget","id":"configure-the-send--wait-for-reply-widget"},{"depth":2,"value":"Split Based on Input","id":"split-based-on-input"},{"depth":3,"value":"Add and configure the Split Based On... Widget","id":"add-and-configure-the-split-based-on-widget"},{"depth":3,"value":"Add Transitions to handle customer input","id":"add-transitions-to-handle-customer-input"},{"depth":2,"value":"Triggering a Twilio Function","id":"triggering-a-twilio-function"},{"depth":3,"value":"Add and configure a Run Function Widget","id":"add-and-configure-a-run-function-widget"},{"depth":3,"value":"Build a Twilio Function","id":"build-a-twilio-function"},{"depth":2,"value":"Human Handoff","id":"human-handoff"},{"depth":2,"value":"Make an Outgoing Call","id":"make-an-outgoing-call"},{"depth":2,"value":"The Finished Product","id":"the-finished-product"}]},"sidebarMenu":{"name":"Twilio Studio","path":"/docs/studio","type":"file","children":[{"type":"directory","path":"","name":"Getting Started","children":[{"type":"file","name":"Product Overview","path":"/docs/studio"},{"type":"file","name":"Studio Usage Guide","path":"/docs/studio/user-guide"},{"type":"file","name":"Getting Started Guide","path":"/docs/studio/user-guide/get-started"},{"type":"file","name":"Using Subflows","path":"/docs/studio/subflows"},{"type":"file","name":"Studio FAQ","path":"/docs/studio/user-guide/studio-faq"},{"type":"file","name":"Studio Troubleshooting","path":"/docs/studio/user-guide/studio-troubleshooting"},{"type":"file","name":"Liquid Template Language","path":"/docs/studio/liquid-template-language"},{"type":"file","name":"Widget Library","path":"/docs/studio/widget-library"},{"type":"file","name":"Changelog","path":"/docs/studio/studio-changelog"}]},{"type":"directory","path":"","name":"Tutorials","children":[{"type":"file","name":"All Studio Tutorials","path":"/docs/studio/tutorials"},{"type":"file","name":"Build an IVR","path":"/docs/studio/tutorials/how-to-build-an-ivr"},{"type":"file","name":"Conduct a Survey","path":"/docs/studio/tutorials/how-to-conduct-a-survey"},{"type":"file","name":"Build a Chatbot","path":"/docs/studio/tutorials/how-to-build-a-chatbot"},{"type":"file","name":"Send Appointment Reminders","path":"/docs/studio/tutorials/how-to-send-appointment-reminders"},{"type":"file","name":"Set up an SMS Auto-Responder","path":"/docs/studio/tutorials/how-to-set-up-auto-responder"},{"type":"file","name":"Forward Calls","path":"/docs/studio/tutorials/how-to-forward-calls"},{"type":"file","name":"Post Messages to Slack","path":"/docs/studio/tutorials/how-to-post-sms-to-slack"},{"type":"file","name":"WhatsApp Customer Support Menu","path":"/docs/studio/tutorials/customer-support-menu"},{"type":"file","name":"Using the Twilio Conversations Integration","path":"/docs/studio/tutorials/using-conversations-with-studio"}]},{"type":"directory","path":"","name":"Widgets","children":[{"type":"file","name":"Trigger (Start) Widget","path":"/docs/studio/widget-library/trigger-start"},{"type":"file","name":"Send \u0026 Wait For Reply Widget","path":"/docs/studio/widget-library/send-wait-reply"},{"type":"file","name":"Split Based On... Widget","path":"/docs/studio/widget-library/split-based-on"},{"type":"file","name":"Send Message Widget","path":"/docs/studio/widget-library/send-message"},{"type":"file","name":"Say/Play Widget","path":"/docs/studio/widget-library/sayplay"},{"type":"file","name":"Gather Input On Call Widget","path":"/docs/studio/widget-library/gather-input-call"},{"type":"file","name":"Run Function Widget","path":"/docs/studio/widget-library/run-function"},{"type":"file","name":"Run Subflow","path":"/docs/studio/widget-library/run-subflow"},{"type":"file","name":"Make Outgoing Call Widget","path":"/docs/studio/widget-library/make-outgoing-call"},{"type":"file","name":"Connect Call To Widget","path":"/docs/studio/widget-library/connect-call"},{"type":"file","name":"Make HTTP Request Widget","path":"/docs/studio/widget-library/http-request"},{"type":"file","name":"Record Voicemail Widget","path":"/docs/studio/widget-library/record-voicemail"},{"type":"file","name":"Enqueue Call","path":"/docs/studio/widget-library/enqueue-call"},{"type":"file","name":"Send to Flex Widget","path":"/docs/studio/widget-library/send-flex"},{"type":"file","name":"Capture Payments","path":"/docs/studio/widget-library/capture-payments"},{"type":"file","name":"Set Variables Widget","path":"/docs/studio/widget-library/set-variables"},{"type":"file","name":"Fork Stream","path":"/docs/studio/widget-library/fork-stream"},{"type":"file","name":"Call Recording","path":"/docs/studio/widget-library/call-recording"},{"type":"file","name":"TwiML Redirect Widget","path":"/docs/studio/widget-library/twiml-redirect"},{"type":"file","name":"Connect Virtual Agent","path":"/docs/studio/widget-library/connect-virtual-agent"},{"type":"file","name":"Connect Virtual Agent for Flex (Public Beta)","path":"/docs/studio/widget-library/connect-virtual-agent-flex"},{"type":"file","name":"Search for a Profile (Public Beta)","path":"/docs/studio/widget-library/search-for-a-profile"}]},{"type":"directory","path":"","name":"REST API v2","children":[{"type":"file","name":"Overview","path":"/docs/studio/rest-api/v2"},{"type":"file","name":"Quickstart","path":"/docs/studio/rest-api/v2/studio-flows-api-quickstart"},{"type":"file","name":"Flow","path":"/docs/studio/rest-api/v2/flow"},{"type":"file","name":"Flow Revision","path":"/docs/studio/rest-api/v2/flow-revision"},{"type":"file","name":"Flow Validate","path":"/docs/studio/rest-api/v2/flow-validate"},{"type":"file","name":"Test User","path":"/docs/studio/rest-api/v2/test-user"},{"type":"file","name":"Execution","path":"/docs/studio/rest-api/v2/execution"},{"type":"file","name":"Execution Context","path":"/docs/studio/rest-api/v2/execution-context"},{"type":"file","name":"Step","path":"/docs/studio/rest-api/v2/step"},{"type":"file","name":"Step Context","path":"/docs/studio/rest-api/v2/step-context"}]},{"type":"directory","path":"","name":"Rest API v1","children":[{"type":"file","name":"Overview","path":"/docs/studio/rest-api"},{"type":"file","name":"Flow","path":"/docs/studio/rest-api/flow"},{"type":"file","name":"Execution Resource","path":"/docs/studio/rest-api/execution"},{"type":"file","name":"Execution Context","path":"/docs/studio/rest-api/execution-context"},{"type":"file","name":"Step","path":"/docs/studio/rest-api/step"},{"type":"file","name":"Step Context","path":"/docs/studio/rest-api/step-context"}]}]},"editUrl":"https://github.com/twilio-internal/docs/blob/main/docs/studio/tutorials/how-to-build-a-chatbot.mdx"},"__N_SSG":true},"page":"/docs/[...path]","query":{"path":["studio","tutorials","how-to-build-a-chatbot"]},"buildId":"nWtU_5WJsvLGK2x62E_3J","isFallback":false,"gsp":true,"scriptLoader":[]}</script></body></html>