New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Official MAS Art PSDs and Guidelines #3174

Open
ThePotatoGuy opened this Issue Dec 4, 2018 · 23 comments

Comments

6 participants
@ThePotatoGuy
Copy link
Member

ThePotatoGuy commented Dec 4, 2018

READ THIS FIRST

If you are thinking of creating a new outfit, its recommended to wait until the end of feb (or when this message is removed) before starting. We might be redoing the leaning base and we wouldn't want you to do work twice.
Upright sprites are not changing so its fine to create an outfit for those in the meantime.

================================================================================

Here is the official PSDs and guidelines for creating Monika art for MAS.

LEGAL

Creations/Modifications/Edits based off these sprite sets are not permitted for use outside of the Monika After Story Mod.

The following credits are for contributions to the base psds.
Outfits are/will be credited on the Credits wiki page

Special thanks to:

  • Iron707#6209 - building the base
  • TarossVelin#8698 - splitting hair, ribbons
  • @Metisz - extending upright hair sprites so they look nice with the base
  • @Olliesama - recoloring the base sprites so they don't look sunburnt.

TOC:

  1. TODOs
  2. Render Order
  3. Hair Sprite Guidelines
  4. Clothes Sprite Guidelines
  5. ACS Sprite Guidelines
  6. PSDs
  7. Revision History
  8. Extra

TODOs

These are open TODOs for art that we would like to have completed. If you want to help out with one of these TODOs, please create an issue saying that you are working on it.

  • Outfit wishlist Link
    Status: ongoing
  • Tears that work for closed-sad (d) and closed-happy (h) eyes
    Status: open
  • Complete right arm in Point Right Pose so it extends below table.
    Status: open
  • Clean up Blazer/Uniform sprites and update them so they use base arms.
    Status: #3631
  • Clean up Santa outfit and update crossed arms and leaning pose
    Status: open
  • Update crossed arms and add leaning pose for Neko outfit
    Status: open
  • Update crossed arms and add leaning pose for Witch outfit
    Status: open
  • Split Neko outfit hair / acs (would allow us to use the hairstyle + acs for other outfits)
    Status: open
  • Split Witch outfit hair / acs (would allow us to use the hairstyle + acs for other outfits)
    Status: open
  • Fix disgust mouth (#3605)
    Status: open
  • Laying down Monika base for bedroom mode (#2781)
    Status: open
    NOTE: Because of the complexity of this request, we are willing to pay for this. (Price will be negotiated).

Render Order

When we render in-game sprites, we do in a very specific order. We also allow for several spots for accessories (ACS) to be rendered as well. These are marked below with "ACS".

Currently we have a mix of sprites that have split-hair and some that do not. Split-hair sprites allow for additional locations to put ACS as well as easier management and creation of new outfits. Non-split hair sprites don't have all ACS spots.

If you have an accessory that needs to be in a spot that is not available in non-split mode, you will need to make a version of that ACS that works in a non-split ACS layer

ACS render codes:

  • PRE - ACS layer for accessories that should be rendered before everything
  • BBH - ACS layer for accessories that should be rendered between back hair/body
  • BFH - ACS layer for accessories that should be rendered between body/front hair
  • AFH - ACS layer for accessories that should be rendered between front hair/arms
  • MID - ACS layer for accessories that should be rendered between arms/face expressions
  • PST - ACS layer for accessories that should be rendered after everything

Split-hair render order

NOTE: Both leaning and non-leaning sprites will follow this order.

  1. PRE ACS
  2. Back hair
  3. BBH ACS
  4. Body
  5. BFH ACS
  6. Front hair
  7. AFH ACS
  8. Arms
  9. MID ACS
  10. Facial expressions
  11. PST ACS

The following hair styles use this order:

  • def (ponytail)
  • down
  • bun

Non-split hair render order

NOTE: AFH ACS are not rendered here.

  1. PRE ACS
  2. Body
  3. BBH ACS
  4. BFH ACS
  5. Arms
  6. MID ACS
  7. Facial expressions
  8. PST ACS

Hair Sprite Guidelines

Split Hair

All new hair styles MUST be split into 2 layers, the back layer and the front layer. Think of the back layer as hair that would be behind the body. Front layer should hair that would appear on top of the body.

Both hair layers should be complete, without cuts for the body/arms. The render order will handle the appearance appropriately.

Ribbon Concerns

If you are creating a hairstyle that uses the ribbon, do not change the position of the ribbon. Since we can different colored ribbons, changing the position of the ribbon would require an entire set of ACS sprites for your ribbon and will subsequently be rejected.

Submitting New Hair

Ensure the following:

  • Resolution is at 2560x1700
  • Only day versions are required
  • Both leaning and upright versions have been created
  • Hair is split (see Split Hair above)
  • PSD format or exported PNGs of the appropriate resolution.
  1. Create a new issue on github titled: Hair - name of your hairstyle
  2. Link your issue to this one by typing #3174 in the body of the issue somewhere.
  3. upload or link your PSD/images to the issue.

Clothes Sprite Guidelines

Poses

All new outfits should be created for all poses. There are currently 6 poses:

  1. Steepling (upright body + steepling arms)
  2. Crossed (upright body + crossed arms)
  3. Rest Left Point Right (upright body + rest left point right arms)
  4. Point Right (upright body + point right arms)
  5. Leaning (leaning body + leaning (def) arms)
  6. Down (upright body + down arms)

Some of these poses use the same arm pieces:

  • Poses 1 and 3 have same arms, but different hand positions.
  • Poses 4 and 6 share an arm (left arm).

Additionally, some of these poses need to have cuts for the boobs:

  • Pose 2 (crossed - both arms)
  • Pose 4 (point right - both arms)
  • Pose 5 (leaning - right arm)
  • Pose 6 (down - both arms)

Because of the difficulty in creating boob cuts for some arms (crossed, leaning right arm), we do not require the boob cuts in your submissions, but including them will make it easer for us to add your outfit.

If you make boob cuts, ensure that there is no tiny line of transparency between the boobs and the arm. The night filter brings out these kinds of issues, so use the night filter to check for this. It's recommended and okay to have the arm slightly over the boob so there is no transparency line.

Outfits with custom hair

If you are creating an outfit that must use a specific hairstyle, you can bake your custom hairstyle into the outfit. You must have a very good reason for doing this. We are trying to avoid this since it locks changing hairstyles, limits the available ACS layers, and requires additional code to implement.

Submitting New Clothes

Ensure the following:

  • Resolution is at 2560x1700
  • Only day versions are required
  • Both leaning and upright versions have been created
  • Clothes are a separate layer from the base layer. (Don't bake them together)
  • All poses are accounted for (See Poses above)
  • PSD format or exported PNGs of the appropriate resolution.
  1. Create a new issue on github titled: Clothes - name of your outfit
  2. Link your issue to this one by typing #3174 in the body of the issue somewhere.
  3. upload or link your PSD/images to the issue.

ACS Sprite Guidelines

Render Layers

ACS can be rendered in a specific layer. This means you do not have to add cuts to your ACS for body/arm/hair layers. For a list of the layers, see the ACS Render Codes section in the Render Order section above.

Note that the AFH layer does not get rendered if hair is not split. Currently we only have 2 outfits where that is true. If your accessory must exist in this layer but still appear in a not-split hair style, build another version/set of versions of your ACS that can work with the non-split hair style. We can write custom code to handle these cases.

Poses

Like clothes, ACS should be created for all poses, unless it is not visible in a pose (like hand jewelry). See the Poses section in the Clothes Guidelines for more info on Poses.

Ideas

The sprite system is designed to be versatile with its layering rules, so we should be able to handle a variety of ACS. Here are some ideas:

  • hairpins/hairclips
  • rings
  • chokers
  • necklackes
  • other jewlery
  • glasses
  • face tattoos
  • whatever

Submitting New ACS

Ensure the following:

  • Resolution is at 2560x1700
  • Only day versions are required
  • Both leaning and upright versions have been created (if applicable)
  • All poses are accounted for (if applicable) (See poses above)
  • PSD format or exported PNGs of the appropriate resolution.
    NOTE: Some ACS have extra guidelines and requirements. Please check the PSDs section below for more information about specific ACS
  1. Create a new issue on github titled: ACS - name of your accessory
  2. Link your issue to this one by typing #3174 in the body of the issue somewhere.
  3. upload or link your PSD/images to the issue.

PSDx/XCFs

All PSDS/XCFS are located here:
Link to Gdrive

Important things to note:

  • Layer order in the PSDs are the same as render order and is reflective of what actually happens in-game. Please ensure that you test your art in the correct layer level.
  • Everything is at double the in-game resolution (2560x1700). Please create your art in that resolution.
  • The Twilight Filter is our "night" filter. It does change the color of things, but if you are working with a color that gets filtered out, then we can render the night version without the color part (Twilight Color) of the filter.

Base Monika

Upright

File uprightbase.psd

Ideal for:

  • Creating new outfits
  • Creating new accessories
  • Creating new hairstyles

Contains:

  • Twilight Filter
  • Sample Expression
  • Base Monika body sprite
  • Base Monika arm sprites
  • Split Hair sprites
  • Table sprite

Leaning

File leaningbase.psd

Ideal for:

  • Creating new outfits
  • Creating new accessories
  • Creating new hairstyles

Contains:

  • Twilight Filter
  • Sample Leaning Expression
  • Base Monika leaning body sprite
  • Base Monika leaning arm sprites
  • Split Hair leaning sprites
  • Table sprite

Outfits

Blazer/Uniform

NOTE: Not available yet...

Casual/Vday/Sundress White

NOTE: Not available yet...

Santa Monika

NOTE: Not available yet...

Marisa/Witch

NOTE: Not available yet...

Rin/Neko

NOTE: Not available yet...

ACS

Colored Ribbons

File acs/ribbons/ribbons.xcf

NOTE: This is an XCF because its easier for us to save colorization using gimp settings.

Ideal for:

  • Checking if your desired ribbon color already exists
  • Making a new colored ribbon

Contains:

  • Day/Night versions of upright ribbons
  • Day/Night versions of leaning ribbons

Usage Notes:

  • Duplicate the acs-ribbon_def-0.png and acs-ribbon_def-5.png layers. Use those for colorizing. We also have a fully white version which can also be used for colorizing.
  • When adding a new color, grab the twilight filter PSD (explained below) and check the night version. If the night version changes the color too much, then explain in your issue that we should render the night version without the color portion of the twilight filter. If you are unsure, then we will decide the fate of the night version.
  • When submitting a new ribbon color, submit the colorization settings and html color code used to generate the new color. (If using gimp, export the settings in the colorize tool)

Colored Ribbons (color settings)

File acs/ribbons/color settings/*

Ideal for:

  • Trying out existing colorization settings on other things.

Contains:

  • Colorization settings for the ribbon.

Usage Notes:

  • These are exported from gimp. The actual format is just plaintext so you can open it up in text editor and figure out what the colorization settings are from there. Gimp can import these using the colorization tool.

Other

Twilight Filter

File utility/justtwilight.psd

Ideal for:

  • Testing how something looks with the twilight filter.

Contains:

  • Twilight Filter

Usage Notes:

  • The filter is always applied as the top-most layer
  • If an item changes color dramatically when the filter is applied, we may turn off the color portion of the filter when applying it. This is the middle layer of the 3 twilight filters. (Twilight Color)

Expressions

NOTE: Not available yet...

PSD Revision History:

  • 2019-02-07: Recolored base psds (upright + leaning) so Monika does not look sunburnt, resized the psds so they are no longer 2562x1700
  • 2019-02-04: Added ribbon color settings for gimp, fixed front hair ribbon issues for upright ponytail/bun hairstyles
  • 2019-02-03: Added ribbons xcf and twilight filter psd
  • 2019-01-30: Cleaned table sprite so the edges are more defined and consistent, as well as color gradients
  • 2019-01-28: Added Casual (vday) outfit psds. (@EntonyEscX )
  • 2019-01-27: Added fixed upright hair sprites form @Metisz, filled in transparency holes in many of the arms.
  • 2019-01-26: Added table shading for point right arm in upright
  • 2019-01-26: Removed extra artifacts in the split hair sprites, added grey BG layer for helping with detecting extra artifacts (taken from @EntonyEscX 's psd)
  • 2019-01-16: Fixed a fringe coming off table sprite, fixed arms down not reaching table
  • 2019-01-16: Initial Release

Extra:

Export Steps

Exporting sprites for usage in MAS is a complicated process. There are limitations in the various programs we use, and so we have to combine the work in order to get quality sprites. This is the gist of what we do, some steps we can skip or simplify depending on what we are exporting.

  1. Import day versions of a sprite into photoshop.
  2. Add night filter to PSD
  3. Export standard size (2560x1700) day versions and night versions of the sprite
  4. Import the standard size sprites into GIMP
  5. Using GIMP, downscale the sprites with linear interpolation to 1280x850.
  6. Export the downscaled sprites with the correct names.
  7. Add the sprites to the correct folders
  8. Add the appropriate sprite objects / selectables / logic in code.
@TheRyanReSeT

This comment has been minimized.

Copy link

TheRyanReSeT commented Dec 4, 2018

is there a .psd file out there with poses already loaded up? Just curious because it would be easier just to add a layer with the accessory

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 4, 2018

i have previously helped do a sprite with them which was the disgusted mouth sprite that has now been updated. the problem with just adding a layer over it is that if you put that picture as the same resolution and scale size in the game code it would literally layer that entire image over the pre existing one just for the small accessory or whatever it is your doing. so for the mouth change i made i had to make it the exact same scale size and resolution as well as make sure its placed exactly in that scale to be proportionate with the other mouth only then did it work. granted i could be wrong and making it complex but this is what i learned while working with the sprites with them. then again an accessory may be different then a mouth

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 4, 2018

@TheRyanReSeT

This comment has been minimized.

Copy link

TheRyanReSeT commented Dec 4, 2018

ah thanks for the headsup, do you know where I can get the sprites so i can try work on some accessories? @tsmafterlife

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 4, 2018

go to the doki doki file you have that runs the monika after story mod, then go to game>mod_assets>monika then you get several files caled (a,c,cg, and f) file cg doesnt show much but inside a, c, and f should be all the compiled sprites organized out. if you have anymore questions or would like to know how the scaling works let me know and if you have discord i can screen share you and go more in depth. let me know how this goes for you though. @TheRyanReSeT

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 4, 2018

more then likely you will want to see file c and then click def for thats her standard sprites and not her Halloween ones but i listed them all just in case you want to play with other stuff as well. but i need to caution you if you open up one of the sprites from that folder in say photo shop and you make a save to it and not a new copy located in a different folder away from ddlc then you will directly change the official sprite and i have no idea what that will do. so its best to find whatever way works best for you to make an exact replica of the sprite after you find it so that way if you make saved changes it wont affect anything

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Dec 4, 2018

All the poses are in the mod_assets/c/def/arms-* folder. We recommend that you upscale the pngs to twice the res, then build your accessory for that resolution (2560x1700). While we downscale everything in the end, having a higher res initial image helps us in the case that we need to make adjustments before downscaling and rendering.

@Professor-JMO

This comment has been minimized.

Copy link

Professor-JMO commented Dec 12, 2018


I needed this.

Thanks for the info.

Bookmarks


@ThePotatoGuy ThePotatoGuy pinned this issue Dec 26, 2018

@EntonyEscX

This comment has been minimized.

Copy link

EntonyEscX commented Dec 27, 2018

Night filter? So I can draw a casual outfit for Monika and send it to you without having to make a night version too?
Curiously, I've been without internet in the past few days (I had to get my dad's internet to download the Christmas update) and yesterday I started making a version of Monika wearing the casual clothes of Satchely's Valentine's Day art to contribute to the mod. Coinsidently, all I only need to do the inclined pose to finish the versions of the day, so I can eviar everything for you when you finish it even though it does not have nightly versions?

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 28, 2018

this is exactly how it works or that is how it worked for me when i contributed. all you need to do is make sure theirs an art for her in her leaning pose her straight pose and make sure her arms if she has sleeves all have arts that work with it in those respected poses. no need to do nights as the developers use a night filter. @EntonyEscX would you happen to have photo shop by any chance as it would make the process incredibly easier. if not thats ok it just makes things take longer. but i must point out the art you submit for the mod has to be in the same exact spot as it would be in the mod by correctly scaling it with the original art. if not you will get this (use image as reference) which is what happened to me when i didnt correctly scale the new disgusted sprite correctly and i submitted it.
monika first attempt full placement failure

but if you have it scaled correctly to the image it should come out like it is in the mod today with the new disgusted sprite.

hope that helps if not im more then willing to answer more questions.

@EntonyEscX

This comment has been minimized.

Copy link

EntonyEscX commented Dec 29, 2018

I have no problem with the adjustment. I put my custom ring in my Monika's sprites with every update since before they actually exist in the mod, so I can say that I already have experience with this. 😁

@EntonyEscX

This comment has been minimized.

Copy link

EntonyEscX commented Dec 29, 2018

Just one more question. As I did not know about this issue when I was without internet and I started to draw the clothe, I ended up doing everything in the original resolution of 1280x850, okay if I send it like this, or do you want me to increase the dimensions of everything to 2560x1700? I mean, I finished everything and did not want to have to redo everything from scratch in the new resolution, but just selecting the option to increase the size of the image would not make so much difference, since it would only be the inferior quality increasing its area.
*And answering your question, @tsmafterlife, yes. I ever use Photoshop to do my stuff.

@tsmafterlife

This comment has been minimized.

Copy link

tsmafterlife commented Dec 29, 2018

ah okay as for the image itself monikas spirit of lower body is in 1280x850 so that would be the resolution you want. just make sure everything is in its right spot and send it here and ill double check you if you want to make sure its how suppose to be. @EntonyEscX

@EntonyEscX

This comment has been minimized.

Copy link

EntonyEscX commented Dec 29, 2018

Great! I'll send it now. Thank you very much.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Dec 31, 2018

Okay just as a heads up, we are very close to having a base sprite set that you can use as a guide for outfits/acs/whatever. Once it is ready, it will be linked on this issue.

@ThePotatoGuy ThePotatoGuy added this to high priority in Art Ideas Jan 1, 2019

@softombre

This comment has been minimized.

Copy link

softombre commented Jan 15, 2019

I'm waiting for the base to be released, but I already have a few ideas!

@ThePotatoGuy ThePotatoGuy changed the title open art options Official MAS Art PSDs and Guidelines Jan 17, 2019

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Jan 17, 2019

Base has been released. This Issue has been updated.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Jan 30, 2019

just going to note that the only new outfit for next release will be the casual/vday one. Everything else will be looked at right after vday.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Jan 31, 2019

2019-01-30: PSDs updated. check revision history for changes.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Feb 4, 2019

2019-02-03: Ribbons added and twilight filter added, check revision history for changes.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Feb 5, 2019

2019-02-04: Ribbon color settings added and fixes to upright ponytail/bun hairstyles

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Feb 8, 2019

2019-02-07: fixed to color and psd sizing.

@ThePotatoGuy

This comment has been minimized.

Copy link
Member Author

ThePotatoGuy commented Feb 15, 2019

I've added a spreadsheet of outfits that we would like. Link is in the TODO section.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment