Best way to organize sprite images?

[malakme]

Hi everyone! I'm new to Ren'py so I know this might seem like a dumb or simple question, but I'm wondering what the best way to organize sprites might be. I've heard that depending on how you define an image, you can create sprite "families" or "groups"? I understand it conceptually, but not practically. My main questions are:

How do I define a sprite as a group of images for one character (as in a "family" of images including their expressions and clothing)?

How do I change between the expressions and clothing of sprites?

How do I determine where a sprite will appear on the screen?

If you have answers to any of these questions, or if there's a page I can look at for advice, please let me know. I've tried the "Layering Images" tutorial (https://www.renpy.org/doc/html/layeredi ... ered-image) but so far, I'm still not understanding if/how I can apply it to sprites.

Thanks in advance for any advice!

[Sunlit-Dreamer]

I just recently figured out the basics for layered images, so I'll do my best to explain. I will also recommend downloading the tutorial and going through it. Going through the files really helped me out.

https://tofurocks.itch.io/renpytut-layeredimage

Also give these links a looksy, reading through them helped me understand other details.

viewtopic.php?t=50663

viewtopic.php?t=50604

First, it's recommended you make a new file in your editor of choice. The tutorial had it saved as definitions.rpy. I save mine as sprites.rpy. (You MUST save the file as "yourfile.rpy". As in you need to type .rpy at the end.)

Next, in your images file make as many folders that you need for each character. Place everything inside for each character. You don't have to worry about putting "images/blahblahblah" to find the image. You only need the name.

To define your character, I'll post some of my code as an example.

Code: Select all

layeredimage luana:

    group body:
        attribute luana_base default:
            "luana_base"
        attribute darkbase:
            "luana_darkbase"

    group outfit:

        attribute torn:
            "luana_outfit_holes"

    group eyes:

        attribute openneutral:
            "luana_on_blinking"

        attribute openangry:
            "luana_oa_blinking"

        attribute opensad:
            "luana_os_blinking"

        attribute halfneutral:
            "luana_hn_blinking"

        attribute halfangry:
            "luana_ha_blinking"

        attribute halfsad:
            "luana_hs_blinking"

        attribute shock:
            "luana_s_blinking"

        attribute shocksad:
            "luana_ss_blinking"

        attribute tiny:
            "luana_t_blinking"

        attribute tinysad:
            "luana_ts_blinking"

        attribute fearsad:
            "luana_fs_blinking"

        attribute fearneutral:
            "luana_fn_blinking"

        attribute closedneutral:
            "luana_eyes_closed_neutral"

        attribute closedangry:
            "luana_eyes_closed_angry"

        attribute closedsad:
            "luana_eyes_closed_sad"

        attribute dopensad:
            "luana_dos_blinking"

        attribute dopenneutral:
            "luana_don_blinking"

        attribute dhalfsad:
            "luana_dhs_blinking"

        attribute dfearsad:
            "luana_dfs_blinking"

    group mouth:

        attribute smile:
            "luana_mouth_smile"

        attribute opensmile:
            "luana_mouth_opensmile"

        attribute frown:
            "luana_mouth_frown"

        attribute open:
            "luana_mouth_open"

        attribute smallopen:
            "luana_mouth_smallopen"

        attribute yell:
            "luana_mouth_yell"

        attribute dsmallopen:
            "luana_darksmallopen"

        attribute dfrown:
            "luana_darkfrown"

        attribute dopen:
            "luana_darkopen"
            
    group tears:

        attribute tears:
            "luana_emotion_tears_watering"
        attribute tears2:
            "luana_emotion_tears_running"

This is the basic way, there are ways to shorten the code. (But I haven't quite figured it out yet.) As you can see from my code, every image is named like so. "character_bodypart_variation". Emotions are treated the same way. An important detail to remember is to keep the name lowercase. It's mentioned in one of the lemmasoft links I've posted above.

Another detail to keep in mind is the order of the groups. The groups on top will be on the bottom, while the groups on the bottom will be on top.

Next, is the default. The default is how the sprite will appear for the first time if you type "show character" with nothing added. How do you change the expression/clothing? I'll show you a few examples.

Code: Select all

show waite base2 openangry2 yell2

Waite is now in his 2nd pose, and since I changed his pose I also changed his eyes and mouth. If I don't, the eyes and mouth from his first pose will be floating beside the base image.

Code: Select all

show luana open

Luana's mouth is now open, her eyes remain the same.

Code: Select all

show luana torn fearsad smallopen

Her outfit is now torn, and thus she's now afraid.

As show above, to change their pose, clothing, etc, you type in a single word. The word that'll be used is what you wrote in the attribute. So I recommend making it something easy to remember. Do I want Luana to frown in the dark? "dfrown". Choose what's best for you.

As for choosing where to place them.

Code: Select all

scene hall
    show luana closedneutral frown
    show waite openangry frown:
        xalign 0.75

Putting nothing when the sprite first appears will have them appear in the center. To choose a specific spot, I personally use xalign. But to make things easier, it's good to make some atls before the start label.

Code: Select all

transform my_left:
    linear 1.0 xalign 0.25

transform my_right:
    linear 1.0 xalign 0.75

transform nine:
    linear 1.0 xalign 0.9

transform eight:
    linear 1.0 xalign 0.8

That's a small example. So if you want to make the sprites move to another spot, atls are your friends. The example below is a simple one, and also shows a way to have the sprites appear without popping out of thin air.

Code: Select all

show luana darkbase dfearsad dfrown with moveinleft:
        xalign 0.01
    show waite darkbase dopenangry dfrown with moveinleft:
        xalign 0.2

    "They're somewhere in here..."

    show waite at three
    "I couldn't really see well, then held in my flinch when Waite moved away from me."

    pause 0.3

    play sound "footsteps.mp3"

    show waite darkbase2 dopenraise dfrown2 at center

    "It's okay, it's okay. Waite's right here. Nothing bad will-"

    show waite dopenangry2 at eight

You can also hide the sprites like so.

Code: Select all

hide waite with moveoutbottom

Movein/moveout are also good coding friends to use.

Before I end this post, I will say now the "blinking" eyes are not pictures, those are already defined images. I'll show you an example of that too, it's straight from the tutorial itself.

Code: Select all

image luana_on_blinking:

    "luana_eyes_open_neutral"
    choice:
        4.5
    choice:
        3.5
    choice:
        1.5
    "luana_eyes_half_neutral"
    .1
    "luana_eyes_closed_neutral"
    .1
    "luana_eyes_half_neutral"
    .1
    repeat

Hopefully, I didn't confuse you, if I did things right. This is as much I can help you for now.

[malakme]

Hopefully, I didn't confuse you, if I did things right. This is as much I can help you for now.

Are you kidding?? This is extremely helpful, thanks so much for taking the time to share all of this! I have to look over the links you've sent, but so far it's making much more sense.

[Sunlit-Dreamer]

You're very welcome! If you still need any help, just post again and I'll reply asap.