Design A One-Of-A-Kind Chatbot

Design A One-Of-A-Kind Chatbot

Grade Level

6-12

minutes

1- 2 hrs

subject

Computer Science

You may have heard the famous answer to the question, “Why climb a mountain?” (“Because it is there.”) The same could be said about our desire to create programs that can communicate with us in a human-like way. Creating programs that can communicate with us like humans may have started as a curiosity, but now has many practical uses. For example, these programs can help businesses give better customer service, automate repetitive work, and help patients in healthcare. They can also be used to help students learn. This makes developing this technology important and useful.

A white-capped mountain in the distance.
Source: Daniel Leone on Unsplash.

In this activity, you will have the opportunity to create and edit your very own chatbot. To do that, you’ll go behind the scenes and learn how chatbots can understand and interact with your comments. Plus, you’ll discover some of the main reasons why chatbots are important for both the users and the people creating them.

Let’s dive into the fun stuff so you can get started.

Materials

Note: To use Glitch you must be 13 or older, and if under 18 must have your parent or guardian’s permission.

Activity 1: Getting To Know Your Chatbot

The splash page startup for Steamlabs’ chatbot activity which shows a yellow box with black text that reads, “ChatBot. Are you ready to start building your Chatbot?” There is a white button that says, “Start.”
The splash page startup for Steamlabs’ chatbot activity. Illustration by Steamlabs.

You will be using a chatbot created by Steamlabs to help you understand some of the options that service providers—in this case, the technology businesses and AI coders that create custom chatbots for their customers, or users—have when designing their systems. With this tool, you will be able to create your own version of a chatbot that is custom-tailored to your needs! For this activity, you will be both the service provider and the user, so you have complete control.

The Steamlabs ChatBot has some important safety features built into it to make it safer for you to interact with. The main feature is that it has a list of answers that you control, and it never says anything other than those answers. It uses an AI from Cohere.AI to select the most appropriate answer for what the user types in. It also has a content filter from Cohere.AI built into it to further reduce risks. 

This doesn’t make it completely safe, because you can enter inappropriate responses, and it still could choose an inappropriate answer. It’s up to you to use this tool responsibly!

NOTE: The ChatBot website was created with Glitch, a place where anybody can build websites and applications. It is designed to be compact, friendly, and accessible. Glitch has a free option that you’ll use for this project today. It provides access to many tools to create, test, and share your applications. Glitch is a powerful tool if you want to dive deeper into the world of web development. To find out more, visit Glitch support and check out their resources.

The ChatBot Tool

A larger red arrow points to a box that reads "remix on Glitch."
Select REMIX ON GLITCH to be brought to a new site where you have access to all the code and knowledge bases of the chatbot. Source: Steamlabs.

Let’s take a moment to explore the environment you will be using to build your own chatbot and experiment with the way AI responds to your inquiries. This tool is an all-in-one workspace that provides a convenient place for you to write, test, and preview your results. The Glitch platform is, in fact, a full Web application that involves many different parts. For now, you’ll focus only on a few pieces of the puzzle. Don’t be intimidated by all possibilities. Once you’re comfortable with designing a chatbot you can always come back and explore the platform more.

To get started, visit Steamlabs’ ChatBot tool then click on the ‘Remix’ button in the top right corner.

NOTE: It is not required that you create an account on Glitch, but it helps as this website will host your version of the chatbot. Please do not create an account if you are under 13 years of age. More information about Glitch and its privacy policy are available on its website.

Understanding The Main Screen

Start by getting familiar with the main areas of the application. In the image below, we identify four main areas:

  1. All files and settings in yellow.
  2. Selected content in green.
  3. Preview window in red.
  4. Options in blue.
The main remix page for the Glitch activity, with a directory on the left side, a preview window on the right, and instructions on the middle of the page.
The main workspace page for our Chatbot activity. Illustration by Steamlabs.

Files and Settings

This is the heart of the application—all the files used to make this project can be listed here. It’s mostly all the instructions that the developers gave the system for it to work. (So don’t make changes yet, or else everything might not work properly.) At this point, we don’t have to worry about these folders and files, but later we’ll be exploring and modifying one of the files!

Selected Content

This is the main work area for the project. When you first arrive, it will be showing an overview and some suggested uses for the project. As you dig deeper and begin selecting files, this will transform into the main workspace where you will be doing all of your tweaking of the application.  

Preview Window

This section is where you can view the “end product”—the chatbot. We can interact with the chatbot by pressing ‘Start’ and asking questions. We’ll do that shortly.

NOTE: If you don’t see the Preview Window, click on the 🔎 Magnifying Glass icon on the Options bar at the bottom of the screen. You’ll be presented with the option of opening the window as a pane in the current browser tab, or as a standalone window.

Options

This menu contains links to powerful developer tools, and a key link for us. The 🔎 magnifying glass icon toggles the preview window.

Take a moment to familiarize yourself with this environment, and then open up the preview window. It’s time we start!

Activity 2: Testing The Chatbot

A chatbot window with questions being asked and answers from the chatbot.
What are some questions you can ask the chatbot? Illustration by Steamlabs.

To get started, make sure you are on the Steamlabs’ ChatBot tool, and that you can see the preview panel and the ‘Start’ button.  

If you’ve had a chance to interact with other chatbots, you may have learned a few things about how they function along the way. (If not, check out our resource “AI For Kids: A Chatbox Exploration.”) Steamlabs ChatBot already has some data loaded into it as an introduction. Its function is to assist in finding Canada-wide national celebrations and other special days throughout the year.

Experiment with the chatbot by asking it questions about different days. Here are some ideas.

Questions it answers well:

  • What month is Mother’s Day in?
  • When is the best day to write letters?
  • When should I celebrate my teacher?

Questions it does not answer well:

  • What day of the week will International “Earth Day” fall on this year?
  • When do we celebrate International Talk Like a Pirate Day?
  • What day of the week is best for visiting with friends?

As you test the chatbot, ask yourself these questions.

  • What are some of its limitations? Can it hold a conversation? 
  • Where do you think the answers are coming from? Why?
  • Do you think a chatbot such as this has biases? 
  • Can you think of any ethical considerations that were taken into mind when building this chatbot? 

For more information on how the AI is able to comprehend and respond to your questions, read this explainer, “How Does AI Understand Us?

So, this chatbot has limitations. But why?

Related Segment

Why Do Humans Anthropomorphize AI?

Activity 3: Looking Inside The Chatbot

This chatbot uses artificial intelligence (AI) and machine learning to interpret your questions and match them with the best available answer. Meanwhile, it enables the service provider to control the message by curating the list of answers to choose from. You can modify these answers to enhance the current chatbot (or, as we will do in a bit, completely transform the function of the chatbot!)

Where Are The Current Answers?

To find the current answer the chatbot is using, click on ‘Remix.’ Then navigate to the Files and settings pane inside the folder ‘commands,’ select the ‘files’ folder, and click on the file called assistant.txt. This file contains all the current answers. Remember the question about how you thought the chatbot should be able to answer? This is the place to add any answer that we think is relevant to the chatbot in its current form.

An image showing what the assistant.txt file looks like. A panel on the left directs you to where to find the the file under the command and file subfolders. The text file has a number of non secular holidays.
All the answers! Illustration by Steamlabs.

As you can see, there are many answers for the chatbot to choose from. 

  • Go over the answers and find one that the chatbot used to reply to your question.
  • Try and determine what the chatbot uses to connect your question with the chosen answer. Do they share the same words or concepts? Do they seem to be unrelated?

In the next section, you are going to play the role of the chatbot engineer by adding your own answers to enhance the current event calendar with some of your own school, classroom, or family events.

Activity 4: Customizing Your Chatbot

The chatbot is doing a good job of providing you with information about national events, but with the knowledge acquired in the previous section, you now have the chance to customize the responses to include events relevant to your school or home. 

What Could I Add?

Remember some of those holidays you were looking for during your tests, but the AI couldn’t answer? This is your opportunity to correct that error. Navigate to the assistant.txt.

Some ideas of events you may add to your chatbot are:

  • Sports calendar for your favorite teams
  • Final exams and school holidays
  • Pizza days
  • Plays or recitals
  • Coding classes

Follow this simple process to add your custom events:

  1. Navigate to the assistant.txt file containing all the current events, as we just discussed in the previous section.
  2. Scroll to the bottom of the list and add as many events as you want.

Make sure anything you add follows the same structure as the information already included. 

  • Have the sentence and date follow the same structure as the ones already on the list: “(The event name) is celebrated on the (date).
  • Make sure that each event is only one line of the file.
  • Do not use abbreviations, accents, or extra punctuation.
Th eillustration shows the assistant.txt file with additional new holidays added to the list and surrounded by a red box.
What important dates will you add to the file? Illustration by Steamlabs.

Test, Fix, And Repeat

After adding one or more events, test the chatbot by asking different questions that should lead to one of your new answers. Repeat the process a few times with different questions, and each time, tweak your answer until you find that your chatbot is answering all the relevant questions you can think of. 

Great work! Now you have your own chatbot! As you have seen, chatbots are a powerful tool that can help shape the way we interact, not only with machines but with each other. 

Activity 5: Get Creative With Your Chatbot

Think of a task that you’d like an AI assistant to help with. Your chatbot is only going to be as smart as you make it, so if you want it to be able to respond to a wide variety of questions, you’ll need to fill your assistant.txt file with a lot of possible answers that reflect those questions. Ask a friend or classmate what they would ask your chatbot to see what questions and answers you should add.

Remember to find the file where all of the answers are located. Go to the files pane, select the folder ‘commands,’ and then the ‘files’ folder from there. You can see the assistant.txt file there. Swap out the answers with ones you feel your chatbot should give. You chatbot can answer questions about anything you like, from your favorite foods to your favorite movie.

Need help or inspiration? Check out our Additional Chatbot Challenges for more ideas!

On the topwindow, we see the chatbot responding with food suggestions. On the bottom we see the assistant.txt file with a list of foods.
You can customize your chatbot in any way you want by creating a new assistant.txt file. Illustration by Steamlabs.

Take It Further

Congratulations! You did a great job. Do you feel inspired? Are you considering all the different elements that go into this fascinating technology?  

After playing around with a chatbot, you may have gained a deeper appreciation for the complexities involved in creating useful chatbots. As a user, you may have experienced your own frustrations of interacting with a chatbot that is unable to understand your queries or provide helpful responses. As a service provider and chatbot coder, you may have realized the importance of designing a chatbot that is user-friendly, engaging, and capable of answering a wide range of questions. Hopefully, this experience has given you a better understanding of how chatbots work, their strengths and limitations, and the potential they have to improve our daily lives.

Here are some ideas on how to enhance or create new useful chatbots. See if you can apply any of these concepts in the chatbot you worked on today:

  • Is there a way to assign different weights to responses or words? How would you use that to make your chatbot better?
  • Can you personalize your chatbot and use it to make your life easier? You could make one for family events like birthdays, graduations, parties, and trips. Or make a calendar of city events in your community, such as concerts, plays, sports, and markets.
  • Can you create a trivia game where the player asks questions to identify a country, a historical figure, or an animal or plant. You could even use your game to study for a test.

Getting Started With AI For Parents And Educators

On May 9, 2023 Science Friday and Steamlabs hosted a special online event for educators and parents called “Getting Started with Artificial Intelligence” that gave an overview of chatbots, artificial intelligence, and machine learning. They also discussed the materials included in this resource and AI For Kids: A Chatbox Exploration. Plus, they presented some of the ethical consideration related to using AI. To learn more, watch the recording below. The presentation slides with comprehensive notes are available for educators that may want to explore the topic in more depth or use the images and information to share with their students.

Next Generation Science Standards (NGSS)

  • MS-ETS1-2: Evaluate competing design solutions using a systematic process to determine how well they meet the criteria and constraints of the problem.
  • HS-ETS1-4: Use a computer simulation to model the impact of proposed solutions to a complex real-world problem with numerous criteria and constraints on interactions within and between systems relevant to the problem.

This resource was developed by:

  • Steamlabs is a non-profit developing AI resources to help people to understand and think critically of AI technologies so that they can use it as a tool in their lives, and to be knowledgeable and proactive participants in the discussions that we must have as a society to ensure AI is deployed with fairness, accountability, transparency and ethics.
  • Digital Moment is catalyzing change makers through immersive and engaging experiences where young people can learn digital skills such as coding, algorithm and data literacy, and artificial intelligence to have a social impact.
  • This resource was made possible in part thanks to generous support from Amazon Future Engineer and Cohere.ai.

Credits
Lesson and supplements by Andy Forest, Reade Richard, Brenda Shivanandan.
Copyediting by Lois Parshley.
Digital Production by Sandy Roberts.


Educator's Toolbox

Meet the Writers

About Andy Forest

Andy is a tech entrepreneur and educator. He leads steamlabs.ca and has built AI education experiences for organizations around the world.

About Reade Richard

Reade is a Maker Educator, Author, and Curriculum Developer from Toronto, Ontario, where he creates a wide range of micro:bit and AI-focused activities for classrooms across Canada.

About Brenda Shivanandan

Brenda (she/her) is a visual designer, illustrator, and maker! With a focus on exhibit design and AI education, she has developed AI exhibits and workshops for Amazon Future Engineer, the Pacific Museum of Earth, and the Teknisk Museum.

Explore More