Chatbot experience design with complete conversational script writing

Challenge:

Design a conversational UI website promoting web development company. The chatbot had to direct users to one of the landing pages with services relevant to a given user need and provide contact details to the responsible communication manager.

cs-chatbot-general@2xcs-chatbot-general@2x

Project summary

Approach:

We started the project with extensive research on the principles of communication. Our goal was to create a conversation experience that is engaging and fun for the user but at the same time fulfills the client’s business objectives.

After determining the main technical and design aspects of the conversational UI such as the answer format, displaying the conversation flow and messages arrangement, we focused on writing the script.

With personas of target website visitors and client’s business goals, we prepared the outline of possible scenario for each type of user and followed it while writing the final version of the conversation.

Services:

•    User research
•    Conversational UI design
•    Visual design
•    Script writing

Client:

Chop-Chop.org

First phase of script brainstorming. Attempt to write down the main turning points of the conversation with the chatbot on the whiteboard.

case-chatbot-cody-wallcase-chatbot-cody-wall

Ideation process: writing down possible script blocks.

case-chatbot-script-structurecase-chatbot-script-structure

Timeline frame for chatbot script with an example of syntax notation.

cs-chatbot-conversation@2xcs-chatbot-conversation@2x

One of the chatbot's goals was to gather data about visitors and direct them to relevant services page of the company.

case-chatbot-iphone-b@2xcase-chatbot-iphone-b@2x

Chatbot website is fully responsive, ensuring visitors seamless mobile experience.

The outcome

Results:

Responsive website based entirely on conversational UI. Apart from increasing brand awareness in an engaging way, the chatbot fulfills more complex business goals starting from directing the user to relevant service page to collecting feedback about the company blog.

Interested in creating a chatbot for your business? Contact us to discuss the details.

[unex_ce_button id="content_9xpjhvyum" button_text_color="#252525" button_font="semibold" button_font_size="14px" button_width="auto" button_alignment="center" button_text_spacing="0px" button_bg_color="#ffffff" button_padding="14px 80px 11px 80px" button_border_width="2px" button_border_color="#43e3c3" button_border_radius="0px" button_text_hover_color="#252525" button_text_spacing_hover="0px" button_bg_hover_color="#ffffff" button_border_hover_color="#252525" button_link="info@therectangles.com" button_link_type="email" button_link_target="_blank" has_container="1" in_column=""]Contact us[/ce_button]

Related articles

Conversational UI Principles—Complete Process of Designing a Website Chatbot

Many people say conversational UI is the future of web interface. This article describes an entire process of designing a conversational UI for a B2B website, including basics of the communication theory and chatbot design tips and tricks.

Read the article by  Leszek Zawadzki for The Startup

Making Chatbots Talk — Writing Conversational UI Scripts Step by Step

Complete case study of writing conversational UI script, covering the whole process of creating chatbot script from setting the goals to development instructions.

Read the article by  Anna Kulawik for uxdesign.cc