Product Release

The ultimate guide to #VFV2: what's new with Voiceflow?

Sam Burns
|
February 22, 2021

Voiceflow V2: The Ultimate Guide to What's New

The team began architecting and planning Voiceflow V2 just over a year ago. In the same way that companies document and design for mobile and web in a single cloud platform like Adobe or Figma, we set out to create an equally powerful tool for conversational AI across the growing number of conversational channels.

Channels available on Voiceflow

From indie developers and designers to Fortune 500 leaders, more than 1,000 Flowsters from around the world joined us for the V2 launch.

Spanning the design, prototype, and development experiences, Voiceflow V2 makes significant strides towards solving core challenges across the conversation design workflow.

In short, we are:

  • helping designers centralize their documents, flows, and information all in one spot
  • helping teams better train and test their projects through more advanced prototyping features
  • giving developers & their team's the flexibility to chose their underlying runtime tech stack or eventually plug directly into technologies like RASA, DialogFlow, and other NLP/NLU platforms
  • and, continuing to support the growth of our no-code/low code creators, with Voiceflow V2 laying the foundation for us to add more deployable channels without ever writing a single line of code

Here's the ultimate guide to what you might have missed at the V2 launch.

Design & Collaboration Experience

As a visual collaboration tool for building conversational experiences, Voiceflow makes it easy for teams of designers and developers to work together.

When you design an experience in Voiceflow, it's built with real-code under the hood. This allows for teams to work faster than ever before as designers can pass off high fidelity prototypes, files, and even ready codebase to development - all generated without writing a single line of code.

Voiceflow V2 makes this design and collaboration experience even better with a series of key features.

Example of mobile visuals used in the design canvas
  • Flows and reusable components: As conversations become more complex, it's important to break a design into re-usable parts for quick and organized work. Our "Flows" make accessing and reusing a function incredibly easy (i.e. the payments feature in a conversational experience for a pizzeria).
  • Automated dialogues: It's rare for a conversation to go well on the first try, and this is especially true when looking to collect information. Great conversational experiences allow a customer to share all required information in any way they choose. This makes designing a bit challenging, but Voiceflow's automated dialogues can help. Once entities are created, they can be declared as "required" meaning the assistant will automatically ask the user for that entity if it wasn't provided. Customers can provide everything needed in a single go or nothing at all - and it's all covered by the design.
  • Canvas markup: As conversation designers, one of the biggest challenges is effectively communicating work. Whether it's with other designers, the development team, or stakeholders, it can take months to teach a flowchart design system. Voiceflow makes readability and design documentation easier with canvas markup. Designers can add labels, images, and even hyperlinks directly to a design to make it more readable, sharable, and actually enjoyable to look at. Most of all, designs are always accessible and up to date.
  • Designing context: Designing for context is one of the pillars of conversation design. We have the most advanced context design tooling of any platform because we split up context design into 4 main areas (and a banking industry example to help illustrate each one).
  • Dialog context: We can layer our dialogs to be contextual to the current state of the conversation. At Voiceflow Bank, for example, if the user asks for help in our 'Home' intent, we'll give them a general help message. But, if the user asks for help when in our 'Payment' intent, we'll give them help that's contextual to payments.
  • Context switching: No one likes rigid, linear conversations. Voiceflow allows for both open and closed dialogs, which makes context switching possible. In the banking experience, if a user is checking an account balance they can quickly switch to another top-level intent (i.e. transfer funds) that the designer has made available to the user at all times. Switching context is part of natural conversations.
  • Nested contexts: Once a user has achieved their goal in one context, they should be able to return to the previous context where they left off. Nested contexts in Voiceflow allow for that natural flow. Back to Voiceflow Bank, the user should be able to ask for the nearest branch location at any time. Then, they'll be able to come right back to where they were previously in the conversation (i.e. checking an account balance).
  • Situational context: It's important to design contextual experiences based on the customer's unique situation, such as the day of the week, whether it's the customer's first or second session, or the user's language preferences. This is possible in Voiceflow using conditions and logic to create conditional flows within a conversation. A customer of Voiceflow bank that uses the conversation experience every day for banking does not want to hear the same welcome message or menu options that a newcomer will need.
  • Shared workspaces: Voiceflow's shared workspaces allow any team to manage their workflow with a built-in kanban system to see an at-a-glance status of all projects. Inviting stakeholders or clients directly to a workspace makes it easy for viewing and commenting. Users can even build an internal component system or template library to manage design consistency across all of their projects. For larger organizations, users can manage multiple team workspaces to ensure no one workspace becomes too crowded.
  • Exporting: Built to be shareable, Voiceflow projects can also be exported in 3 ways:
  • PNG or PDF: When paired with markup, this static option gives stakeholders a high-level view of a conversation design.
  • .VF file: This file export allows designers to save and download a project. The development team can pull any information they want from the .VF file as the JSON structure contains the entire design in code.
  • Other formats: The interaction model which houses all of a project's intents, slots and variables can be exported in several formats, including exports for DialogFlow, Microsoft Luis, or IBM Watson. Even better, the .VF file can be used to create a conversion for any conversational platform - and we'll have more native export options coming in the next few months, including RASA.
Increased options for export and channel support

Prototyping Experience

Prototyping is an extension of a design. This is the phase in a project's workflow where designers and teams bring their conversations to life, and are able to test, learn and iterate on their original ideas before they're launched or move into development.

Our platform helps you design as close to parity as possible, whether that is for Alexa, Google Assistant, IVR, Chat or Custom Assistants. Each step on the canvas represents real code – code that allows anyone, whether its the designer themselves, a teammate, or a user to experience prototypes as though they were the live product.

Prototyping is more than just an iterative stage between design and publish – it's a foundational tool of every designer's toolkit. With the rollout of V2, prototyping can now be common language between designers and developers, and an artifact that speeds up and simplifies the handoff between these teams. Here are the core prototyping features users will find when using V2.

  • Rapid prototyping: It lets you run rapid prototyping so you hear your ideas in action, discover all the necessary edge cases and repair paths, and interact with all the possible paths through your experience. Speed up your process by interacting with any design with the push of a button, quickly make changes, and replay those iterations in seconds.
  • User testing: Prototypes enable user testing so anyone can get customer feedback on designs, even before launch. With live prototyping, you're able to test a design with customers to discover valuable feedback and issues before you code. Whether you're running moderated, in-person sessions, or remote, unmoderated tests, Voiceflow will support first learning from your customers.
  • Stakeholder demos: Prototypes create a much more engaging, interactive experience when demoing with stakeholders – giving you a better tool to communicate your ideas, concepts and designs to your team.
  • Developer handoff: Beyond the flow, prompt and response content of your project, there is so much more information that developers need to build a functional conversation experience. The interaction model, user states, context, and logic system of your conversation design can all be demonstrated and communicated with your prototype, making it a crucial artifact in the handoff to developers.

Prototyping is a catalyst for great conversation design. As designers continue to push the boundaries for voice and conversation design, they need tools that can represent their end-user experience at parity with the platforms they're building for.

With each new push, we've been focused on closing the gap between design and development and empowering teams to build a central source of truth for all conversation design projects.

  • Designing is coding: With our roots as a no-code development platform for conversational apps, each design created on our platform is code under the hood. This means there is a functional dialog manager being developed for every project that can be used to inform the development of a production app, or used to run it.
  • Enhancing designs with code: Every prototype created with our no-code design tool can be just as powerful as a conversational app coded from scratch. We also recognize that our advanced users require more advanced tooling. That's why each project is jam-packed with customizable blocks and steps that allow you to inject code as needed and access a series of APIs or advanced functionality, too.
  • Pipeline between design and development environments: Making that translation from your design into code means we need to support a pipeline between these environments. Whether you're pushing it to Alexa's Developer Console, or hosting it on your own, you'll be able to maintain a pipeline between your Voiceflow designs and the environment where your code lives.
  • Interactive conversation models: Seeing as every prototype is fully interactive, you can handoff more than just static assets and requirements to your development teammates. Each design can be shared as a complete, interactive prototype, or can be exported as independent functional components (like the interaction model, the dialog manager, the response content, etc.).
New configurable share view

Development Experience

We've always worked to make Voiceflow the most dependable creative tool for all channels and use cases. And, our open-source engine is at the core of bringing conversations to life. Every Alexa Skill and Google Action that's been created using Voiceflow has been powered by it.

New features available in our Voiceflow SDK

Now, that same open-source engine has been rebuilt from the ground up to run your project on any interface. Creators and businesses can access new levels of customization and flexibility when designing conversations using the Voiceflow Dialogue Engine.

The list of opportunities are endless. Whether for Alexa, in-car, messenger, Microsoft teams, Siri, or any other channel, prototyping and launching a vision is seamless and accessible.

For enterprise customers, the Voiceflow Dialogue Engine can be highly modular, allowing teams to mix and match their own conversational modules like natural language processing, dialog management, text to speech, and much more.

We understand how painful the hand-off between designer and developer can be. Voiceflow V2 also took aim at making that transition as smooth as possible.

Developers need flexibility, dependability, and productivity. That's why we've built an SDK ecosystem to allow developers to repurpose a designer's work while also having full customization of the experience. This means that every design in Voiceflow is deployable and ready to be customized – no more duplicating logic between prototyping and developing.

Both our SDK and Dialogue Engine have countless features that will make designing, prototyping, and launching conversation experiences a breeze.

  • Plug and play: Our dialog engine is a ready-to-use service with no configuration required. The libraries of our SDK eco-system can be used to interface with any programming language, including Javascript, Python, Java, and many more.
  • Real-time updates: Once deployed, **our dialog engine enables the designer to make continuous updates to the content and flows without any additional work required from the developer.
  • State management: The flows within your project get translated automatically by our engine to support any transitions - no matter how complex they get.
  • Language support: Conversations aren't region-specific, that's why our system currently supports 19 languages with more set to come.
  • Natural Language Processing and Dialog Management: The new dialogue engine has **Natural Language Processing (NLP) and Dialog Management built-in, enabling a conversation experience to be smart and flexible to the user's utterances.
  • Text-To-Speech (TTS): A common requirement for conversation apps, the text-to-speech ability baked into our engine gives users the freedom to choose from some of the most sought-after voices in the industry (i.e. Amazon Polly, Google Wavenet, and Azure).
  • Automation Speech Recognition (ASR): Every project – whether hosted on Voiceflow or elsewhere - can now support both speech ****and audible responses.
  • Block Customization: Developers can add their own services and blocks based on an application's unique requirements.
  • Self-hosted logic engines: For enterprise customers looking for peace of mind, our new dialog engine can be self-hosted. As the development and execution phase of a conversation app can now happen entirely on an internal infrastructure, it's easy for companies to handle HIPPA, GDPR, CCPA or any other compliancies.
  • Privacy: Our team takes privacy very seriously. We do not store any user sessions in our hosted dialog engine. Users can always go check the open-source project, too.

For developers wanting to request access to the SDK beta, sign-up here. The developer SDK starter pack will have demos, documentation, and all the details you need to get started running Voiceflow on any interface.

Voiceflow desktop app

Available for BETA now

Phew. That's a long list of features. In short, Voiceflow V2 is the powerful, new way to design, prototype, and launch conversation experiences.

That said, we also knew we needed to expand the tool so that pro users could rely on Voiceflow alongside other professional desktop tools, like Adobe XD, Figma, or Sketch.

So, Voiceflow is now available on desktop. Get the BETA version here.

Professionals want tools that are fast, and at their fingertips. The desktop version of Voiceflow can consume and export .VF files, while also running 25% faster than the web-based version. We're excited to see how users from around the world take advantage.

Wrapping up

With the rollout of V2, we've closed the gap between design and development. We've empowered teams to build a central source of truth for all conversation design projects. And most of all, we've redefined how conversational experiences can be deployed for every industry, every channel, and every use case. We can't wait to see what you build!

For enterprise teams looking to schedule a demo or learn more, click here: voiceflow.com/demo
Be sure to join our community on Facebook for support and education here: bit.ly/vfcommunity