【Renpy Guide#003】 Beginner Friendly Ren'py Basic Tutorial: Creating Your First Ren'py Story

Hello again! Today we will keep talking about renpy and today, we will create our first renpy story together!

First, this is what you will see in the original script.rpy after creating a project:

# You can write the game's script here.

# The image command can be used to define an image.
# eg. image eileen happy = "eileen_happy.png"

# The define command can define the character names and corresponding text colors that appear in the game.
define e = Character('Eileen')

# The game starts here.
label start:

    e "You have created a new Ren'Py game."

    e "When you add a story, images, and music, you can publish it to the world!"

    return

You can completely delete this section.

After deleting it all, let's start building a new plot!

Use Label to Group Dialogue

Before starting a new plot, you can mark the plots that belong together (like tags) with 「label」

Key Points:

• label can be used multiple times
• A colon must be added after each label XX (name) ":"
• Each label must be unique and should be only defined once in the whole project

• label start must appear in your project!

No matter where label start is in the project, the game will always start here!

So let's write label start first:

label start:

Creating the first dialogue

In Renpy, displaying dialogue is very simple. Just type "" and everything inside will be displayed to the player.

For example:

"Hello~ Nice to meet you!"

Creating / Defining Characters

The way it was written just now will not display the character's name. (("Hello~ Nice to meet you!"

If we want the character's name to appear in the dialogue box / in the name box, then we need to add the character's alias before the "" like this:

a "Hello~ Nice to meet you!"

However, this will not display properly yet, because Renpy does not know the alias "a". So we need to define the character first.

The statement used to define a character is "define".

The statement to define a character looks like this:

For Example:

define a = Character('Adam')

• The word inside "" is the character name that the player will see.

• So this character a = Adam
• Every time I type a, the player will see "Adam" talking / appear in the namebox

Now let's define 2 characters!

define a = Character("Person A")
define b = Character("Person B")

Now we have 2 characters in our renpy project!

Character dialogue

Since we know how to display plots and have characters, let's have these 2 characters have a conversation!

a "Hello, hello~ The weather is so nice today~"
b "Yes, that's right! I want to go out and play!"

Add images

It always feels like something is missing without images, so let's add some images! First, put the images you want to use in the "images" folder inside your game folder.

The path usually: renpy > "your custom project name" > game > images

I usually create subfolders in the images folder. You can also further subdivide them

For example, for backgrounds:

• Main character's room
• School
• Park ...
• etc.

Or subdivide them by character:

• Character 1
• Character 2
• Character 3 ...
• etc.

Then each folder only contains images about a certain character.

Defining images

This is not strictly necessary, but I will define the images first (sometimes I have multiple images with the same name, and I will define each one to make sure Renpy is using the correct image).

Image definition syntax:

image image_alias = "image_path"

Example:

image park = "images/bg/park.jpg"

Now that we know how to define images, let's define some images that we will need later!

image park = "images/bg/park.jpg"
image cha = "images/characters/a.png"
image chb = "images/characters/b.png"

This way, we defined 3 different images!

• Our background image -> park
• 1. Character sprite -> cha
• 2. Character sprite -> chb

Adding Character Sprites

Since we have defined the images, let's now bring in the sprites (character images) that we have defined!

show cha
a "Hello, hello~ The weather is so nice today~"
show chb
b "Yes, that's right! I want to go out and play!"

As you can see, the 2 images are now overlapping. The next thing we need to do is specify the position of the image!

Specifying Sprite Position

You can specify whether a sprite appears on the left, right, center, or define your own custom position.

So, if I want one image to appear on the left and the other on the right, I can use this code:

show cha at left
show chb at right

This way, the images won't overlap anymore.

Adding a background

Since we just defined the image park, let's use "park" as our background!

Adding an image is usually done with "scene"

Therefore, the code will look like this:

scene park

• In renpy, when you type "scene", it will remove all previously displayed images
• So every sprites or background displayed before will disappear

Making a character exit

If you want a single character to exit in renpy, you can use "hide".

hide xx (sprite alias)

Example:

hide cha

This will make the first sprite disappear.

Command Summary

And we've finished today's post! Let's recap what we've learned.

Plain Text version (if table is not displable):

• Show dialogue: Everything between quotation marks will be displayed to the player.
• Show character name: Add a character alias before the quotation marks. Example: a "Hello, hello~ The weather is so nice today!"
• Begin a new plot:label XX:
  • Every project must have a label start:
  • Labels group related plots.
  • Names must be unique.
  • Labels can be called multiple times.

• Define character:define X = Character('name')
  • Character aliases must be unique.
  • The same name cannot be used multiple times.

• Add background image:scene xx - This will remove all previously displayed images.

• Add character sprite:show xx - By default, sprites appear in the top left corner.
• Define image: image image_alias = "image_path"
  • Aliases must be unique
  • Defining images isn't strictly necessary

• Set position:show XX at (left, right, center) - There are more default positions available.

FAQ: Some Common Questions

1. How to make text appear in Renpy?

• Just type "" and write the text you want to show to player inside the quotations.

Example:

"Hello! How are you?"

2. How to change the color of the text?

You can do this in "gui.rpy", there you should be able to find this code:

define gui.text_color = xxx

Example: define gui.text_color = '#efeeee'

And you just need to change the color code inside ""

3. How to italicize or bold dialogue in Renpy?

You can add kind of tag bewteen the text you want to italicize or bold:

• {i}italics{/i}
• {b}bold{/b}

Example:

"{i}Hello{/i}! {b}How are you?{/b}"

You can also change the text font, text size or text colour inside a sentence, you can even styling every single world one by one with kind of text tag but this would be the topic in future's post. So today I won't go deep into it right now.

4. How do you make text on a new line in Renpy?

If you want a text / sentence to start in a new line, within a page (player does not need to click the screen again to forward), then you can add this tag

\n 

Example:

"{i}Hello{/i}! \n {b}How are you?{/b}"

5. Why isn't my image being displayed?

First, you should check if you've written the command or keyword correctly.

You can use either "show" or "scene" to display image

Then if you wrote the image tag correctly.

If you did not define the image before, then you can just write the filename (without the format e.g. png or jpg)

for example - if you have a file called park.png:

scene park
#or
show park

If you already defined it before, then you can use the name you defined before to show the image

Example:

You can define images like this:

image mybg1 = "images/park.png"
image character_happy = "images/happy.png"

Then you can show the images like this:

scene mybg1 
show character_happy 

So we're finished with today's post! Next post, we will keep exploring renpy and we will talk about the following topics:

• Choices / creating branching stories
• Defining variables
• Using variables
• Deciding which dialogue to show based on choices

Check last episodes:

• 【Renpy Guide#002】 Beginner Friendly Ren'py Basic Tutorial: Ren'py Launcher
• 【Renpy Guide#001】 Beginner Ren'py Tutorial for new Visual Novel Game Dev