CreatiCode XO (AI Assistant) - Explain To Me

[info-creaticode]

Introduction

 

CreatiCode XO is a coding assistant running in the CreatiCode playground. It is an AI chatbot trained to help K-12 students learn Scratch programming. It can help students and teachers in many tasks, such as answering questions and writing code.

The key benefit of using XO is to get personalized and timely help. You no longer need to wait to ask your teacher some quick questions. Instead, you can ask XO to help you anytime and get a response immediately.

In addition, learning to code with XO isn’t just about coding; it’s about developing essential skills for the future. You’ll learn how to ask questions clearly and thoughtfully analyze the responses you get. As AI assistants become a part of everyday life and work in the future, these skills will be invaluable. If you truly master how to use XO’s help, you can build any project you have ever dreamed of.

There are many ways to use XO, and in this tutorial, we will focus on how to ask XO to explain things to us.

 
 

Open and Close the XO Dialog

 

You can click the XO icon at the bottom right of the playground to open the XO dialog window. Here is how to enlarge its window and then close it:

 
 

Controls on the XO interface

 

Here is how to use the controls on the XO interface:

• send: The blue send button will send what you write in the text box to XO. You can also press the ENTER key to do so.

• microphone: Press down this button and hold it there to talk to the microphone, and when you release this button, what you said will be transcribed into text.

• info: This blue button with an “i” on it will send the prompt “Explain this program” to XO

• snapshot: This camera button will attach the snapshot of the current stage to the XO chat, so when you ask the next question, XO will be able to answer based on this snapshot. This is useful when you need to “show” XO what you see on the stage.

• reset: This red button allows you to clear all the chat history so you can start a new conversation. Why is this useful? When there is a long chat history, XO may get “distracted” if the conversations are not related to your current question. So, if you want to ask about something new, it is strongly recommended that you reset the chat first.

• Socratic Mode: This checkbox controls whether XO will respond using the “Socratic Method”. When it is checked, XO will refrain from giving you direct answers/solutions. Instead, it will provide hints or ask questions to guide you towards the answer yourself. Why is this useful? Based on learning theory, we learn best when we “struggle” a bit to find the answer ourselves; when the answer is handed to us without any of our effort, we often learn much less. In fact, teachers often choose to force this checkbox to be checked for students during a coding class. Another reason for using the Socratic Mode is that it often gives a much shorter answer, thus reducing the cognitive load for students.

 
 

Use XO’s Code

 

XO often includes example code in its responses. There are 2 ways for you to use that code:

1. “copy to editor”: This option will copy the example code directly into the code editor, and existing code in the editor will not be affected.
2. “replace existing stack”: When this option is selected, XO will try to find which existing stack of blocks is most similar to the example code in its response, and replace that stack with the example code. This is most useful when you ask XO to expand or fix some existing code. Note that you can undo this change if XO makes a mistake.

 

 
 

Explain How to Use a Block

 

When you wonder how to use any block, you can ask XO like “how to use the ‘for’ block”:

 
Note that XO will not only explain what the block does but also give you a simple example. You can directly copy the example code into the playground to run it and observe the result.

Note that you should make sure XO understands exactly which block you are referring to. For example, if we ask “how to use the touching block?”, then XO will not know whether you are referring to the “touching Sprite” block or “touching color” block.

Additional examples:

• Explain the “pen down” and “pen up” blocks
• Example of using the “initialize 3D scene” block
• How to use the “create clone of myself with ID” block?

 
 

Explain input parameters of a block

 

You can also use XO to learn how to set the input value for a specific block. For example:

 
It is important that you clearly specify which block and which input you are referring to. Here are some additional examples:

• For the “distance between xy” block, what’s the difference between “direct” and “manhattan”?
• How do you choose between “public” and “private” for the “save data with name” block?
• What is the “as” input for the “add button” block?

 
 

Explain how to do something

 

When you are not sure which block to use, you can simply ask XO how to do something, such as how to implement a feature or how to make the sprite do something. XO will provide a “worked example” with both commented code and explanations.

For example, this is the response you get for “how to draw a star?”:

 
Note that your request should be as specific as possible, since XO may make mistakes if it has to write a lot of code at once. For example, a very popular question XO receives is “Make a 3D Minecraft game”. That is way beyond the code XO can output at once. Instead, decompose the request into much smaller steps, such as

• I want to make a 3D Minecraft game. Can you tell me how to create a grass land?
• I’m making an AI chatbot. Show me how to add a chat window first.
• I am making a car race game. How to add a car?

Additional examples:

• How to create a 3D box?
• How to make a sprite disappear?
• How to move a sprite to a random place?
• How to hide a sprite?

 
 

Explain a concept

 

XO is also really good at making coding ideas clear, especially when you ask questions starting with “what is [name of something]?” So, if you were to ask, “what is a clone?”, here’s how it would explain it:

 
Additional examples:

• What is a loop?
• What is a variable?
• How to “refactor” my code?

 
 

Explain Code

 

There are times when you’re exploring someone else’s project and might not understand how it works. In fact, for most professional programmers, they spend most of their time modifying complex, existing projects rather than creating new projects.

This is a great opportunity to seek XO’s assistance. You can inquire about broader aspects, such as the interaction between sprites, or delve into more detailed queries about the purpose of a particular block or sequence of blocks.

Since XO can “see” the code in the editor, you can directly ask about them. However, XO can only see code blocks that are being used. So if a block is not attached to a “hat block”, which means it will never be triggered when the project runs, then it will be ignored by XO.

As an example, here is how to ask about user input handling in the “ChatGPT - Chat with Einstein” project:

Additional examples:

• What does this sprite do?
• What happens when it receives the “move” message?
• How is it handling key presses?

 
 

Use a Different Language

XO always responds in the same language as your input. If you use Spanish/Chinese/French, it will also show code blocks in those languages. Here is an example in Spanish:

 
 

Add your personal flavors

 

XO isn’t all serious when answering your questions. If you throw in a fun twist, XO often comes back with unexpected and enjoyable answers. You can assign a role to XO or yourself, or ask for an analogy in a specific field. For example, if you ask, “Explain what is a loop. I’m a pirate.”, here’s how it would respond:

 
The possible ways to twist your questions are endless. Here are some fun examples:

• “Explain what recursion is, using an analogy in cooking.”
• “Explain what a variable is as if I’m 5 years old.”
• “Explain what an event listener is. You are Harry Potter.”
• “Explain what a conditional statement is. Pretend we’re time travelers.”
• “Explain how to use clones. Assume I’m a chef.”
• “Explain what messages are used for. You’re a detective solving a case.”
• “Tell me about sprites. We’re astronauts on the International Space Station.”
• “What is a list in Scratch? Imagine we’re deep-sea explorers.”
• “Explain what a costume is. You’re a superhero with transformation powers.”
• “Explain what a sound effect is. Pretend we’re in a zombie apocalypse.”
• “Explain what sensing means. Assume I’m a medieval knight.”
• “Explain what an operator is. You’re an alien explaining Earth technology.”
• “Explain what a touch event is. Imagine we’re inside a video game.”
• “Explain what a backdrop is. You’re a wizard with a spellbook.”
• “Explain what a pen tool is. We’re on a spy mission.”
• “Explain what direction is. Pretend I’m a dragon hoarding knowledge.”
• “Explain what a boolean is. You’re a famous inventor from history.”
• “Explain what a custom block is. Imagine we’re running a circus.”
• “Explain what an animation is. You’re a comedian on stage.”
• “Explain why we have repeat blocks. You’re an ancient philosopher.”

 
 

Ask follow-up questions

 

Although all the examples above only show you how to start a discussion with XO, it is equally important to continue the discussion to keep “digging” more information out of the AI’s vast knowledge base.

Specifically, here are some strategies for asking follow-up questions:

• Refine your question: very often, XO may not precisely understand our question, so we may need to rephrase our question. For example, if we started with “how to use the repeat block”, we may follow up with “I meant the ‘repeat N times’ block”.

• Ask XO to explain its answer: When we get an answer from XO, it may only partially answer our question. It is often necessary to ask XO to further explain part of its answer. For example, suppose XO gives you an example program, but it uses a block you are not familiar with, then you should ask it to explain that block.

• Ask XO to try again: Sometimes you may not understand what XO is saying. It is perfectly normal for you to ask XO to try again. For example, you can simply say “try to explain again as if I’m 5 years old”, or “I still don’t get it, try again”.

 
 

Dealing with syntax errors

 

When XO’s answer includes example programs, it might make mistakes and use a block that does not exist. This is often called “hallucination”. This happens because XO sometimes does not know the correct blocks to use, or it is working on a big question, so it fails to pay attention to such details.

Fortunately, you can easily spot a syntax error when a block shows up in red. For example, in this program below, the last block is not recognized as a correct block from the “2D Physics” category, so it is colored red:

 
When this happens, don’t panic. There are 2 ways to solve this problem:

First, you can infer which blocks XO is trying to use. In this case, the incorrect block is trying to make the sprite behave like a circular object and setting its friction and restitution properties. If you look at the blocks in the 2D physics category, you can easily find that these 2 blocks should be used instead:

If that turns out to be difficult for you, you can also tell XO which block is wrong and ask XO to try again. For example, in this case, you can say: “The ‘behave as a dynamic object’ block in your program doesn’t exist.”, or, to give XO a bit of help, you can say “the behave as block does not have friction or restitution”. In response, XO should be able to focus its attention on this particular problem and rewrite the program with the correct block syntax.

 
 

Exercises

 

As an exercise, try to learn something completely new to you with XO’s help. Try to practice the techniques introduced above until you have learned the new skill or concept really well. To verify your learning, you can then try to explain it to a classmate or friend.

Here are some suggestions for what you can try to learn:

• How to show animations using costumes.
• How to use the for-loop block.
• How to make 3D boxes of different shapes and colors.
• How to add a “Start” button using widgets
• How to use “clone ID”

For another exercise, try to find some interesting projects on the Explore page and learn how they wok with XO’s help, such as these projects:

• Water Simulator: play.creaticode.com/projects/78337eed686831330f3879a0
• 3D Rubrik’s Cube: play.creaticode.com/projects/9b1fb6b3f92c5ad65cd645de

[The_True_Odst]

@info-creaticode

How do you make the AI give you a block visual? All it’s doing is giving me step by step orders that don’t make perfect sense or don’t exactly work

Edit 1: I’m telling it to give me examples/pictures of the blocks, but it’s not

[info-creaticode]

@011830-0a42ef84

It should be able to write code for you and display them visually. As shown above, when you ask “how to use the ‘for’ block”, it would show you an example program as visual blocks, and you can directly copy that into your playground.

If that doesn’t work for you, please share the prompt you are using, and we will investigate why.

Thank you
Bin