Navigation

    CreatiCode Scratch Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • CreatiCode

    AI - 2 Chatbots Debating Each Other (Difficulty: 4)

    Tutorials
    1
    1
    457
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • info-creaticode
      CreatiCode last edited by admin

      Introduction

       

      Have you ever wanted to let two chatbots take opposite sides in a debate while you sit back and watch? Giving each bot a different job can make your program easier to build and tweak.

      In this project, you’ll create two chatbots that debate any topic the user chooses. It will be interesting to see both sides of an argument, and also a great practice in working with chatbots.
       
      debateaidemo.gif

       
       

      Step 1 - Prepare the Stage

       

      1. Start a new project in the CreatiCode playground.
      2. Delete the default dog sprite.
      3. Pick a backdrop. Try the AI image generator with a prompt such as
      Two cute robots having a debate behind podiums on a stage, cartoon style
      

      You’ll get something like this:

      alt text

       
       

      Step 2 - Add a Topic Input Box

       

      Place an input textbox in the top-left corner so the user can type the debate topic.

      35b63c34-0af0-45ed-a804-44001eec77e6-image.png

       
      Here is the widget block you can use. Feel free to adjust the parameters manually or use the Widget Position tool.

      79afa67c-bac6-481f-a125-e50f56e834b0-image.png

       
       

      Step 3 - Give the Input Box a Default Value

       

      While you’re testing, you won’t want to retype the topic every time. Set a default value, for example, “AI will automate every job.” We can remove this block when the project is published.

      b2de945b-9f5d-44e5-abec-86c6c5b3a6fd-image.png

       
       

      Step 4 - Create the Start and Continue Buttons

       

      Next, please add 2 buttons to the right: “Start” and “Continue”:

      9277bde1-dca0-41d0-a000-a948cc5ae215-image.png

       
      Here are the blocks for adding them:

      78be7bcb-6a94-49f4-b1f8-8ccff55e8924-image.png

       
       

      Step 5 - Add a chat window when the Start button is clicked

       

      When the user clicks the Start button, we will add a chat window widget. However, we do not want to show the input box at the bottom of the chat window, since both parties debating are AI chatbots.

      One simple solution is to place the chat window lower on the stage, so its bottom section is hidden below the bottom edge of the stage:

      54a83dc6-ea84-4b80-b8b4-03b0427a0718-image.png

       
      Below is the block for adding the chat window with a lower Y position of -60:

      3e4fbe05-a201-4b81-a95d-c8c563249cd6-image.png

       
       

      Step 6 - Write the shared instruction

       

      Now we will work on the first prompt that will be given to both chatbots. Since the prompt will be the same for both chatbots, we can store it in a variable named “instruction”. The prompt will specify the topic/thesis for the debate.

      973e55e9-7735-4795-8393-c5c412d6bc26-image.png

       
       

      Step 7 - Write the Pro-side prompt

       

      Next, let’s write the prompt for the first chatbot, which will debate on the “pro” side (agreeing with the thesis):

      43e18687-f5fa-4283-87d1-dcc97c3759ee-image.png

      The request will start with the shared instruction, and then ask the chatbot to write an opening statement. Note that we are asking the chatbot to use fewer than 100 words, as we are still developing the program. We can change it to a larger value when the project is published.

       
       

      Step 8 - Call the first chatbot

       

      Send the prompt to Chat-Bot 1 using these two blocks:

      ab2331fa-304e-47ef-9683-51fc10d892b7-image.png

       
      Explanations:

      1. The “select chatbot” block ensures that the AI request below it is sent to the chatbot with ID 1. The ID can be 1 to 4, so there can be at most 4 chatbots.

      2. We are using the “LLM model” block with a “small” size. This is a relatively small AI model that runs very fast and is smart enough for this use case.

      3. We are using the “waiting” mode, so this block will pause the program until we get a response from the AI model and store it in the “result” variable.

      4. We are using a maximum length of 1000, which means 1000 tokens, or about 750 words. That’s more than enough, since we are asking the chatbot to use fewer than 100 words in our prompt.

      5. We are using a temperature of 1, which makes the chatbot the most creative.

      6. We are starting a “new chat” session, since this is the first request and we do not need to rely on any previous chat messages for context.

       
       

      Step 9 - Show the Pro Opening Statement

       

      Once we have received the opening statement, we will add it to the chat window. We will name this chatbot the “Pro” bot, and display the statement as white text over a green background on the left:

      7ce4e7f0-1261-4bc6-af08-e4acc29f6eda-image.png
       

      This is what it looks like when we click the Start button:

      openstatement.gif

       
       

      Step 10 - Build the Con-Side Prompt

       

      Next, we will write the prompt for getting the opening statement of the con side. One difference is that now we have received the pro side opening statement (still stored in the “result” variable), so that should be inserted into the request for the con-side chatbot as well. In other words, if this is a real debate between 2 persons, the con-side debator should already know the opening statement of the pro-side debator.

      4f3f672f-2711-4b7e-9b98-135549a6ce56-image.png

       
       

      Step 11 - Call the second chatbot

       

      Now we are ready to get the opening statement from the second chatbot. The 2 blocks are very similar:

      b885c9bc-73e8-4743-8ad1-2cc6e51a34a5-image.png

      Explanations:

      1. We are selecting the chatbot with ID 2, so any chatbot requests after this block will be sent to the second chatbot.

      2. This is still a “new chat”, since this is the first message we send to the second chatbot.

       
       

      Step 12 - Display the con-side opening statement

       

      Now we can add the response from the second chatbot to the chat window. This time we will make it aligned to the right, and show the text as white over purple:

      c01fd26d-d9b9-4ff5-ac67-5b4a5a97083f-image.png

       
      Now, when we press the Start button, we will get opening statements from both sides:

      both.gif

       
       

      Step 13 - Refactor the code

       

      Before we continue to get more debate messages, this is a good time to refactor (reorganize) our code a bit. It is already clear that every time we ask a chatbot to say something, we always use these 3 blocks:

      1. select a chatbot
      2. ask the chatbot to generate response
      3. add its output to the chat window.

      Therefore, we can bundle these 3 blocks into a custom block. The only changing part is the actual request (prompt) we send, so that can be specified as a block input.

      For example, for the first chatbot, we can define a new block like this. Note that the request block being used is the input from the define block, not the “request” variable.

      6f8e79d4-7bf8-47c3-9489-c5705f2385aa-image.png

       
      Similarly, we can define another block for the con side chatbot:

      65b0ee23-d10b-442d-8d3c-1ccc2868b844-image.png

       
      Now we can rewrite our main logic using these 2 new blocks like this:

      428b1761-0675-4fbf-8759-a77bb78919d4-image.png

       
       

      Step 14 - Start Cross-Examination (Continue Button)

       

      After the opening statements, our debate will enter the “cross-examination” phase, in which the pro side asks the con side questions.

      When the user clicks the “Continue” button, we need to compose a new request to the pro side chatbot with the following information:

      1. The content of the opening statement from the con side (stored in the “result” variable)
      2. The debate is entering the cross-examination phase
      3. instruct the pro chatbot to ask the first question

      Can you try to compose this request?

       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
       
      Below is an example request that’s concise and clear:

      cfc8dfcb-d6c6-46bd-b6c2-eee28dd3cfb4-image.png

       
      Note how easy it is to reuse the “pro chatbot” block. Now, if we click the Continue button, the pro chatbot will ask a question:

      firstq.gif

       
       

      Step 15 - Switch to Continue Session Types

       

      There is an issue we need to fix before continuing. In the “pro chatbot” block’s definition, we are using the “new chat” session type. This will cause an issue, since every time we run the “pro chatbot” block, it will start a new chat session, and will not “remember” any previous messages in the debate.

      For example, when we click the Continue button, the pro chatbot will start a new session. It will see the con side’s opening statement because we include it in our request this time. However, it will not see its own opening statement, because we are starting a new session with no history.

      To fix this issue, we need to change the session type to “continue”.

      [advanced note] Here we are using a special feature of the chatbot block: when the green flag button is clicked, the first time this block is used, even if we specify “continue”, it will always be a new session with no history. Therefore, it is safe to use “continue” type all the time, so long as the user starts the program by clicking the green flag.

      We can change both blocks like this:

      7f29bcad-2a84-48f1-b62a-81a62dcc3605-image.png

       
       

      Step 16 - Get the con side’s answer

       

      Next, let’s ask the con side chatbot to answer the question:

      9078343c-b85b-48b8-966a-1ec790973abd-image.png

       
      When we click the “Continue” button, we get a question and then an answer:

      qa.gif

       
       

      Step 17 - Add a “phase” variable

       

      At this time, the pro side has asked a question and the con side has answered it. If we press the Continue button again, we want them to do another round of Q&A. However, the request has to be a bit different since we no longer need to say, “Now you are in cross-examination,” nor do we need to provide the opening statements.

      Essentially, we want a different request to be sent based on whether we are entering the cross-examination for the first time or not. We can use a new variable, “phase,” to keep track of the current phase of the debate.

      First, when the Start button is pressed, we will set the phase to “Opening”:

      b5fe958a-e35c-4559-be12-4fe53d2099c9-image.png

       
      Second, when the Continue button is clicked, we will check if we are in the “Opening” phase or not. If we are, then we set the phase to “QA”, and add our existing logic to that branch:

      43212d66-12a0-4973-9d55-9f469ec43521-image.png

       
       

      Step 18 - Keep the Q & A Going

       

      Now, we are ready to add the logic to make the 2 chatbots go through another Q&A session whenever we click the “Continue” button. The request will be simpler, since based on the chat history, both chatbots already know they are in the cross-examination phase.

      fe7c7292-ab2c-4a87-a5ac-bd6f89b82884-image.png

       
      Test it by clicking the “Continue” button, and we can keep going forever if we want to. Here is the complete demo:

      debateaidemo.gif

       
       

      Additional Challenges

       

      There are many ways to extend this project. Here are some examples:

      1. Closing Statement: Add yet another button “Closing”, which will trigger both chatbots to give a closing statement.

      2. AI Judge: Add another button “Judge”, which will invoke a third chatbot to serve as the judge, and evaluate both sides on their performance. Note that to make this happen, you would have to store all the messages from both chatbots in a list or table.

      3. Other Debate Formats: You can modify the flow to accommodate other debate formats, such as Lincoln-Douglas Debate, Public Forum Debate, and Congressional Debate.

      4. User Interaction: You can add another button for the user to input a new question, and have both chatbots answer that question.

      5. Other Applications: You can create a similar project for other applications, such as a buyer and a seller negotiating the price of some product, a conversation between an interviewer and an interviewee, 2 hosts of a podcast discussing an interesting topic, etc.

      1 Reply Last reply Reply Quote 1
      • Pinned by  info-creaticode info-creaticode 
      • First post
        Last post