Using Topics, Components, and Templates for Common, Duplicated Flows

In traditional flowchart-based conversational design, copying and pasting different components and sections of the flowchart was often the go-to approach for reusing and repurposing existing elements. This can include common workflows such as

• third-party service authentication flows
• support ticket creation and submissions
• credit card payment systems

A common problem with duplicating flows throughout a conversation design flowchart is that if the flow were to be modified, all copied instances of the flow would have to be manually updated in the flowchart. 

By using Voiceflow's reusable topics, block templates and components, conversation designers can quickly scale their assistant design efforts and ensure parity across all instances of a flow in an assistant. Let's take a look at the differences between the three features: 

Topics

Topics are an organizational feature, much like a folder system, that breaks apart one singular complex flowchart into multiple pages, with explicit relationships in-between that define the navigational logic of the assistant between multiple topics. 

To decide how to break up your assistant flowchart into multiple topics, there are a few different approaches

• Maybe your flowchart already consists of multiple smaller flows, so you can start with recreating each flow in their respective topics on the Voiceflow canvas. 
• If your assistant has definitive core functions, you can organize your design such that each topic corresponds to a function of your assistant, much like the above example in the image.
• You can also use topics as a brainstorming space or version history records, by dedicating topics to separate older and newer designs.

Once you have created multiple topics in your assistant, you can use go-to actions and intents at the end of any step within a topic to navigate to another topic in the design. Learn more about the connections between topics here. 

Once you get a better hang of using topics, you can take a look at Voiceflow's best practices when it comes to organizing your assistant designs.

Components

Components are another way of repeating the same flow throughout an assistant design, and very often, topics and components are used interchangeably due to their visual similarity. 

However, components have several important differences that speak to its distinct function:

• Unlike topics, a component's flow should only ever start from the "Continue" step. Whereas topics can start from an intent step or any other block, components are meant to be duplicated flows used throughout an assistant as a component block. That means that a component will always exist as part of a topic. 
  
• Likewise, the end of the component's flow should connect to the block following the component, and should not use go-to actions to jump from within the topic to another. 

Components may resemble subtopics in that they involve a nested set of blocks. The key difference between components and subtopics in a topic is that components should be considered as global across all topics, whereas subtopics belong under their parent topic. 

Block Templates

Block templates differ from topics and components in that they are not meant to be perfectly replicable sets of steps to reuse; rather, true to their name, block templates are a predefined sequence of steps that are copied from the original but do not follow the changes made to the original. Essentially, they're shortcuts for copying and pasting multiple blocks at once. 

They are useful for copying the same set of steps over and over again throughout an assistant canvas, with the caveat that each copy of the template can be individually changed without affecting any other instances. The above example shows a multi-step "Question" template that consists of two text steps followed by a multiple-choice button step; every copy of the "Question" template will have those three steps, and the values of those steps can be changed per question.