Custom Character Menu/Creation in Ren'Py

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
averytireddad
Newbie
Posts: 19
Joined: Thu Jun 28, 2018 1:30 am
Completed: None yet
Projects: The Human Race
Contact:

Custom Character Menu/Creation in Ren'Py

#1 Post by averytireddad » Thu Jun 28, 2018 2:04 am

Hello everyone! For a little bit of background, I'm very new to Ren'Py, I just downloaded it a few days ago after developing a bit of an idea I had for a dating sim with my original characters in it. I also just signed up here to ask a few questions. What I am working on is essentially a project that I am hoping will help further my game design, art, and coding skills. That being said, I am not the best when it comes to code, I know a little bit of python but not much. I've been coding my game a bit now and I am doing fine with things such as allowing the player to make different choices in response to dialogue from a character in the game, and then creating different branches of the story and recombining them.

I've got myself pretty set on adding a character creator to my game. I want to show the player character when he or she has dialogue, along with showing the characters in game next to them when they have dialogue as well. I know how to do this itself, putting images in the game and making them show up or disappear at certain times, but what I do not know how to do is making the character creator.

I would like to have a character creator menu, one where you can pick one out of a few different body types (maybe different face shapes as well, different hairstyles, eye shapes, clothing, accessories, facial hair, etc. Obviously things like facial hair I don't absolutely HAVE to have in the game, these are just examples of things I would ideally like to include in the character creator. In the character creator menu I want you to be able to see your character as you change their look, I also would like to have buttons for each different thing you can change about your character (hair, face, body, etc.), and when you click on each button, it shows the different options of clothing, face shapes, and whatever respective to whichever button you pressed. Of course I would also need help to make sure that however the player customized their character, that is the way it would show up in game. I don't want to make it so you can turn your character to see them from different views or anything like that, I just want to be able to make the player character customizable so the player can feel more immersed in my game, and it adds a nice touch to a game like the one I am working on as well.

So, is there anybody out there who would maybe be able to help me out with the code when it comes to making something like this? Like I said before, I am not that experienced when it comes to coding and could really use some help! I do not require any help with the art, such as drawing the different body types or hairstyles or faces for the character creator, I can handle all of that on my own. What I need is someone who can help me with coding to make a menu for character creation at the start of my game. I've already browsed many different forums over the past couple of days, watched lots of different videos and anything else I can find that relates to this topic, but I still have no idea what to do or where to start. Help with this would be greatly appreciated!!

I'm sorry this post was so long! I just wanted to make sure I am clear with what I am asking for anyone who happens to read this, and anyone who could possibly help me with this code. Thanks!

averytireddad
Newbie
Posts: 19
Joined: Thu Jun 28, 2018 1:30 am
Completed: None yet
Projects: The Human Race
Contact:

Re: Custom Character Menu/Creation in Ren'Py

#2 Post by averytireddad » Thu Jun 28, 2018 2:46 am

Oh, and I forgot to mention I will want to have an area at the top of the character creator where the player can enter their name, but that was probably already pretty self explanatory :)

kivik
Miko-Class Veteran
Posts: 786
Joined: Fri Jun 24, 2016 5:58 pm
Contact:

Re: Custom Character Menu/Creation in Ren'Py

#3 Post by kivik » Thu Jun 28, 2018 4:29 am

I'm going to be a bit blunt and honest here, please don't take this the wrong way - it's in no way meant as an attack, more "honest advice from experience". I think you should either start with something much simpler, and learn to code with Renpy first, before attempting something this ambitious; or find yourself a developer who's familiar with Renpy or is experienced enough that they can pick it up quickly

What you're asking for is absolutely doable in Renpy, but it requires a lot of different knowledge. You need to learn the following in order to make it work:
- screen language to build a UI for the character creator - https://www.renpy.org/doc/html/screens.html
- layeredimage which is a new Renpy 7.0 feature and a lot of us are still experimenting and learning it - https://www.renpy.org/doc/html/layeredimage.html
- dynamic images which has been around for a bit longer, it allows you to use variables directly in your images using text interpolation (it's not that complicated) - https://www.renpy.org/doc/html/displaya ... splayables
- use of variables

The screen language part is probably the hardest to start with, since what you're trying to do involves the use of screen variables (to preview the results) and screen actions that sets the variables. It's a lot easier if you already have some experiences with Renpy screen languages to start with.

This is ignoring the fact that you'd have to create all the image assets, for your first ever game! That's a huge amount of work for your first game if you haven't got much coding experience.

So once again, my advise would be: either start smaller and ditch this element of the game, or partner up with a coder :)

averytireddad
Newbie
Posts: 19
Joined: Thu Jun 28, 2018 1:30 am
Completed: None yet
Projects: The Human Race
Contact:

Re: Custom Character Menu/Creation in Ren'Py

#4 Post by averytireddad » Thu Jun 28, 2018 1:45 pm

kivik wrote:
Thu Jun 28, 2018 4:29 am
I'm going to be a bit blunt and honest here, please don't take this the wrong way - it's in no way meant as an attack, more "honest advice from experience". I think you should either start with something much simpler, and learn to code with Renpy first, before attempting something this ambitious; or find yourself a developer who's familiar with Renpy or is experienced enough that they can pick it up quickly

What you're asking for is absolutely doable in Renpy, but it requires a lot of different knowledge. You need to learn the following in order to make it work:
- screen language to build a UI for the character creator - https://www.renpy.org/doc/html/screens.html
- layeredimage which is a new Renpy 7.0 feature and a lot of us are still experimenting and learning it - https://www.renpy.org/doc/html/layeredimage.html
- dynamic images which has been around for a bit longer, it allows you to use variables directly in your images using text interpolation (it's not that complicated) - https://www.renpy.org/doc/html/displaya ... splayables
- use of variables

The screen language part is probably the hardest to start with, since what you're trying to do involves the use of screen variables (to preview the results) and screen actions that sets the variables. It's a lot easier if you already have some experiences with Renpy screen languages to start with.

This is ignoring the fact that you'd have to create all the image assets, for your first ever game! That's a huge amount of work for your first game if you haven't got much coding experience.

So once again, my advise would be: either start smaller and ditch this element of the game, or partner up with a coder :)
Hey, thank you so much! I know what I am asking is a lot to do, I have made other smaller games before and wanted to move on to something bigger! I'm pretty determined to make this work for my game, even if it is a lot of work that I have to put in and a lot that I have to learn, luckily I am on summer break from high school and still have a lot of free time to work on things like this. I really appreciate your help with this and everything you've included in your reply, I'll definitely be looking into what you sent me more and doing my best to learn this stuff. And I appreciate your honest reply, I know it is a lot to do! That really is what I needed, thank you so much for your help!

This really helps a lot, I think I'll be able to begin learning and hopefully creating the different image assets I need for this- Any other advice on this subject is really appreciated!

kivik
Miko-Class Veteran
Posts: 786
Joined: Fri Jun 24, 2016 5:58 pm
Contact:

Re: Custom Character Menu/Creation in Ren'Py

#5 Post by kivik » Thu Jun 28, 2018 2:25 pm

Ok, I'd suggest you start by thinking about how you'll break down your assets. The medium in which you create them influences what's easy / possible: for example hand drawn would be the most flexible, but if you use renderers then it'd be a bit trickier to get good looking layeredimages since you can't as easily isolate assets on a 2D plane.


Experiment a bit, think about what will be achievable - e.g. hair, eyes, face shape, body shape, outfit etc. Bear in mind that if you want to do expressions as well, it'll increase your overall asset count, so be realistic.

Make sure you can actually isolate them well and put them back together - not just in Photoshop / GIMP, but in Renpy using the layeredimage feature. Since Renpy uses OpenGL / DirectX, you may find some weird lines when you if you cut out your image layers (in my case, I spliced my character into a head and body sprite and put them back together, and got some black lines where the slicing occured) - make sure each layer's filled out (e.g. head is solid and not got a hole for the face in it).

If you're happy with the result, then start playing with the variables and filenames. For each layer, create a variable for it, test out dynamic images inside your layeredimage to see if it works.

Finally, creating your UI. Assuming you're familiar with the screen language by now, you can setup your UI however you like, maybe with buttons that rotates the available option for each layer. You want to use the SetVariable screen action: https://www.renpy.org/doc/html/screen_a ... etVariable Make sure to use it like this:

Code: Select all

action SetVariable("variable_name", value)
If you're doing a kinda carousel / rotation option menu, you can make your buttons do this (untested):

Code: Select all

define hair_types = ["bald", "short", "long"]
default hair_type = "bald"

...

# screen code here

textbutton "Previous":
    action SetVariable("hair_type",  hair_types[(hair_types.index(hair_type)-1)%len(hair_types)]
textbutton "Next":
    action SetVariable("hair_type",  hair_types[(hair_types.index(hair_type)+1)%len(hair_types)]
The idea here is that you've got hair_types as a list of possible hair_types. You set the hair_type to something. hair_types.index(hair_type) gives you the current index, so you add 1 to it, then mod it by the length of the list to either roll it back to the start, or back to the end if you're subtracting.

You can set your screen to be on one side of the game window, and show the layeredimage on the other side to show the live changes as you make these adjustments.


Adding the name input is just a case of using the screen input: https://www.renpy.org/doc/html/screens.html#input

That should (I think) be everything you technically need to know, besides learning the screen language itself!

averytireddad
Newbie
Posts: 19
Joined: Thu Jun 28, 2018 1:30 am
Completed: None yet
Projects: The Human Race
Contact:

Re: Custom Character Menu/Creation in Ren'Py

#6 Post by averytireddad » Thu Jun 28, 2018 2:35 pm

kivik wrote:
Thu Jun 28, 2018 2:25 pm
Ok, I'd suggest you start by thinking about how you'll break down your assets. The medium in which you create them influences what's easy / possible: for example hand drawn would be the most flexible, but if you use renderers then it'd be a bit trickier to get good looking layeredimages since you can't as easily isolate assets on a 2D plane.


Experiment a bit, think about what will be achievable - e.g. hair, eyes, face shape, body shape, outfit etc. Bear in mind that if you want to do expressions as well, it'll increase your overall asset count, so be realistic.

Make sure you can actually isolate them well and put them back together - not just in Photoshop / GIMP, but in Renpy using the layeredimage feature. Since Renpy uses OpenGL / DirectX, you may find some weird lines when you if you cut out your image layers (in my case, I spliced my character into a head and body sprite and put them back together, and got some black lines where the slicing occured) - make sure each layer's filled out (e.g. head is solid and not got a hole for the face in it).

If you're happy with the result, then start playing with the variables and filenames. For each layer, create a variable for it, test out dynamic images inside your layeredimage to see if it works.

Finally, creating your UI. Assuming you're familiar with the screen language by now, you can setup your UI however you like, maybe with buttons that rotates the available option for each layer. You want to use the SetVariable screen action: https://www.renpy.org/doc/html/screen_a ... etVariable Make sure to use it like this:

Code: Select all

action SetVariable("variable_name", value)
If you're doing a kinda carousel / rotation option menu, you can make your buttons do this (untested):

Code: Select all

define hair_types = ["bald", "short", "long"]
default hair_type = "bald"

...

# screen code here

textbutton "Previous":
    action SetVariable("hair_type",  hair_types[(hair_types.index(hair_type)-1)%len(hair_types)]
textbutton "Next":
    action SetVariable("hair_type",  hair_types[(hair_types.index(hair_type)+1)%len(hair_types)]
The idea here is that you've got hair_types as a list of possible hair_types. You set the hair_type to something. hair_types.index(hair_type) gives you the current index, so you add 1 to it, then mod it by the length of the list to either roll it back to the start, or back to the end if you're subtracting.

You can set your screen to be on one side of the game window, and show the layeredimage on the other side to show the live changes as you make these adjustments.


Adding the name input is just a case of using the screen input: https://www.renpy.org/doc/html/screens.html#input

That should (I think) be everything you technically need to know, besides learning the screen language itself!
Once again, thank you so much for this! I honestly didn't expect to get such great help with this, and I really appreciate it. I'll be working on this project for a while to make it the best it can be, and it means a lot that you've helped me out! I will definitely be using hand drawn assets, so hopefully that will make things easier.
If there is anything else you think I should know, please feel free to tell me!

Post Reply

Who is online

Users browsing this forum: Bing [Bot], Google [Bot], span4ev