A case study on examining the purpose of APIs (application programming interface) in conversational AI chatbots: when and why it is applied in the workflows for conversation designers, why the bot needs it to keep moving forward in the run-time conversation, and the appropriate interaction model in our UI. Let's deep dive into the foundational research that informed the UX and implementation of the APIs feature into a user-friendly and simplistic workflow in the [24]7.ai Conversations SAAS platform.
API definition & usage in chatbots
In my user interviews with conversation designers and bot developers, I understood that APIs are mainly used in chatbots to facilitate user interactions. APIs communicate to, from, and with external client services or applications, to recognize, validate, and display information to users. Here are the different ways an API can be used in bots:
Autofill, recognize, and authenticate: API checks other sources to retrieve required entity input without asking the user directly
In the example above, an API is being used to authenticate the user (existing user name) and their attributes/properties (tracking number and date of arrival). The bot responds with the user's name and contextual information without asking the user.
Validate and confirm: API checks to see if the user input/entity is in the correct format
In the example above, an API is being used to validate the message entity/info inputs necessary to locate the right information. The bot recognizes that the input is in the wrong format or has unsupported characters.
Information submission, retrieval, and display: API returns an output/outcome to the user based on the entity inputs given by the user. Can show if tracking number is on record or not.
In the example above, an API is being used to look up and display the correct information back to the user. The bot responds with the package tracking ID, delivery date, and address. Other use cases and examples of retrieving content: product results for product search and comparison, such as items, hotels, and air travel.
Previous codependent workflow
I created a flow diagram to display the codependent workflow as it functioned, previous to the existence of the Conversation Builder tool. There is a codependence and co-collaboration that is required between designers and developers. APIs require technical processes, integration, and manual coding that is beyond the designers domain expertise and competency. Designers are needed to understand the bot design opportunities for user input and outputs. Journeys must be constructed based on the information provided by APIs and users.
User problems
I've created a set of user problems from the workflow above that we'll need to solve for.
Developers use multiple 3rd party dev tools to create, manage, and integrate APIs, making it difficult to maintain and locate them their content.
Designers use multiple 3rd party flow diagram and mind mapping applications, where they denote the requirement for an API as markup.
There is no integration between developer and designer tools. The content developed across all these tools are isolated and must be pieced together manually in code.
Designers must rely on developers to create the APIs, leading to unwanted codependencies, extended time-to-tasks, and sometimes loss of productivity preventing them from moving forward in their work.
Designers do not have insight or visibility to the API's properties, events, or actions, leading to blindly designing without opportunities.
The KPIs that we will measure
I identified opportunities in the current workflow and user problems where we can elevate and improve the key performance indicators. Opportunities to improve delays, complexities, and communications.
Time-to-design: accelerate the designer workflow and process, enabling them to independently examine, choose, and apply APIs to their chatbot designs.
Time-to-develop: accelerate the developer workflow and process, enabling them to independently create, manage, and understand APIs, and how they are being used in a chatbot design.
Time-to-deploy: accelerate the designer and developer workflow and process to build and deploy the chatbot, through efficient communication and execution.
System usability scale: make the tool simple and effective, leading to user satisfaction, adoption, and acquisition.
ROIs that we will calculate
The KPIs will lead to ROIs, impacting the operational cost efficiency for both our clients and our internal services teams. Here's what I plan on calculating.
Internal service and/or client reduction in monthly costs due to 3rd party design and developer tool subscriptions, licenses, and purchases used for the creation, management, and integration of APIs. Our internal service team saves money, leading to cheaper services for our clients, leading to client savings.
Internal service and/or client reduction in # of associates required to execute the workflows and processes of designing and developing APIs in a chatbot. Our internal service team saves money, leading to cheaper services for our clients, leading to client savings.
Company increase in revenue due to the client acquisition of products with API integrations to build chatbots leading to customer satisfaction.
Client increase in revenue due to building bots with API integrations in our tools, leading to customer satisfaction and growth.
Internal service increase in revenue due to the number of service contracts signed because of the efficiency of API integration in bot building leading to customer success growth through great chatbot experiences.
Proposed workflow
I saw opportunities to redesign the workflow by eliminating or minimizing previous processes and tools. In the flow below, we generally use one tool for collaboration and allow the designer more control over the APIs. This would decrease the time-to-task KPIs, the dependency times, and the overhead that comes from using multiple tools.
Product goals
After synthesizing my user research, I created a set of product goals that we'll need to execute in order to solve our user problems.
One tool for designers and developers to declare, create, view, integrate, and manage APIs, eliminating the need for multiple tools.
Designers have visibility into the APIs and can now make better design decisions based on API properties and events.
Designers can design faster without the dependency of a developer.
Developers can create APIs a la code windows integrated into the tool.
Efficient communication and collaboration between developers and designers a la request functions.
Applying an API can be automated by a designer.
UI designs
Below are use cases and UI designs that will solve our user problems and product requirements.
Use case: "As a designer, I want to apply an API check after each individual entity field in a card or conversation, so that the bot can validate the data and progress the user through the journey."
Challenge APIs are applied after the completion of a form and applied for each individual field. Solution Each entity is its own node and can be combined as a group. |  |
Challenge Each field in a card or conversation must be validated with an API for errors/info. Solution Including an API setting in each entity node will help facilitate the field check. |  |
Use case: "As a designer, I want to apply an API check after the completion of an entity fulfillment card or conversation, so that the bot can validate the data and progress the user through the journey."
Challenge Designers can independently apply APIs to their conversation designs. Solution Add New Node mechanism includes an API node. |  |
Challenge It's apparent where and when APIs are integrated into the conversation.
Solution Designers can see the API nodes in correct position within their designs. |  |
Challenge APIs must be appended and configured for each API node. Solution A mechanism to choose from prebuilt APIs already in the system. |  |
Challenge APIs must ingest entities from the end-user and process the info for validations. Solution An Entity Inputs tab displays what will be processed by the API. |  |
Challenge APIs must act upon the info validations and return a response to the end-user. Solution An Events tab displays the various actions that the API can take. |  |
Challenge APIs must display unique info in the bot response to the end-user. Solution A Response Info tab displays the various information that will be used. |  |
Challenge The bot must respond to the end-user with unique information after collecting entities. Solution A bot message is applied after the API on the conversation flow. |  |
Challenge The designer must create the bot message with unique info. Solution Entity references are be applied to the bot message that connects response infos. |  |
Use case: "As a designer, I want to apply an API check for an authenticated user, so that the bot can be personalized and efficient in progressing the user through the journey."
Challenge The bot can instantly respond with personalized info without collecting info. Solution An API node is applied to a conversation that authenticates the user. |  |
Challenge The bot needs to respond with authenticated or non-auth messages. Solution Logic node is applied and configured for the variable paths and states. |  |
Use case: "As a designer, I want to request for a new API to be created by a developer and apply to my flow, so that I can complete my conversational bot."
Challenge An API does not exist in the system for the conversation. Solution Request New API is located in the API list, so designers can request the API needed. | |
Challenge Developers needs to understand the requirements of the API. Solution Designers can create a description of the API in the request dialog. |  |
Use case: "As a developer, I want to create, manage, and integrate APIs in one tool with the conversation design, so that the conversational bot efficiently accomplishes our customers goals."
Challenge APIs are dispersed in different tools. Solution Collate all APIs into a single place in a single tool. |  |
Challenge Developers need to know when and what APIs to build. Solution Notifications display icons to signify that requests have been filed. |  |
Challenge Developers use different tools to create APIs. Solution Coding windows are integrated into the system. |  |
Conclusion
Understanding client requirements from their customer service chatbot experiences are key to knowing how the conversation designer should design for them. Then, providing the functions and workflows that would enable them to fulfill those requirements in the tool. Fleshing out high-level flow diagrams of current workflows and desired workflows with constant reviews with our users were essential to determining the necessary product requirements, use cases, and nailing down the right UI. Reducing KPIs such as time-to-tasks , codependencies, and number of tools, help to improve the adoption, retention, and usability of the experience. Concept tests have proven the design to be intuitive, useful, and desirable. API integration is a powerful interaction mechanism that makes customers delighted with personalized and smart chatbot experiences that help the user efficiently and simply complete their personal tasks.
About the author
Sean Lazo is a Principal UX Designer at [24]7.ai who leads the inception, assembly, and design of [24]7.ai Conversations, an industry-leading omni-channel AI chatbot SAAS platform. His passions are DesignOps, detailed design, research, and human relations.
Comments