A design kit to build a bot from scratch

digitalentity.design 1
Welcome to our bot design kit. We made these guidelines as
a starting point for you to build innovative digital products for
clients and customers.

These guidelines are the result of three months of work.

We started with collaborative design sessions with clients,
involving our Digital Strategy, UX, UI, Content, IoT and mobile
teams. All together from the beginning.

We never stop improving and update our every-day-life design

methods. Now we are sharing it with you.

– Digital Entity
Index
C H AT B OT R E A S O N W H Y 5

Chatbot scope 6
Collaborative design session (or not) to define “Why build the chatbot” 6

Positioning Pyramid to define the objectives 7

Radar to shapely define the scope 8

Customer Journey to define where does the bot come to play 9

Card to design how does the bot interact 10

C H A R AC T E R D E S I G N 11

Copy strategy tuning 12

Tone-of-voice brand’s analysis 12
Copy strategy of the brand (as-is) 13
Copy strategy tuning for the bot (to be) 13

Character definition 14
Design of the virtual assistant 14
Mood setting with adjustable values 15
Additional moods for targets 15

Style of the dialogue 16

 Information vs. Emotion 16 Loader 31
Tone-of-voice of the virtual assistant 17 Avatar 31
Copywriting rules 18 Notifications 32

Conversation & UX/UI 19

I V E T H E A I S O LU T I O N
Mapping of the fundamental conversations 19
Rationale and examples of conversations 21
What is IVE? 34
The best solution to fast prototyping 35
PRODUCT DESIGN 22 How it works 35
Technical specifications 36
Scenarios 23
I don’t understand 24
P R I N TA B L E M AT E R I A L
I can’t help you 24
I can help you 25
Positioning Pyramid 38
I know you 25
Radar 39
Customer Journey 40
Why? Where? What? 26
UI design card 41
Why a chatbot? 27
Mood settings 42
Where is your chatbot 27
Tone-of-voice 43
What is your chatbot made of? 27
Text 28
Quick actions 28
Carousel of options 29
Rich Media 29
External URL 30
Permanet Menu 30
 Chatbot
reason
why
Design needs a reason: Just like every product we deal with,
we have to ask ourselves: “why are we designing a chatbot?”
“What value will it bring to people’s experience? Will it
improve the use of the service or of the product? If your
answer to all these questions is “Yes”, you are on track. If your
answer to the first question is “We are drawing it because
we were asked to do so” you can do better with the next
suggestion, the “Chatbot Scope”.
digitalentity.design 5
 Chatbot scope
The reason why of a chatbot is crucial because it guides you
throughout the whole design. You need to check if every
detail of the design leads to that goal. A continuous check
allows you to put things right at any time.

Collaborative (or not) design session to define “Why building

a chatbot”

To set the scope of a chatbot you can engage the client in a

collaborative design session in which you will show the best
practices on chatbot and use two tools to define and approve
the bot scope. If you can not involve the client, use
these tools in your design team to clarify your ideas:

digitalentity.design 6
 Positioning Pyramid tool to define the objective of the bot

What is it? Three simple yet fundamental questions to define products

and services also work well for chatbots. Start with the
question “What is it?” and try to summarize the definition of
your bot in a sentence by including its main characteristic.
Then pass to “Who is it for?” question for detailing to whom
the bot is dedicated, who will have a benefit from it. Final
question is “How does it bring value?”. In other words: why
does the bot bring value to people’s experience?

How does it
Who is it for? bring value?

PRINT ME | PG 39
digitalentity.design 7
 Engagement
ss

Radar Tool to shapely define the scope of the bot

Pur
ene

c
Awar

hase
This tool allows you to define the balance of the chatbot
scope. Is it a sales bot, an assistance bot or an awareness bot?
Use the corners of the radar to write possible scopes of the
bot and then give it a value from 1 to 5 to each of them. The
output gives you the idea of the tasks your bot can do.

na
M

t
a

ge r
me p po
nt Su

PRINT ME | PG 40
digitalentity.design 8
 Awareness Exploration Purchase Usage
Customer Journey to define where does the bot come to play

Once you have defined the purpose of the chatbot, you need
to think about your customer’s journey. The chatbot is a new
touchpoint of the user experience and, in order to add value
to the product or service, it has to come into play at the
right time and at the right point of the journey. Is it a chatbot
that helps the client proactively or does it intervene only on
request? Now you are ready to draw the customer journey and
ask yourself: ”At what phase of the journey the bot can bring
value?” and “Where can it improve the experience?”.

PRINT ME | PG 41
digitalentity.design 9
 WHERE DOES IT COME TO PLAY?

Type of Interaction

Card to design how does the bot interact

After deciding in which phase of the journey the chatbot

intervenes, it’s time to define “how” the bot comes into play.
Type of content Use this card to show the way the bot interacts with the user
on the customer journey in the segments you chose. What is
the the type of interaction of the bot? What kind of content
does the bot offer to the user? How does the bot bring value
with its intervention?

What is it the reason why?

PRINT ME | PG 42
digitalentity.design 10
Character
Design
Your chatbot looks more like Wall-E from Disney,
J.A.R.V.I.S. from Marvel’s Iron Man or Alfred, Bruce
Wayne’s (a.k.a. Batman) butler? Every chatbot can
be a specific character. How does a chatbot speak?
How does it say hello? How does it invite you to do
something? Does it speak in a formal or informal
way? Answer these questions and you will define the
character of your bot. In terms of communication, the
goal to achieve is to have a bot consistent with the
ecosystem of the other customer’s touchpoints.

digitalentity.design 11
 Copy strategy tuning
How is the brand This is a theme of communication. Setting the correct copy
strategy of the bot is important to get consistent experience
TOV in advertising? with the brand. If you are in contact with the communication
department of the client you are designing the bot for, you
should request the communication guidelines. You can,
otherwise, perform an analysis to lay the pillars of bot design.

Human Corporate Tone-of-voice brand’s analysis

Authentic Fake
The brand’s tone-of-voice, the way a brand speak to its
VS customers, can be gathered from the analysis of the
Spontaneous Staged
communication guidelines, but also from the call to actions.
Translating the TOV in a chatbot conversation is the key factor
Knowledgeable Patronising
for doing a good job.

digitalentity.design 12
 REAL LIFE IRONY SIMPLICITY EMPATHY TWIST REAL LIFE LIGHTNESS SIMPLICITY EMPATHY CONCISENESS

Copy strategy of the brand (as-is) Copy strategy tuning for the bot (to be)

Summarize the pillars of the brand’s copy strategy. Be brief.
You can use a sketch to represent the pillars.
Not every single pillar of the copy strategy as-is works for the
chatbot. Now you have to drop on the chatbot some of the
pillars so that the chatbot experience results coherent. Chat
has rules other than the Web. For example, in chat extreme
synthesis is a key factor.

digitalentity.design 13
 Character Definition
Who will your chatbot be? To design a virtual assistant (in the
form of a chatbot) easy to be related to, it is necessary to give
it a role. The environment we imagine for the chatbot and its
personality give as a result a credible behaviour. If the chatbot
was a person, where would it live?

Design of the virtual assistant

Describe the virtual assistant as if it was a person. Who is

it? Where does it live? Which are its passions? If it posts
photos on its Instagram profile, what kind of photographs
would it show? How would it comment? For example, the
bot is a banking assistant, polite and respectful but with a
great passion for technology. Whenever a customer asks it a
question, it answers with a technological suggestion, since it
was born to educate people to use digital services.

digitalentity.design 14
 Mood setting with adjustable values
Mood settings
Once the character is defined, it represents its main mood,
how it deals with people. For example, if the chatbot was born
to assist customers, probably it will have a strong inclination
to reassuring. The following template is only an example. You
can change the values to adapt the mood of your chatbot.
Butler Salesperson

Bureaucratic Informal

Impersonal Reassuring Additional moods for targets

In this phase you can also define additional moods by target

starting from the main one. Probably the chatbot is addressed
in a way to an elderly public and in another to younger people.
Or in a way to a prospect and in another to customers.

PRINT ME | PG 42
digitalentity.design 15
 Style of the dialogue
How will your chatbot speak? What will be its style of
dialogue? What will be its tone-of-voice? Will it use emoticons
or not? If so, which ones? All this is part of the style of bot
Informations + Emotions dialogue.

Information vs. Emotion

Procedures Engagment
A conversation can be very informative or very emotional. Or
Solutions Hello it can alternate these two characteristics to create a persona
capable of using these ingredients in the conversation recipe.
Instructions Jokes How do you imagine the dialogue of your chatbot? How do
you see the relationship between Information and Emotion?
Warning Emoticons More information makes the bot operational; more emotions
helps to bring the bot closer to the people. In this stage you
need to decide the right balance for your chatbot.

digitalentity.design 16
 Tone-of-voice of the virtual assistant

The words of the chatbot undoubtedly express its personality

and the brand’s. This attitude is the tone-of-voice, which also
Tone-of-voice settings
comes from the mood of the chatbot. The tone of the chatbot
must be the same of the brand’s. For example, if you are
designing an assistance chatbot, you can consider the mood
and tone-of-voice of the company customer care.

Funny Serious

Casual Formal

Irriverent Respectful

Enthusiastic Matter-of-fact

PRINT ME | PG 43
digitalentity.design 17
 Copywriting rules

Now to respect and express the mood of the chatbot and the
tone-of-voice you chose, you must focus on every detail of the
conversation. Infact, the personality of the bot arises from the
little details. Consider:

• Informal vs. Formal (the informal gets closer to people)

• Emoticons (try to understand who you are dealing with.

Will your user appreciate emoticons?)

• Typing (the typing bot gives the feeling of a real time

conversation)

• Avoid full stops at the end of interactions (they tend to

close the conversation)

• Write little text in each balloon (otherwise the conversation

will come out of the screen and the user will have to chase
it)

• Type correctly in the language of the Country (or in slang if

it is part of the bot personality)
digitalentity.design 18
 Conversation & UX/UI
Now it’s the time to build the chatbot and write the
fundamental conversations. If necessary you can customize
every conversation according to the different moods of the
bot.

Information vs. Emotion

Every chatbot has its specific conversations. You can still

consider these types of conversation that fit for every chatbot:

Introducing the bot

This step is quite important because it engages user in few
words by communicating the KSP of the service: utility,
possibility, easy-of-use.

Welcome greetings
The way the bot says hello communicates and reiterates

digitalentity.design 19
 the relationship between the user and the virtual assistant.
Let’s differentiate in first welcome greeting; second
welcome greeting; “Long time no see”.
Questions
Questions are a key factor. How does the user feel about
the questions the bot asks? At ease or uncomfortable?
Answers in case of emergency
It’s in this case that the very core of the bot arises. “There
are no problems, just solutions”. Tone is always calm,
secure and empathic to reassure the user it can relate.
Switch operator
Bot can answer to a lot of questions, but not all of them.
When it can’t answer a question, it offers to the user the
option to pass to a real person operator.
Answers to marketing questions
Provide your chatbot with answers to questions about the
company or the brand. Users are always curious about this
digitalentity.design
kind of information.
Answers to off-topic questions
In moments of “weakness” of the chatbot, personality
emerges. At that point, the bot will thank for the question
and, kindly, it will bring the conversation on topics it
knows.
Answers to inappropriate questions
When you test a person, you understand who s/he really
is. This applies for chatbot too, which is not impressed by
the user, but it always retains its style, or better yet, the
brand’s.
Waiting times
This is another opportunity to bring out the personality of
the chatbot, its patience and its willingness. It is a delicate
moment in which we need to speak to the user in a non-
invasive way.
20
 Feedback requests use a scheme of writing side by side to compare various
Feedback is always ideal for everyone. In particular, a conversations so that it is easier to adjust text details by
chatbot can improve itself through feedbacks. There are moving from one conversation to the other.
so many ways to ask for feedbacks: e.g. UX/UI elements
to approve or not a response to the text. Choose the most
appropriate one.

Goodbye greetings
The chatbot cheerfully take leave asking if it can do
anything else for the user. This is useful also to remark
the solution to a problem just solved and leave a positive
memory in the user.

Rationale and examples of conversations

After considering the fundamental conversations, begin

to write the texts for the chatbot. Remember to respect all
the values defined in the previous phases of design and to
write the conversation scripts with supporting rationale. If
you imagine different moods for the same chatbot, you can
digitalentity.design 21
 Product
Design
Personality is not a part of the interface, it is the interface.
After having designed the character of the chatbot, which is
the most important thing to define with your client, you need
to identify how your chatbot behaves. All behaviours should
be driven by your bot personality and scope: Is it a waiter or
a seller? Is it talkative or straight-forward? Is it proactive or
ready to answer to your questions?

digitalentity.design 22
 Scenarios
You already set some user-scenarios when you identified how
the chatbot would improve your user experience of a service
or a product. In this way you will successfully design the
responses and the behavior of your chatbot when it must be
helpful,

However there are always other scenarios you must keep

in mind when designing a chatbot and they are always
related to exceptions and cases you haven’t identified during
your design phase. Why? Do you use a chair just to sit or
it happened you have used it to catch your muesli on the
highest shelf?

digitalentity.design 23
I don’t understand
According to the tone-of-voice of the chatbot we foresight an
answer for questions the chatbot might not understand. Even
if the AI technology is very advanced you have to include this
scenario to your design: you never know how far questions
will be from your content.
digitalentity.design
I can’t help you
The chatbot understand the area of investigation but the user
is still unsatisfied: redirect the user to another touchpoint.
In our case we suggest to take advantage of the community
where users can help each other and post questions to be
solved user-to-user. It could be a call center, a blog, an online
community, according to your business model.
24
I can help you
In this scenario, your bot is in action and probably it’s the
most complex area of your design. Those cases your bot will
be helpful depends on the goals you previously set for your
bot: if it’s an e-commerce bot it will be more prepared for
those questions related to the purchase phase.
digitalentity.design
I know you
According to channels where your chatbot operates, it might
have access to users’ informations. Use them in a wise way to
make the conversation more personal but put always yourself
in users’ shoes: do they really want you to show you know
exactly where they live? Don’t get creepy.
25
 Why Why? Where? What?
Where
Just three key questions to start designing your chatbot:

• Why? As we already told you, you have to identify why you

What
want a chatbot rather than another touchpoint.

• Where? List and identify the platforms the chatbot will be

available for users.

• What? Design the different user interface elements of the

chatbot.

digitalentity.design 26

Why a chatbot?
Any cool service has a chatbot, but just a few chatbots are
really useful to customers. You already know the scope of
your bot from a business point of view, you may not know
the value of the chatbot for your users. If you already have
a service and you want to improve it, you might need to
identify some pinpoints in your current user journey. If you are
digitalentity.design
designing a brand-new service and you foresight a chatbot,
you might need to give it a role among your stakeholders and
touch-points.
Where is your chatbot?
According to your final user’s behaviours using your service
the chatbot can be placed in different platforms such as
Facebook Messenger, your own website, your service app,
Slack... . As one of the most powerful design tool, personas
can drive your system design and its related touch-points. Is
your persona a social animal? Is s/he working or studying? Is
s/he already a client of your service?
What is your chatbot made of?
We foresight different ways of interaction of the bot.
27
 Button A
Button B

Text Quick actions

Texts are core in chats, very suitable for engagement and
leaving phases. Avoid wall of text. If you have long text,
summarise them and split them in different messages to
let users visualise always the entire content of one single
message in the messaging area.
People don’t use chatbots for the sake of technology, they
expect answers to their questions. Most of users’ doubts can
be solved by call to actions. It’s faster and easy to use.

digitalentity.design 28
 Button A
Button B

Carousel of options Rich Media

Give a maximum to the number of your options available: Videos are useful to give and overview and increase
infinite options mean no options. awareness. They are also useful as tutorials. Don’t use videos
for specific questions that need a straight answer.

digitalentity.design 29
 Title
Menu 1
This is the description of the website

website.com
Menu 2
Menu 3

External URL Permanet menu

You can empower your users and give them the sources
where to find an answer or to access to a digital service
though external URL.
Choose core links to put on your permanent menu always
available. The permanent menu allows you to have an always-
on user interface element inside the conversations. This is
an easy way to help people discover and access the core
functionality of your bot at any point in the conversation.

digitalentity.design 30
Loader
Your user might be waiting for a crucial an loader helps
the user to have a feedback about the bot working on her
question, decreasing tension while waiting. Not having
progress indicators such as Sending under the message to be
sent or loader dots is frustrating for users that are now used to
them in their every-day life.
digitalentity.design
Avatar
You already designed the personality of your chatbot. Is it
warm? Is it like a friend or is it more a help desk operator? The
icon of your chatbot should embed the characteristics of its
personality. You can also give him a name and make it more
human. Our avatar is coherent with the look and feel of the
brand and all of its touch-points.
31
 2

Notifications
Messaging is the way millennials and the majority of digital
users like to interact. Unlike phone calls where users are
focused on the task and the goal they want to reach, chats let
users be more multitasking, so they easily lose their focus.
For these reasons of lack of focusing, a feedback for the
user to know they received a new message is crucial to be
designed. A visual feedback is mandatory (notification icon),
sound feedback is always welcome as an invitation to come
back to the chat if your users is away.

digitalentity.design 32
IVE
the AI
Solution

digitalentity.design 33
 What is IVE?
IVE is an Intelligent Virtual Entity able to simulate the
cognitive processes of a human being when learning a
natural language, with full autonomy and without the need
for manual configurations. IVE is a virtual assistant interacting
through natural language, based on the Artificial Intelligence
technology provided by XSENSE by Silicondev. It interacts
via chat and spoken language and can be accessed through
mobile app, web app and physical assistants like SOTA by
NTT DATA. It complements XSENSE by adding personalized
dialogues and by integrating with Customer functionality
IVE can establish multiple conversations with the user,
allowing the creation of dynamic conversation flows. It is able
to switch from one topic to another without losing its train
of thoughts, just like a human being (and sometimes even
better). This is possible because IVE remembers the context of
the dialog and is able to take it back even after talking about
something else.

digitalentity.design 34
 How it works

IVE is based on XSENSE artificial intelligence.

XSENSE understands and autonomously relates to the context
subjects and matters starting from structured document
or online chat, handles complex dialogues based on
natural language, with memory and context switch within a
knowledge base, allowing to validate the associations it built.
XSENSE is not a semantic engine, a pre-engineered graph of
relationships, an instrument needing complex operational

The best solution to fast prototyping notions. During data import, XSENSE understands the
relationships and the logical connections between subjects,

The features underlying IVE are personalization and simplicity. learns how to use words in a context avoiding disambiguation

We want to provide the best experience for the user, not problems, identifies and correlates synonims, contextualising

only understanding his requests, but also understanding new subjects. XSENSE learns by reading documents. It

his personality. This must be achieved in the simplest way exposes APIs for data import in several formats, with the

possible. Simple configuration, simple integration and possibility to extend import capabilities through parsers.

especially simple to use. Thanks to IVE, it is possible to build

perfect functioning prototypes in less than a month from
which you can fully appreciate all the features it offers.

digitalentity.design 35
 Technical specifications

Knowledge Base
The IVE architecture is shown in figure. IVE is situated at the
XSENSE
central point among the front end systems, customer business
processes and the XSENSE artificial intelligence engine.

Front end systems

IVE exposes RESTful interfaces to front-end systems. This
Customer allows the simple use of IVE from all mobile devices, personal
Business IVE Customization
computers and physical assistants.
Processes
Customer business processes
Through the analysis of the customer’s processes, we define
the customization of interactions. In addition, IVE is able to
perform actions on customer processes through the call to
RESTful Interface RESTFul services or the launch of scripts.

A.I. Engine
IVE uses XSENSE to understand the user’s request and always
Mobile App Back-end systems Web App provide the correct answer. XSENSE use an internal knowledge
base containing the information and models of customer world.
digitalentity.design 36
Printable material
Positioning Pyramid PRINT ME

What is it?

How does it
Who is it for? bring value?
Radar PRINT ME
Customer Journey PRINT ME

PHASE 1: PHASE 2: PHASE 3: PHASE 4:

TOUCHPOINT 1:

TOUCHPOINT 2:

TOUCHPOINT 3:

TOUCHPOINT 4:
UI design card PRINT ME

WHERE DOES IT COME TO PLAY? WHERE DOES IT COME TO PLAY?

TYPE OF INTERACTION TYPE OF INTERACTION

Text Text

Tab / Multi-choice Tab / Multi-choice

TYPE OF CONTENT TYPE OF CONTENT

Only text Only IMG Video Only text Only IMG Video

Text + IMG Multi-choice Link Text + IMG Multi-choice Link

WHAT IS THE REASON WHY? WHAT IS THE REASON WHY?

Mood settings PRINT ME

NEUTRAL

NEUTRAL

NEUTRAL
Tone-of-voice settings PRINT ME

NEUTRAL

NEUTRAL

NEUTRAL

NEUTRAL
 This toolkit was created by Andrea Rossi, Lorenzo Moschi,
Giulia Di Gregorio, Giovanni Schirò, and an extended team
of people at Digital Entity and NTT Data who are focused on
User Centric Design.

Font
Beyond Bot Graphik, Commercial Type, 2009
By Digital Entity 1st Edition © 2018 Tungsten, Hoefler & Co., 2009
There’s something that connects people and
things. It’s the experience that comes from
design. We design innovative experiences.

digitalentity.design 45