{"id":44708,"date":"2022-09-15T12:48:13","date_gmt":"2022-09-15T11:48:13","guid":{"rendered":"https:\/\/developer.kore.ai\/v10-1\/?p=44708"},"modified":"2023-02-09T14:05:07","modified_gmt":"2023-02-09T14:05:07","slug":"mock-scenes","status":"publish","type":"post","link":"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/bot-builder-tool\/bot-creation\/mock-scenes\/","title":{"rendered":"Mock Scenes"},"content":{"rendered":"<section class=\"l-section wpb_row height_auto\"><div class=\"l-section-h i-cf\"><div class=\"g-cols vc_row type_default valign_top\"><div class=\"vc_col-sm-12 wpb_column vc_column_container\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"ult-spacer spacer-6ae865be1b4f7\" data-id=\"6ae865be1b4f7\" data-height=\"10\" data-height-mobile=\"10\" data-height-tab=\"10\" data-height-tab-portrait=\"\" data-height-mobile-landscape=\"\" style=\"clear:both;display:block;\"><\/div>\r\n\t<div class=\"wpb_text_column \">\r\n\t\t<div class=\"wpb_wrapper\">\r\n\t\t\t<p><span style=\"font-weight: 400\">Mock Scenes are part of the <\/span><a href=\"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/bot-builder-tool\/bot-creation\/storyboard\/\"><span style=\"font-weight: 400\">Storyboard<\/span><\/a><span style=\"font-weight: 400\"> and are a feature through which you can simulate a conversation between a user and your Virtual Assistant, using the Conversation Designer.<\/span><\/p>\n<p><span style=\"font-weight: 400\">Conversations that are designed using Mock Scenes can then be implemented into Dialog Tasks, which the VA can work with when interacting with users.<\/span><\/p>\n<p><span style=\"font-weight: 400\">In this article, you will learn how to work with this feature in order to prototype a conversation.<\/span><\/p>\n<h1><span class=\"ez-toc-section\" id=\"Benefits\"><span style=\"font-weight: 400\">Benefits<\/span><\/span><\/h1>\n<p><span style=\"font-weight: 400\">Mock Scenes are specifically created for conversation designers to prototype bot-user interactions before the conversation moves to the development stage. The Conversation Designer in use within this feature is specifically adapted to allow designers to focus on the conversation flow itself, without worrying about the systems and logic building side of the Virtual Assistant.<\/span><\/p>\n<h1><span class=\"ez-toc-section\" id=\"Major_Features\"><span style=\"font-weight: 400\">Major Features<\/span><\/span><\/h1>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Create a conversation exchange prototype, between the assistant and the user, based on natural language, that can follow different paths, depending on the responses that each participant provides..<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Collaborate during the prototyping process, using notes and comments.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Map important points in the conversation, using a timeline based on<\/span><span style=\"font-weight: 400\"> predefined hashtags or custom tags.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Link to existing messages or to other scenes.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Preview the conversation prototype in a customizable, shareable ad collaborative view,<\/span><\/li>\n<\/ul>\n<h1><span class=\"ez-toc-section\" id=\"Mock_Scene_Options\"><span style=\"font-weight: 400\">Mock Scene Options<\/span><\/span><\/h1>\n<p><span style=\"font-weight: 400\">The Mock Scenes area allows you to perform the following actions:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Import<\/strong><span style=\"font-weight: 400\"> an existing scene in a CSV format.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Sort <\/strong><span style=\"font-weight: 400\">scenes based on any column.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Search<\/strong><span style=\"font-weight: 400\"> for a scene by name.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">When hovering over each scene, you have an option to:<\/span><\/li>\n<ul>\n<li style=\"font-weight: 400\"><strong>Share<\/strong><span style=\"font-weight: 400\"> the scene with other users or teams.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Clone <\/strong><span style=\"font-weight: 400\">the scene to create a copy.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Export<\/strong><span style=\"font-weight: 400\"> the scene into CSV format.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Delete<\/strong><span style=\"font-weight: 400\"> the scene.<\/span><\/li>\n<\/ul>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105154\/mock-scene-options.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105154\/mock-scene-options.png\" alt=\"\" width=\"622\" height=\"256\" class=\"alignnone size-full wp-image-44647\"><\/a><\/p>\n<h1><span class=\"ez-toc-section\" id=\"Create_a_Mock_Scene\"><span style=\"font-weight: 400\">Create a Mock Scene<\/span><\/span><\/h1>\n<p><span style=\"font-weight: 400\">To create a Mock Scene, please follow the steps below:<\/span><\/p>\n<ol>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">On the Storyboard page, select the <\/span><strong>Mock Scenes<\/strong> <span style=\"font-weight: 400\">tab and click <\/span><strong>Create Scene. <\/strong><span style=\"font-weight: 400\">If there are no existing scenes, this button is at the bottom of the screen, otherwise it is located at the top right.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">On the <\/span><em><span style=\"font-weight: 400\">New Scene<\/span><\/em><span style=\"font-weight: 400\"> dialog box that opens up, enter a name in the <\/span><strong>Scene Name <\/strong><span style=\"font-weight: 400\">field and a description in the <\/span><strong>Description <\/strong><span style=\"font-weight: 400\">field.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Enter a <\/span><strong>Status<\/strong><span style=\"font-weight: 400\">.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Click <\/span><strong>Proceed<\/strong><span style=\"font-weight: 400\">.<\/span><\/li>\n<\/ol>\n<p><span style=\"font-weight: 400\">The demo below shows you the basics of creating a new Mock Scene.<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105448\/new-mock-scene.gif\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105448\/new-mock-scene.gif\" alt=\"\" width=\"606\" height=\"248\" class=\"alignnone size-full wp-image-44650\"><\/a><\/p>\n<h1><span class=\"ez-toc-section\" id=\"Work_with_the_Conversation_Designer\"><span style=\"font-weight: 400\">Work with the Conversation Designer<\/span><\/span><\/h1>\n<p><span style=\"font-weight: 400\">After you add a scene to your Storyboard, you are presented with a blank <\/span><strong>Conversation View<\/strong><span style=\"font-weight: 400\">, where you can enter the user-VA messages. This is, essentially, an adapted version of the Conversation Designer, which is used to create Dialog Tasks. Even though the look is similar, you will notice that Mock Scenes provide options that are specifically focused on developing the conversation itself, without the business logic or training. This helps create a more seamless user experience and provides VA developers with a starting point for their work.&nbsp;<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105516\/blank-scene.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105516\/blank-scene.png\" alt=\"\" width=\"622\" height=\"256\" class=\"alignnone size-full wp-image-44653\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">To design a mock conversation scene, you can add <\/span><em><span style=\"font-weight: 400\">Bot <\/span><\/em><span style=\"font-weight: 400\">and <\/span><em><span style=\"font-weight: 400\">User <\/span><\/em><span style=\"font-weight: 400\">utterances, create conversation paths,link messages and scenes, add developer notes and collaborate using comments. You can also create a conversation timeline, using tags.&nbsp;<\/span><\/p>\n<p><span style=\"font-weight: 400\">The Conversation Designer comes with the following features to help you design the conversation:<\/span><\/p>\n<h2><span class=\"ez-toc-section\" id=\"User_and_Bot_Message_Tabs\"><span style=\"font-weight: 400\">User and Bot Message Tabs<\/span><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"User_Tab\"><span style=\"font-weight: 400\">User Tab<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">This tab is used to enter possible messages from users either requesting information or providing input to a request by the virtual assistant. These messages can be:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Plain text messages<\/strong><span style=\"font-weight: 400\">. For example, in a Travel VA, <\/span><em><span style=\"font-weight: 400\">I want to know when check in opens for my flight.<\/span><\/em><\/li>\n<li style=\"font-weight: 400\"><strong>Attachments<\/strong><span style=\"font-weight: 400\">. For example, in a Travel VA, to upload a flight reservation..<\/span><\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Bot_Tab\"><span style=\"font-weight: 400\">Bot Tab<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">This tab is used to design messages that the Virtual Assistant sends to users as a greeting, information, answer to a user query, or request for input. These messages can be:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Plain text messages<\/strong><span style=\"font-weight: 400\"> with options to mark text as bold, italic, indent, multi-line, and lists \u2013 ordered and unordered.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Rich messages<\/strong><span style=\"font-weight: 400\"> using predefined templates such as buttons, list, quick reply, etc,. (<a href=\"https:\/\/developer.kore.ai\/v10-1\/docs\/bots\/bot-builder-tool\/bot-creation\/mock-scenes\/#Bot_Messages_Templates\" rel=\"noopener noreferrer\">see below<\/a> for a list of supported templates).<\/span><\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105705\/bot-message-templates.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105705\/bot-message-templates.png\" alt=\"\" width=\"400\" height=\"300\" class=\"alignnone size-full wp-image-44656\"><\/a><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Notes<\/strong><span style=\"font-weight: 400\">: These are used to add text between messages describing an action or a section of the conversation.<\/span><span style=\"font-weight: 400\"><br \/>\n<\/span><\/li>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105803\/scene-notes.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105803\/scene-notes.png\" alt=\"\" width=\"497\" height=\"271\" class=\"alignnone size-full wp-image-44659\" srcset=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105803\/scene-notes.png 497w, https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915105803\/scene-notes-300x164.png 300w\" sizes=\"auto, (max-width: 497px) 100vw, 497px\" \/><\/a><\/p>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Notes also provide an option to define the timeline of the conversation by using <\/span><em><span style=\"font-weight: 400\">hashtags<\/span><\/em><span style=\"font-weight: 400\">. Thus, defined notes help denote an important state in the conversation that is displayed on the left of the conversation under the <\/span><strong>Story Timeline<\/strong><span style=\"font-weight: 400\">. You can move to the relevant place in the conversation by clicking the tag on the timeline.You can define your own <\/span><em><span style=\"font-weight: 400\">custom tags<\/span><\/em><span style=\"font-weight: 400\"> or use one of the <\/span><em><span style=\"font-weight: 400\">predefined tags<\/span><\/em><span style=\"font-weight: 400\">. Each of these predefined tags is depicted by a unique symbol in the timeline indicating its purpose. These predefined tags include:<br \/>\n<span style=\"color: #808080\"><em>&#8211; #Start_&lt;intent-name&gt;<\/em><\/span><br \/>\n<\/span><span style=\"color: #808080\"><em>&#8211; #Hold_&lt;intent-name&gt;<\/em><\/span><br \/>\n<span style=\"color: #808080\"><em>&#8211; #End_&lt;intent-name&gt;<\/em><\/span><br \/>\n<span style=\"color: #808080\"><em>&#8211; #Resume_&lt;intent-name&gt;.<\/em><\/span><\/li>\n<\/ul>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">With the <\/span><em><span style=\"font-weight: 400\">tag <\/span><\/em><span style=\"font-weight: 400\">option, you can <\/span><strong>classify notes <\/strong><span style=\"font-weight: 400\">using an existing tag or by creating a new custom tag. These tags are color-coded for reference.<\/span><span style=\"font-weight: 400\"><br \/>\n<\/span><\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110541\/create-custom-tag.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110541\/create-custom-tag.png\" alt=\"\" width=\"714\" height=\"66\" class=\"alignnone size-full wp-image-44662\"><\/a><\/p>\n<ul>\n<li><strong>Paths<\/strong><span style=\"font-weight: 400\">: Paths are different flows that the conversations might follow, based on the options provided by the VA or the user. For example, a Virtual Assistant expects a <\/span><em><span style=\"font-weight: 400\">yes<\/span><\/em><span style=\"font-weight: 400\"> or <\/span><em><span style=\"font-weight: 400\">no<\/span><\/em><span style=\"font-weight: 400\"> response from the user, and the path differs based upon the user response. Using the bot message, the template defines the number of alternate paths allowed. The business logic can also decide the number of paths.<\/span><\/li>\n<li style=\"list-style-type: none\">\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">To continue the scene along a specific path, you can select the path either using the <\/span><strong>Previous Path<\/strong><span style=\"font-weight: 400\"> (<\/span><strong>&lt;-<\/strong><span style=\"font-weight: 400\">) and <\/span><strong>Next Path<\/strong><span style=\"font-weight: 400\"> (<\/span><strong>-&gt;<\/strong><span style=\"font-weight: 400\">) or select the options given to the user. You can also add additional paths using the <\/span><strong>New Path<\/strong><span style=\"font-weight: 400\"> (<\/span><strong>+<\/strong><span style=\"font-weight: 400\">) option.<\/span><span style=\"font-weight: 400\"><br \/>\n<\/span><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110815\/scene-conv-path.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110815\/scene-conv-path.png\" alt=\"\" width=\"399\" height=\"125\" class=\"alignnone size-full wp-image-44665\"><\/a><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Message_Options\"><span style=\"font-weight: 400\">Message Options<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400\">When you hover over a message you can find the following options:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Add <\/span><strong>New Path,<\/strong><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Add <\/span><strong>Comments,<\/strong><\/li>\n<li style=\"font-weight: 400\"><strong>Delete <\/strong><span style=\"font-weight: 400\">a message,<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Link a Message<\/strong><span style=\"font-weight: 400\">: You can use this option to link another message in this scene and continue a flow that is already designed. When selected, this option transitions to the Flow view from where you can select the message node, and link it to the current node.<\/span><span style=\"font-weight: 400\"><br \/>\n<\/span><strong><em>Note<\/em><\/strong><em><span style=\"font-weight: 400\">: This option is available only for the leaf nodes with no flow defined.<\/span><\/em><\/li>\n<li style=\"font-weight: 400\"><strong>Link a Scene<\/strong><span style=\"font-weight: 400\">: You can use this option to link a predefined scene in the Storyboard. This scene is invoked during the preview. When selected, this option gives a list of scenes for you to select from and link it to the current node. You can also perform the following&nbsp; actions:<\/span><\/li>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">View Scene: Click <\/span><strong>View Scene<\/strong><span style=\"font-weight: 400\"> to open in a read-only window.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Unlink: Click <\/span><strong>Unlink<\/strong><span style=\"font-weight: 400\"> to unlink the scene.<\/span><\/li>\n<\/ul>\n<li style=\"font-weight: 400\"><strong>Edit<\/strong><span style=\"font-weight: 400\">: Allows you to edit the message.<\/span><\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110916\/scene-message-options.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915110916\/scene-message-options.png\" alt=\"\" width=\"257\" height=\"195\" class=\"alignnone size-full wp-image-44668\"><\/a><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Comments\"><span style=\"font-weight: 400\">Comments<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400\">Comments are a very useful collaborative tool. The Storyboard Scenes area allows users to add comments to any component of the scene, such as user messages, VA messages, and notes. You can also reply to an existing comment thus maintaining a comments thread.<\/span><\/p>\n<p><span style=\"font-weight: 400\">To add a comment, click the <\/span><strong>message options<\/strong><span style=\"font-weight: 400\"> icon, then select <\/span><strong>Comment<\/strong><span style=\"font-weight: 400\">.&nbsp;<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111022\/scene-add-comment.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111022\/scene-add-comment.png\" alt=\"\" width=\"259\" height=\"219\" class=\"alignnone size-full wp-image-44671\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">When a message has a comment attached, you will see a comment icon next to it, as shown below.<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111046\/scene-marked-comment-on-message.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111046\/scene-marked-comment-on-message.png\" alt=\"\" width=\"251\" height=\"288\" class=\"alignnone size-full wp-image-44674\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">You can access the full comment history using the comments icon at the scene level. This section provides the following options:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Search <\/strong><span style=\"font-weight: 400\">through existing comments.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>View <\/strong><span style=\"font-weight: 400\">existing comments.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Star <\/strong><span style=\"font-weight: 400\">a comment and <\/span><strong>filter by starred<\/strong><span style=\"font-weight: 400\"> comments.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Delete <\/strong><span style=\"font-weight: 400\">any comments you have made.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Reply <\/strong><span style=\"font-weight: 400\">to comments.<\/span><\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111123\/scene-comment-history.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915111123\/scene-comment-history.png\" alt=\"\" width=\"295\" height=\"757\" class=\"alignnone size-full wp-image-44677\"><\/a><\/p>\n<h2><span class=\"ez-toc-section\" id=\"Scene_Options\"><span style=\"font-weight: 400\">Scene Options<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400\">From the Scene page, you can perform the following actions:<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915121310\/scene-options.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915121310\/scene-options.png\" alt=\"\" width=\"452\" height=\"289\" class=\"alignnone size-full wp-image-44681\"><\/a><\/p>\n<ul>\n<li style=\"font-weight: 400\"><strong>Preview<\/strong><span style=\"font-weight: 400\">: It is used to see how the conversation flows on your website. This opens in a mock website with the chat window. You can <\/span><strong>Play\/Pause<\/strong><span style=\"font-weight: 400\">, <\/span><strong>Restart<\/strong><span style=\"font-weight: 400\">, <\/span><strong>Customize,<\/strong><span style=\"font-weight: 400\"> and <\/span><strong>Exit<\/strong><span style=\"font-weight: 400\"> the preview. <\/span><span style=\"font-weight: 400\"><br \/>\n<\/span><\/li>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122509\/scene-preview-1.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122509\/scene-preview-1.png\" alt=\"\" width=\"475\" height=\"363\" class=\"alignnone size-full wp-image-44693\"><\/a><\/p>\n<li style=\"font-weight: 400\"><strong>Share<\/strong><span style=\"font-weight: 400\">: This option gives you a URL that you can share with others. This URL presents the scene preview, so you can provide the various stakeholders with a glimpse of what to expect and take their feedback. You can secure the scene preview URL with a password.<\/span><\/li>\n<\/ul>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915121754\/share-scene.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915121754\/share-scene.png\" alt=\"\" width=\"396\" height=\"224\" class=\"alignnone size-full wp-image-44687\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">The shared link allows the viewer to add comments that are communicated back to the developer for further action.<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122424\/scene-comment-button.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122424\/scene-comment-button.png\" alt=\"\" width=\"454\" height=\"232\" class=\"alignnone size-full wp-image-44690\"><\/a><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Click the <\/span><strong>More<\/strong><span style=\"font-weight: 400\"> icon to perform the actions listed below. Most of these actions are also available on the Storyboard page.<\/span><\/li>\n<ul>\n<li style=\"font-weight: 400\"><strong>Edit<\/strong><span style=\"font-weight: 400\">: Edit the name, description, and status of the scene.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Clone<\/strong><span style=\"font-weight: 400\">: Clone the scene to create a copy.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Export<\/strong><span style=\"font-weight: 400\">: Export the scene into CSV format.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Import<\/strong><span style=\"font-weight: 400\">: Import an existing scene in CSV format. The Import fails if the scene that you want to import has linked scenes which are not present in the current VA.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Delete<\/strong><span style=\"font-weight: 400\">: Delete the scene. Unlink all linked scenes before deleting it.<\/span><\/li>\n<li style=\"font-weight: 400\"><strong>Version History<\/strong><\/li>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">A list of the most recent 20 changes made to a scene. A version is automatically created whenever the following changes are made.<br \/>\n<\/span>&#8211; Message Added<br \/>\n&#8211; Message Edited (included edits to templates)<br \/>\n&#8211; Message Removed<br \/>\n&#8211; Message Reordered<br \/>\n&#8211; Scene Restored<br \/>\n&#8211; Note Added<br \/>\n&#8211; Note Modified<br \/>\n&#8211; Note Removed<br \/>\n&#8211; Linked to a Message<br \/>\n&#8211; Linked to a Scene<\/li>\n<\/ul>\n<\/ul>\n<\/ul>\n<ul>\n<li style=\"list-style-type: none\">\n<ul>\n<li style=\"list-style-type: none\">\n<ul>\n<li><span style=\"font-weight: 400\">An option to restore to any of those versions.<\/span><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h2><span class=\"ez-toc-section\" id=\"Preview_Customization\"><span style=\"font-weight: 400\">Preview Customization<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400\">The conversation Preview area provides a Customize option, which allows you to personalize the look and feel of your preview, in accordance with your website and brand.<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122704\/customize-preview.gif\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915122704\/customize-preview.gif\" alt=\"\" width=\"606\" height=\"248\" class=\"alignnone size-full wp-image-44697\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">This feature allows you to use one of the default themes, with either a Light or Dark background, or to create your own theme, save it, and use it across the scenes in your storyboard. There are four aspects of the conversation widget that you can customize:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Background Image<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Overall Chat Widget<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">User Message Bubbles \u2013 text and background colors.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Bot Message Bubbles \u2013 text and background colors for various components.<\/span><\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"Background_Image\"><span style=\"font-weight: 400\">Background Image<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">The background image that is displayed on the mock website where the conversation widget is previewed can be customized. You need to provide a valid URL with the location of the image.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Chat_Widget\"><span style=\"font-weight: 400\">Chat Widget<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">This option will let you customize the entire chat widget. This includes:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Widget background-color<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Widget text color<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Widget border-color<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Widget divider color<\/span><\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"User_Messages\"><span style=\"font-weight: 400\">User Messages<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">This option is used to customize the color of the user message bubble and text.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Bot_Messages_Templates\"><span style=\"font-weight: 400\">Bot Messages &amp; Templates<\/span><\/span><\/h3>\n<p><span style=\"font-weight: 400\">This option is used to customize the color of the Virtual Assistant message bubble and text. You can also customize the button template messages if any are used.<\/span><\/p>\n<h4><span style=\"font-weight: 400\">Message Templates<\/span><\/h4>\n<table>\n<tbody>\n<tr>\n<th><strong>Template Type<\/strong><\/th>\n<th><strong>Template Definition<\/strong><\/th>\n<th><strong>Comments<\/strong><\/th>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">Carousel<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Carousels: For each Carousel:<\/span><\/li>\n<\/ul>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Image<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Header<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Description<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Buttons<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Maximum of five carousels per template.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Maximum of three buttons per carousel.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">The image denotes the URL where the image is hosted.<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">Buttons<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Message<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Buttons<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Maximum of three buttons.<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">List<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">List Items<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">An optional Primary button<\/span><\/li>\n<\/ul>\n<p><span style=\"font-weight: 400\">For each List Item:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Header<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Description<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Image<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Button<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Maximum of four list items per template.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">One button per list item.<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">Quick Reply<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Text<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Buttons<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Button Images<\/span><\/li>\n<\/ul>\n<\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Maximum of 10 buttons.<\/span><\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">Attachment<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Attachment URL<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Text<\/span><\/li>\n<\/ul>\n<\/td>\n<td>&nbsp;<\/td>\n<\/tr>\n<tr>\n<td><span style=\"font-weight: 400\">Image<\/span><\/td>\n<td>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Image Template URL<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">Image Title \u2013 optional<\/span><\/li>\n<\/ul>\n<\/td>\n<td>&nbsp;<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2><span class=\"ez-toc-section\" id=\"Flow_View\"><span style=\"font-weight: 400\">Flow View<\/span><\/span><\/h2>\n<p><span style=\"font-weight: 400\">After you design, switch to the <\/span><strong>Flow<\/strong> <strong>View<\/strong><span style=\"font-weight: 400\"> to see the scene in a flowchart.<\/span><\/p>\n<p><a ref=\"magnificPopup\" href=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915123255\/flow-view.png\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kore-wordpress.s3.us-east-2.amazonaws.com\/developer.kore.ai\/v10-1\/wp-content\/uploads\/sites\/35\/20220915123255\/flow-view.png\" alt=\"\" width=\"663\" height=\"241\" class=\"alignnone size-full wp-image-44701\"><\/a><\/p>\n<p><span style=\"font-weight: 400\">All the Scene Options mentioned in the previous section are available with the following exceptions:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">You cannot import a scene from the flow.<\/span><\/li>\n<li style=\"font-weight: 400\"><span style=\"font-weight: 400\">You can Export results in a PDF document.<\/span><\/li>\n<\/ul>\n\r\n\t\t<\/div>\r\n\t<\/div>\r\n<div class=\"ult-spacer spacer-6ae865be1c83e\" data-id=\"6ae865be1c83e\" data-height=\"14\" data-height-mobile=\"14\" data-height-tab=\"14\" data-height-tab-portrait=\"\" data-height-mobile-landscape=\"\" style=\"clear:both;display:block;\"><\/div><\/div><\/div><\/div><\/div><\/div><\/section>\n","protected":false},"excerpt":{"rendered":"Mock Scenes are part of the Storyboard and are a feature through which you can simulate a conversation between a user and your Virtual Assistant, using the Conversation Designer. Conversations that are designed using Mock Scenes can then be implemented into Dialog Tasks, which the VA can work with when interacting with users. In this...","protected":false},"author":27,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[66],"tags":[],"class_list":["post-44708","post","type-post","status-publish","format-standard","hentry","category-bot-creation"],"_links":{"self":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/44708","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/users\/27"}],"replies":[{"embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/comments?post=44708"}],"version-history":[{"count":8,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/44708\/revisions"}],"predecessor-version":[{"id":54025,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/posts\/44708\/revisions\/54025"}],"wp:attachment":[{"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/media?parent=44708"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/categories?post=44708"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/developer.kore.ai\/v10-1\/wp-json\/wp\/v2\/tags?post=44708"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}