Ren'Py 101: Starting Out Part Iby Rio
Ren'Py is a wonderful way to make a ren'ai game for those who have little to no programming skills. For those of you who are intimidated or are clueless as where to begin, I'll be covering everything you need to know to make and put together your own basic ren'ai game from start to finish. This is a six part series of tutorials that will cover all the basics. After you're done reading through these tutorials, you can make a multiple path-based game or a points-based game.
With a little ingenuity and creativity, these two basic types will be all you need to know. Above all else, keep up to date with the ren'ai games coming out - they are your best sources of inspiration.
1. What's What: Folders and Files
I assume that you have Ren'Py already downloaded and extracted into your computer. If you haven't already, go and download the latest version. Out of everything listed, the ones you will actually touch are:
game folder - being the main folder where everything goes (audio, backgrounds, character images), you'll be in here a lot.
If you're curious what everything else does, here's a full list of what's what once you open the Ren'Py folder. Note: these are the files available in version 4.7.2. There may be changes in future versions.
Back to Dev Corner | Back to Top
2. Running the Game and Editing the Script File
Now that you know what's what, play the demo game! For Windows users, double click on the run_game.exe file. For Unix/Linux users, use the command "python run_game.py". For Mac users, run_game.pyw. If you encounter problems running the game, make sure you can run python and pygame. Mac users, download the supporting files listed under Step 1 in this page.
When you reach the part where Eileen suggests you open the script file, go into the game folder and open script.rpy. If a "Choose Program..." or "Open With..." window pops-up, I highly recommend you use SciTE text editor which features syntax highlighting, automatic indentation, and code folding. If you'd rather not, you can use Notepad or WordPad (particularly for Windows users).
On a side note, if you want to see the MPEG-1 feature on Ren'Py, you may download the Eisenhower.mpg file from here. Place it in the game folder and re-run the demo. You will now automatically be able to view this feature in action.
Now that you know how to run and open the script file, I suggest you take a look over the script file and read downwards. PyTom explains what certain sections of the coding is for with comments tags that start with the pound symbol (#). Try to see anything you may recognise and figure out on your own such as,
which is what controls the screen size of your game and the title on the window, respectively. The one thing about coding (especially good coding) it that all names and comment tags usually have an indication of what sections does so that when the original programmer hands over their work to another - that new person may readily pick it up.
To edit the script file, just work like you would on a word editing software. For those using WordPad - you must not use any of the formatting tools (i.e. paragraph, bullets, etc)! Some things to consider when writing your script:
*Some other editors such as SciTE are more lenient on some things such as allowing lines in label blocks to start at 0 indent but still adheres to the four-indent rule when it comes to other blocks like menu blocks. I highly suggest you get used to indenting for every block. For one, it's much easier to read your lines this way and for another, it's better to be consistent (i.e. you may forget to indent for other blocks).
2. Make sure you always have at least ONE blank line at the end of your script. This is necessary or else Ren'Py will throw out a traceback error at you.
3. Check your spelling, quotes, colons, and other signs. If the error is not caused by one of the above, then it is most likely spelling errors or the lack of or too many of the following signs. Errors will occur even from simplest typos such as typing "wtih" (wrong) instead of "with" (correct) or "labal" (wrong) instead of "label"(correct), etc.
Another way, is if you settle for just a single quote such as, "Bob" "What's with 'it', anyways?". You can also reverse the quotes and use single quotes on the outside and double quotes on the inside but if you have to use a single quote in the sentence, Ren'Py will count that as an error unless it's character escaped (i.e. \') or the word is spelled out. For example,
Another important fact: if you want to use a % in the text of your game, you have to double it to "%%". You cannot character escape it (i.e. \%) like with the quotes. An error will occur otherwise.
Some of the easier things that you don't have to worry too much about if an error occurs is if a music file is not present (Ren'Py will just not play it), and if an image such as a character or background is not in the folder or isn't declared (Ren'Py will just point it out on the screen). Of course, if you didn't correctly declare the images, Ren'Py will call you up on it.
Back to Dev Corner | Back to Top
3. The Init Block
The init block is called before the game starts. It sets up everything in the game such as the size of the window, interface sounds effects, position of buttons, how buttons look, and where important files are such as character images and backgrounds used within the game. For setting character images, backgrounds, character animations, and so forth, it will be covered in the next tutorial: Starting Out Part II.
The first things you have to determine is the screen size of your game, the window title, the main menu (where the player first enters) and game menu (for save/load/ and preferences) images, plus the all important dialogue box or "frame" as it is called in the coding.
To change the screen size, enter the relevant width and height after config.screen_width and config.screen_height. The usual screen sizes are 640x480, 800x600, and 1024x768 with 800x600 being the most used in ren'ai games. Change the window title to the title of your game. For everything that is in quotes (usually letters), make sure it stays in quotes.
For the menus and frames, all you really need to do is replace the image with new ones so you don't have to change the coding. But if you want to rename it differently, it is up to you. As we're talking about images, the types you will most likely and should only be using are .jpg, .png., and .gif. Any others are too big to be put into a game.
If you'd rather not use an image for your frame, you can set a solid color such as Solid((0, 0, 0, 255)) instead of Frame("frame.png", 125, 25). For more about color, jump to 5: Setting Colors. If don't want any image or color whatsoever, you can set it to "None" like so: $ style.window.background = None
Note: Depending on the computer (or OS, more specifically), it may be case sensitive to file names so make sure everything declared is as it appears on the file name. For example, if you declare "mainmenu.jpg" - make sure that file is named "mainmenu.jpg" and not "MainMenu.JPG" or you run the possiblity of the game not working for others.
Back to Dev Corner | Back to Top
4. Changing Menu Buttons, Save Slots, and the Preferences Menu
Changing the menu buttons are completely optional but it allows you to add that extra bit of customization and uniqueness to your game rather than using the defualt colors of Ren'Py. The following are only a few of the styles you may change. They are the settings used for Garden Society: Kykuit. I suggest you donwload the game if you would like visuals along with the instructions.
More in depth, fellow developer Chronoluminaire explains that the xpos and ypos are "a proportion of the distance across the screen, with 0.0 = top or left and 1.0 = bottom or right. ...(There is also a) difference between 1.0 (float = proportion = far right-hand side) and 1 (integer = absolute = 1 pixel from the left-hand side)... A number of artists may prefer to work entirely in absolute coordinates, ... (and that's) how that's done."
For example, when in the save or load mode, the backgrounds of the save files will be in black (with text in white) because it is idle. When the player goes and hovers over the save files, though, the hover mode is activated, and the background turns into white (with the text also changing into black).
prefs_label.color and yesno_label.color:
For a full list of all the styles you can edit, I suggest you open up the style.rpy file in the common folder. Do NOT directly change the settings of the files in the common folder! Should Ren'Py upgrade and the coding should change, you will find yourself doing a lot of backtracking to "fix" your game. Instead, enter the new style under the Init block of your script file.
Here's some other interesting game design topics at Lemmasoft Forum:
Back to Dev Corner | Back to Top
5. Setting Colors
Now that you have some familiarity with reading through the styles by yourself, let's take a closer look into setting the color. Setting the color of something will always require four sets of three-digit numbers. The first three numbers indicate the RGB (Red, Green, and Blue) values while the fourth number refers to Opacity or Transparency. The fourth number is always a 255, meaning, it's at maximum and is Solid. The lower this number, the more opaque the color becomes.
The first three numbers are what you have to worry about and change. Just by looking at the first three numbers, you can guess what color is dominant. For example, these are the "true" colors of red, green, and blue, respectively.
The closer the number is to 255, the more of that particular color is shown with 255 being all of that color and 0 being none of that color. When mixing colors, the closer each color is to 255 each, the more light the color becomes. For the color white, for example, all the numbers (or RGB) must be set to 255 each (example: 255, 255, 255, 255). For darker colors, the more each number is to 0, the darker it becomes. For true black, each color must be set to zero such as (0, 0, 0, 255).
For an easy to use color palette, feel free to use the Hue Color Chart below. It can also be found in the Development Corner page.
Hue Color Chart (245KB)