This commit is contained in:
Joe 2026-02-02 12:08:47 -06:00
parent a9b4f8e83b
commit e6efc04756
8494 changed files with 495610 additions and 0 deletions

View file

@ -0,0 +1,109 @@
---
title: Code the story
description: Part of the Story Games series that teaches you to code in Roblox. Use string variables and concatenation to code the story script.
next: /education/build-it-play-it-story-games/finish-and-add
prev: /education/build-it-play-it-story-games/second-challenge
---
After the player answers all of the questions, they'll get to see their answers combined with the story. The story will also be stored in a variable using strings and then be combined with the strings holding the player's answers.
## Code the first string
Remember the first sentence you wrote for the story? Time to add that into the code.
1. Make sure the playtest is stopped.
2. Go back to the script by clicking on the StoryManager script tab above the game editor. If you don't see the script, look at the Explorer, find StoryManager, and double click it.
3. Under where you typed the question, create a new variable named `story`. Make sure the variable name is **lowercase**.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story
-- =============================================
end
```
4. To find the first string, go back to the original story. Circle or highlight everything **before** the first placeholder. If your variable happens to be in the middle of a sentence, the rest can be added later.
**Original Placeholder**: _In a tree on a hill, lives the great wizard_ name1.
5. Have the story variable store the string like below. Make sure to add a space after the last word but before the quotation mark.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story = "In a tree on a hill lives the great wizard "
-- =============================================
```
## Add the name
Next, the first string of the story needs to be combined with the player's answer. Combining things together is called **concatenation**. To combine the two strings together, use `..`
1. On the same line as the story variable, type ..
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story = "In a tree on a hill lives the great wizard " ..
-- =============================================
```
2. Still on the same line, type the name of the variable holding the player's answer.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story = "In a tree on a hill lives the great wizard " .. name1
-- =============================================
```
## Show the story
Now that the story is typed, it needs to be shown to players. T
1. Under the second dashed line, find `storyMaker:Write()`. Between the `()`, type the variable `story`. This tells the program to write the story in the game.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story = "In a tree on a hill lives the great wizard " .. name1
-- =============================================
-- Add the story variable between the parenthesis below
storyMaker:Write(story)
```
2. Playtest the game. You should see the two strings (show by different colors in the picture below) combined together.
<img src="../../assets/education/story-games/wcc2018_annotatedStory.png" />
### Troubleshooting tips
If the sentence didn't show up, try one of the following.
**If the question is not being asked**:
- Check that the question is inside of quotation marks.
**If the story is combined**:
- The first part of the story is inside of quotation marks.
- The name of the variable holding the player answers matches exactly. Capitalization counts!
- The name of the variable holding the player's answer is not inside of quotation marks.
- The two strings are separated by `..`
**If the story doesn't appear**:
- Look at `storyMaker:Write()`. Check that in between the `()` is the `story` variable.

View file

@ -0,0 +1,97 @@
---
title: Code a question
description: Part of the Story Games series that teaches you to code in Roblox. Code the first question asked to players.
next: /education/build-it-play-it-story-games/test-and-save
prev: /education/build-it-play-it-story-games/start-coding
---
Remember how you wrote a sentence for your story, then swapped a word out for a placeholder? It's time to give players a chance to add something to your experience.
In the script, the placeholder you made will be a **variable**. In coding, variables are placeholders for information, in this case a word.
You'll start by asking players a question. Then, they'll type in an answer that gets **stored** in the variable.
## Create a variable
Variables have names that tell programmers what they store. In this case, you'll create a variable called `name1` for the placeholder.
1. Click below the dashed lines and type `local name1`.
```lua
-- GLOBAL VARIABLES
local storyMaker = require(script:WaitForChild("StoryMaker"))
-- Code controlling the game
local playing = true
while playing do
storyMaker:Reset()
-- Code story between the dashes
-- =============================================
local name1
-- =============================================
-- Add the story variable between the parenthesis below
storyMaker:Write()
-- Play again?
playing = storyMaker:PlayAgain()
end
```
## Set a variable
Now players need to have a chance to put something inside the placeholder. To change a variable, it needs to be **set** to something using the **=** symbol.
1. After `name1`, make sure to add a space and then type `=`.
```lua
while playing do
storyMaker:Reset()
-- Code story between the dashes
-- =============================================
local name1 =
-- =============================================
-- Add the story variable between the parenthesis below
storyMaker:Write()
end
```
2. After the equal sign, type `storyMaker:GetInput()`. The code must be typed exactly as is, and capital letters must match.
```lua
while playing do
storyMaker:Reset()
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput()
-- =============================================
-- Add the story variable between the parenthesis below
storyMaker:Write()
end
```
## Type a question
Variables can store different types of data including small numbers, true or false values, and strings. **String** type variables are special because they can store whole sentences. It's easy to spot string type variables because they're always in quotation marks "like this".
The question to ask players will be a string variable.
1. In `GetInput()`, click **between** the parentheses. Inside type a question enclosed by quotation marks.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
-- =============================================
end
```

View file

@ -0,0 +1,35 @@
---
title: Complete the challenge
description: Part of the Story Games series that teaches you to code in Roblox. Learn how to share an experience in Roblox.
prev: /education/build-it-play-it-story-games/third-challenge
---
<img src="../../assets/education/story-games/wcc_heroOverhead.jpg" width="100%" />
**Congratulations**, you just finished the latest Roblox Creator Challenge!
Now that you've completed the experience, here are a few ideas to take your experience further and keep learning.
## Share your experience
One of the most exciting features of Roblox is that it's really easy to share your experience with connections. Currently your experience is probably private, meaning only you can play it. For your connections to see the experience, you need to make it public.
1. Select **File** (top left of Studio) and click **Experience Settings**.
1. On the left bar, select **Permissions**, then choose **Public**.
1. Click the **Save** button.
1. In the top right of Studio, click on the **Share** button. A pop-up menu displays.
1. Click the **Copy Link** button, then share the link with your connections.
## Add more to the story
Although you completed the challenge, there's always more that you can add into the story.
Here are a few ideas:
**Add More Characters** – Think of one or two more characters in your story. Remember to create a new variable for each character, like name2 or name3.
**Add More Lines** – Write down a new sentence for your story and pick an object you can replace.

View file

@ -0,0 +1,112 @@
---
title: Finish and add more
description: Part of the Story Games series that teaches you to code in Roblox. Continue adding more to the story script.
next: /education/build-it-play-it-story-games/third-challenge
prev: /education/build-it-play-it-story-games/code-the-story
---
<img src="../../assets/education/story-games/wcc_heroUsing.jpg" width="100%" />
You're **almost** done with the project!
What's left is to complete the first sentence, then add in another question to give players some more choice.
## Finish the sentence
To add more words or punctuation to the sentence, add another string using concatenation.
1. On the same line as the story variable, type `..`
2. Add another string containing the rest of the sentence, or just punctuation. Don't forget to add an extra space at the end of the sentence.
```lua
-- Code story between the dashes
-- =============================================
local name1 = storyMaker:GetInput("What is your favorite name?")
local story = "In a tree on a hill lives the great wizard " .. name1 .. ". "
-- =============================================
```
## Add a second question
To ask a second question, create a new question and keep adding to the same variable holding the story.
1. Decide what word to delete from the second sentence in your story.
**Original Placeholder:** _Every morning, the wizard loves eating a giant bowl of honey roasted_ **food1**.
2. Beneath the first variable, create a new variable to act as a placeholder.
```lua
local name1 = storyMaker:GetInput("What is your favorite name?")
local food1
local story = "In a tree on a hill lives the great wizard " .. name1 .. ". "
```
3. Use `storyMaker:GetInput("")` to ask the player a question and store their answer.
```lua
local name1 = storyMaker:GetInput("What is your favorite name?")
local food1
local story = "In a tree on a hill lives the great wizard " .. name1 .. ". "
```
4. In the story variable, concatenate the next story string using `..` Be sure to include a space after the end of the sentence.
```lua
local name1 = storyMaker:GetInput("What is your favorite name?")
local food1 = storyMaker:GetInput("What is your favorite food?")
local story = "In a tree on a hill lives the great wizard " .. name1 .. ". " .. "Every morning, the wizard loves eating a giant bowl of honey roasted "
```
<Alert severity="info">
You may need to scroll in the code editor window to the right for longer sentences.
</Alert>
5. After the new story string, concatenate the answer for the second question and finish with punctuation.
```lua
local name1 = storyMaker:GetInput("What is your favorite name?")
local food1 = storyMaker:GetInput("What is your favorite food?")
local story = "In a tree on a hill lives the great wizard " .. name1 .. ". " .. "Every morning, the wizard loves eating a giant bowl of honey roasted " .. food1 .. ". "
```
## Optional additions
If you're interested in developing the story more, we've included some ideas. For example, some ways of improving the story include:
- Add more lines to your story
- Playtest the game every time you add a new set of variables and strings
- Ask a peer or friend on what other words they would like to customize.
Also, below are some **tips and tricks** to make stories for fun for players.
### Use variables more than once
Variables can be used more than once — just use concatenation between strings where you want to include the word(s).
**Example Code**:
`"I am " .. name1 .. " and you are in the palace of " .. name1 .. "!"`
**Result**:
I am Sameth and you are in the palace of Sameth!
### Add line breaks
Line breaks can be added by typing `\n` in a string. Also, more than one line break can be combined like `\n\n`.
**Example Code**:
`"One \n Two \n\n Three"`
**Result**:
One
Two
<br />
<br />
Three

View file

@ -0,0 +1,12 @@
---
title: First challenge
description: The first part of the Story Games series that teaches you to code in Roblox. Complete a quiz to earn a free Roblox avatar prize.
next: /education/build-it-play-it-story-games/start-coding
prev: /education/build-it-play-it-story-games/opening-the-template
---
Test your knowledge and earn the first of three prizes by clicking the button below to open a Roblox quiz game. After earning your prize, come back here to continue the lesson.
<a href="https://www.roblox.com/games/2546610365/Roblox-Creator-Challenge">
<Button variant="contained">Take the Challenge</Button>
</a>

View file

@ -0,0 +1,61 @@
---
title: Story Games project
description: Learn to code in Roblox with this word game. Script your first experience and learn about variables and computer science.
next: /education/build-it-play-it-story-games/writing-the-story
prev:
---
In Roblox Story Games, words are going missing and it's up to players to fill in the blanks! Participate in the **Hour of Code**™ by coding your own story game using Roblox's free coding and design tools. Prove your coding knowledge to earn exclusive badges and avatar items.
Play the video below to see the library you'll be working in and the game in action.
<video controls src="../../assets/education/story-games/wccVideo_final_wSound.mp4" width="100%"></video>
### Your coding journey
You'll create your story game by going through three different lessons. Each lesson will have instructions teaching you how to code your game from start to finish.
After finishing a lesson, you'll get the chance to earn prizes by playing a quiz game on Roblox. After earning the prize, come back and continue the next lesson.
<GridContainer numColumns="3">
<figure>
<img src="../../assets/education/story-games/wcc_lessonThumbnail_1.png" />
<figcaption>1: Creating Variables</figcaption>
</figure>
<figure>
<img src="../../assets/education/story-games/wcc_lessonThumbnail_2.png" />
<figcaption>2: Getting Player Answers</figcaption>
</figure>
<figure>
<img src="../../assets/education/story-games/wcc_lessonThumbnail_3.png" />
<figcaption>3: Telling the Story</figcaption>
</figure>
</GridContainer>
After finishing a lesson, you'll get the chance to earn prizes by playing a quiz game on Roblox. Once you earn a prize, come back and continue the next lesson.
<img src="../../assets/education/story-games/wcc2018_quizGameExample_900x500.jpg" width="75%" />
## Get Roblox Studio ready
**Roblox Studio** is used to make every game you see on Roblox. If you already have Roblox Studio installed, login and click the Next button at the bottom of this page.
1. Download and install Roblox Studio.
<a href="https://www.roblox.com/create">
<Button variant="contained">Download Studio</Button>
</a>
2. After installing, double-click the desktop icon (Windows) or click the dock icon (Mac).
3. On the login screen, enter your Roblox username and password, then click **Log In**.
<Alert severity="info">
If you're new to Roblox and are <a href="https://www.roblox.com/home">signing up</a> for the first time, remember these safety tips:
- **Never share your password**, even with a real life friend.
- **Make your password hard to guess** — If your username is "bloxdev," your password should not be "bloxdev123."
- **Roblox employees will never ask for your password** — Report anyone who asks using the Report Abuse feature.
- **There's no such thing as free Robux** — Never trust players or sites who say they have a secret way to get free Robux!
For more tips, please see <a href = "https://en.help.roblox.com/hc/en-us/articles/203313380-Account-Security-Theft-Keeping-your-Account-Safe-" >Keeping Your Account Safe</a>.
</Alert>

View file

@ -0,0 +1,35 @@
---
title: Open the template
description: Part of the Story Games series that teaches you to code in Roblox. Open the template used to code the story game experience.
next: /education/build-it-play-it-story-games/first-challenge
prev: /education/build-it-play-it-story-games/writing-the-story
---
With the story created, it's time to turn that vision into code using Roblox.
## Start Roblox Studio
The experience will be created using **Roblox Studio**. It's free to use and can instantly publish games to iPhone, Android, Xbox Live, PC, Mac, and VR.
1. Open **Roblox Studio** by double-clicking the it's icon on the desktop (Windows) or clicking the dock icon (Mac).
2. On the login screen, enter your Roblox username and password, then click Log In.
## Open the template
A template has been created that has everything needed for the experience to work, except the code for the actual story. Templates are pre-made worlds that you can use as a base for your own experiences.
1. Download the template.
<a href="../../assets/education/story-games/Story_Games_Template.rbxl">
<Button variant="contained">Download Template</Button>
</a>
2. In Roblox Studio, in the top left, click **File** &rarr; **Open from File** and select the downloaded file.
## Close extra windows
The first time you launch Roblox Studio, extra windows might open up that you don't need right now. Closing the extra windows will give you more space to see what you're doing.
1. Close each window on the **left** of the 3D view by clicking the **&times;** in the window's upper-right corner. If you don't see anything to close on the left, go to the next step.
2. Leave the **Explorer** and **Properties** windows open on the right side of Studio.

View file

@ -0,0 +1,12 @@
---
title: Second challenge
description: The second part of the Story Games series that teaches you to code in Roblox. Complete a quiz to earn a free Roblox avatar prize.
next: /education/build-it-play-it-story-games/code-the-story
prev: /education/build-it-play-it-story-games/test-and-save
---
Test your knowledge and earn the first of three prizes by clicking the button below to open a Roblox quiz game. After earning your prize, come back here to continue the lesson.
<a href="https://www.roblox.com/games/2546610365/Roblox-Creator-Challenge">
<Button variant="contained">Take the Challenge</Button>
</a>

View file

@ -0,0 +1,46 @@
---
title: Start coding
description: Part of the Story Games series that teaches you to code in Roblox. Open the script used to manage the experience.
next: /education/build-it-play-it-story-games/coding-a-question
prev: /education/build-it-play-it-story-games/first-challenge
---
In Roblox, code is typed inside of **scripts** using the coding language [Luau](https://luau.org). Games often have separate scripts for each thing the game needs to do. The library template already has a script named **StoryManager** which you'll add more code to for your word game.
## Find the StoryManager
1. In the **Explorer** window, click the arrow next to **StarterGUI** to see everything beneath it.
2. Click the arrow next to **GameGUI** to expand that section.
3. Double-click the **StoryManager** script to open it.
<img src="../../assets/education/story-games/StoryManager.png" width="40%" />
## Script contents
The script already contains some of the code that's necessary for showing the completed story to the player. All of the code you create will be typed below the dashed lines.
For now, notice how a large portion of the script starts with the `--` symbol. Lines of code starting with `--` are called **comments**. These are used to leave notes for coders and don't change the way a program runs.
```lua
-- GLOBAL VARIABLES
local storyMaker = require(script:WaitForChild("StoryMaker"))
-- Code controlling the game
local playing = true
while playing do
storyMaker:Reset()
-- Code story between the dashes
-- =============================================
-- =============================================
-- Add the story variable between the parenthesis below
storyMaker:Write()
-- Play again?
playing = storyMaker:PlayAgain()
end
```

View file

@ -0,0 +1,67 @@
---
title: Test and save
description: Part of the Story Games series that teaches you to code in Roblox. Save and publish the experience in Roblox Studio.
next: /education/build-it-play-it-story-games/second-challenge
prev: /education/build-it-play-it-story-games/coding-a-question
---
This is a good point at which to check your code and make sure it runs. Testing your code often makes it easier to figure out where you might have made a mistake.
1. Test your by code by clicking the **Play** button.
<img src="../../assets/education/general/play-button.png" width="360" />
2. Walk up to the pedestal using <kbd>W</kbd> <kbd>A</kbd> <kbd>S</kbd> <kbd>D</kbd> on your keyboard and press <kbd>E</kbd>.
<table>
<thead>
<tr>
<th>Control</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td><kbd>W</kbd></td>
<td>Moves the camera forward.</td>
</tr>
<tr>
<td><kbd>S</kbd></td>
<td>Moves the camera back.</td>
</tr>
<tr>
<td><kbd>A</kbd></td>
<td>Moves the camera left.</td>
</tr>
<tr>
<td><kbd>D</kbd></td>
<td>Moves the camera right.</td>
</tr>
<tr>
<td><kbd>Spacebar</kbd></td>
<td>Your playable character jumps.</td>
</tr>
<tr>
<td>Hold and drag the <kbd>Right Mouse Button</kbd></td>
<td>Moves the camera view around.</td>
</tr>
</tbody>
</table>
3. Check to see if your question is displayed. **Don't** try to answer the question or click the "Submit" button. The code for that isn't made yet.
<img src="../../assets/education/story-games/StoryExample.png" width="80%" />
4. **Stop** the playtest.
<img src="../../assets/education/general/stop-button.png" width="360" />
## Save your code
It's important to save the whole project by **publishing** it to Roblox. It's a good idea to publish every ten minutes while you're working or after making a big change.
1. Select **File** → **Publish to Roblox** to open the publishing window.
2. Enter a place name and an optional description.
3. When ready, click the **Create** button. Once published, games can be edited from any computer since they're connected to your account.

View file

@ -0,0 +1,12 @@
---
title: Third challenge
description: The third part of the Story Games series that teaches you to code in Roblox. Complete a quiz to earn a free Roblox avatar prize.
next: /education/build-it-play-it-story-games/complete-the-challenge
prev: /education/build-it-play-it-story-games/finish-and-add
---
Test your knowledge and earn the first of three prizes by clicking the button below to open a Roblox quiz game. After earning your prize, come back here to continue the lesson.
<a href="https://www.roblox.com/games/2546610365/Roblox-Creator-Challenge">
<Button variant="contained">Take the Challenge</Button>
</a>

View file

@ -0,0 +1,36 @@
---
title: Write the story
description: Part of the Story Games series that teaches you to code in Roblox. This section is brainstorming ideas for a story.
next: /education/build-it-play-it-story-games/opening-the-template
prev: /education/build-it-play-it-story-games/landing
---
## Brainstorm ideas
Before coding, write the story you'll use as the base of your game. The story can be about anything you wish.
To start, on a piece of paper or using a text editor, **write 2-3 sentences** for the opening paragraph. Here's a few story ideas to get you started:
- Your dream vacation
- What a wizard eats for breakfast
- A superhero's shopping trip
An example story is below:
_In a tree on a hill lives the great wizard Nia. Every morning, the wizard loves eating a giant bowl of honey roasted lizard leaf._
## Create placeholders
With an idea for a story, you can start the process of turning it into a game.
Remember, in your experience, players will type in words that **replace** key parts of your story. For this step, you'll find parts of the story that can be **placeholders**, where a player can add in their own input.
1. In the first sentence, pick a single word to be replaced by the player such as a name, action, or a noun. In this example, we'll select the wizard's name.
_In a tree on a hill lives the great wizard **Nia**._
2. Replace the word with a placeholder for what type of word you'll ask the player for. Since you might end up asking the player for more than one noun or adjective, number the playerholder.
_In a tree on a hill lives the great wizard **name1**._
With the sentence created, it's time to turn it into code!