WhateverEternia Respriting Guide
#1
Introduction:

In this guide we will be discussing how to apply sprites to objects in Eternia and by extension go into details about the BYOND platform. 

This guide expects you to be somewhat familiar with pixel art and is focused on guiding you through the processes involved in uploading them to the game. If you are totally lost here is a random pixel art guide I found online. But that is only the tip of the iceberg. Google will show you the way. But if you need a little help understanding this niche better then check out this Pixel Art Discord which is unaffiliated with the Byond platform. The best resource you can find in relation to Byond Spriting is the SS13 Spriters Discord. A free program to sprite through would be Paint.net which I used in my old Eternia: Prologue guide. But any software that supports layering would work. 

However, this time around any sprites I create will be through Aseprite, which is a paid program I have logged thousands of hours into that is spared the unrelated bloatware most other programs have and is genuinely just fun to use. I completely recommend investing in Aseprite as it has all you could possibly need and is designed primarily for pixel art. As an alternative to Aseprite however I do recommend checking out Libresprite which is an open-source fork of an Aseprite 2016 build before it went commercial. It has many of the same features but lacks much of the development. It is however free and serviceable. 

As well, please spare yourself the suffering of spriting directly in Dreamaker (Byond's image editing software, also known as a DMI file type.) and just copy/paste or import/export your files to and from whatever program you decide to use for drawing. Dreamaker lacks support for additional layers and is known to bug out if you Ctrl+Z at the wrong time. It is also known to have issues with Alpha/Transparency when a sprite is copy and pasted in from another program. But we can get around that last part.

[Image: OK44XGn.png]
_______

Prerequisites:

In order for one to upload and utilize their sprites they need the following monthly subscriptions:

€8 | Be a subscriber
In order to wear resprited cosmetics.
€9 | Be a Gold Patreon in order to change a sprite. (Press F1 in game, top left corner.)

For a total of €17 a month.

Or...

€26 | Be a Platinum Patreon which provides Gold Patreon benefits and also provides subscriber status on top of additional character stat points.
-
Clarification note: It is enough to simply be a Subscriber if you have a friend who is a gold Patreon that can resprite your items for you. Subscriber is required to wear any resprited items however. As well, you cannot resprite weapons at will due to the focus on unique items. You require some in character development to have a custom sprite on your weapon.
[Image: dOmPfIR.png]
Reply
#2
The Sprite Converter Tool:

This is your bread and butter when you are only just starting out. It was made by someone very smart and though it has its limitations it allows for minimal DMI tampering. (DMI is the file type used by Byond. You put your sprites into it and assign it to certain animations, such as running or blocking). This makes spriting an exceedingly easy process and lowers the barrier to entry. To get started you need to download the actual Sprite Converter tool.

You can find an updated version here.
(Note: You MUST have the Byond Client installed for this to work.)

It has many quality of life additions that are missing from the Sprite Converter Tool linked elsewhere in Guides & Information. That one is a far older version. You'll need a tool like Winrar or 7zip in order to extract it. (Or apparently download it pre-extracted via the dropbox link?) Drop it into your folder of choice. I like to keep it around my sprite resources just to make using it a bit easier.

When ready double click Eternia Sprite Tool.DMB


[Image: LUzhbWW.png]

If this shows up just hit 'Yes'. I suspect it must need the permission for a crash log or something, though it appears to work fine regardless of the option chosen. It seems to physically host a server in order for you to use it.

[Image: io95vcB.png]

Now you should see this.

[Image: SvAA4PW.png]

There are many options available to you. Each with their own purpose and required template. 

Hair & Weapon tool: Both manage the majority of image states needed within a DMI. With the provided sprite templates minimal DMI intervention is needed, except for the UI icon states which need to be added by hand. Though that is an easy process.

Armor tool: A nice option to have, but mostly useless. It automatically aligns your armor sprites. But, you'll still need to edit them heavily by hand to match all the animations.

Preview: By far the best addition of the Updated Sprite Converter. It takes any uploaded templates and allows you to see what they would look like in-game. You can press space to cycle through animations.

Later on we will go into the available options. The easiest to start with will be the Hair Tool.

Please note: Any exported product must have .dmi at the end in order to save it as that file type. We will go further into this.

Please do not post in this thread. I will update it periodically with new information.
[Image: dOmPfIR.png]
Reply
#3
The Hair Tool:

[Image: SvAA4PW.png]  [Image: KC2dbq4.png]

This tool may be used to create not just hair, but also hats. Its resolution is somewhat restrictive and it does not support animations, but it is a very forgiving method of having your own custom look. You can accomplish this through copy and pasting the below templates into your image editing software of choice. Make sure you create a new layer before drawing over them.

 Blank Hair Template
[Image: MGmVZ7a.png]
 Base Hair Template
[Image: ngFxrqT.png]

Or...

A template for those with Aseprite.
(NOTE: If you are going to use the images above then please right click and save them to your desktop and then use that file in your image editor. 'Copying' a .png online can cause it to lose its transparency. The background should never be white.)

 The template has a pink border around it that separates the .png into three different grids. The grids shown each represent a different facing direction which are needed. South, north and east. East itself is copied and mirrored to act as a west facing direction once the tool is used. So be sure to design your sprites around that little fact. The tool will ignore the pink border completely; it is only there to give you a visual indication of how large your playground is. Which is exactly a resolution of 32x40 per grid slice.

With that said go ahead and draw something up.
______
Here is a little example of the template being used.

[Image: EEZvurr.png]

Simple, right? One direction facing the screen, one facing away and the last facing off to the side.
Go ahead and hide the layers you do not want. That includes the base sprite and any backgrounds. You only want the actual sprite visible. (Though you can keep the border, it won't show up anyway.)


[Image: uYkUVdP.png]

Now save this as a .PNG file and head back to the Hair Tool.
You'll want to click 'Select Hair Base'


[Image: rNebSAN.png]

Then go ahead and find your png using the provided window.

[Image: M0yE5JU.png]

As you can see for some ungodly reason it does not use the normal File explorer, which means it takes extra effort to find any .png's saved to out of the way folders.  You may get used to this struggle in time.


[Image: UJwMS9K.png]

The preview image now shows your template/sprite. Go ahead and click 'Save Results' to proceed.


[Image: e9DSxUs.png]

Make sure you change [ExportName].png to [Exportname].DMI
This is really important. The tool goes through the effort of turning your PNG template into a (nearly) fully completed DMI.
Go ahead and open the exported DMI now.


[Image: FbL6Wfd.png]

You are almost done! Sadly The Sprite Converter tool leaves out an important state (A state is one of the above seen categories that is used when a certain action is taken in-game, such as the difference between seeing your character running or dashing). You will now need to create the UI icon state, which allows you to see an item on the ground or in your inventory. Go ahead and right click an empty square and select 'New State'

[Image: nzknVMX.png]

The bellow window will now open.

[Image: pMiVqu4.png]

Just ignore it for now and click the 'Back' button near the bottom right.

[Image: yDbnkwb.png]

Go ahead and double click your newly created state's name. Change 'No Name' to 'UI' and be sure to keep the capital letters.

[Image: 9fpvMyu.png]

Now find which icon you want to use for the UI. Double click a different state (not the name, that will just open a box to rename it) such as walk to open it.

[Image: 5rALvtl.png]

Then go ahead and hover over which image you want to be the UI icon. Such as the highlighted bellow square. Ctrl+C it to copy the frame. 

[Image: 1iEXkqi.png]

Then press the back button and just head into your empty UI icon state. Simply paste the copied frame into the vacant one.

[Image: IBhK0R1.png]

[Image: 0UReLFH.png]

Now all you need to do is save the DMI. Top left>File>Save

[Image: BIe90iF.png]

To apply your new sprite in game you simply drop the item you want the sprite applied to (in this case a Pink Bow) and press F1 while next to it.
Select Sprite Change from the top left

[Image: ACkVnUD.png]

Then select your desired item and click 'OK'

[Image: jP1stGk.png]

Now find your DMI, select it and click 'Open'.

[Image: WfAviGh.png]

[Image: dDv2Z0C.png]

Pick it up and we're done!

[Image: PHZ9rCy.png]


The Weapons Tool:
As I neglected to go into details about the weapon section of the tool I'll include a footnote weapons template below. 
Here is the reference example.

[Image: tCUe71B.png]

The left box represents how the weapon will be seen on your 'back' and will cut it up to suit the various movement states. Keep in mind, in the example above, the 'Idle' state will actually come out 'flipped' horizontally once you use the tool. So you may want to design the hilt to rest against the left shoulder, as opposed to the right one as seen above.

The middle box represents the 'swing' animation for when you use it to attack. You can draw the wind if you want but ultimately you can just mirror the idle state if you want to save time.

The right box is the stab state, which shows in a few select spells.

Ultimately with a simplistic weapon you only "really" need to draw two states when using the weapon template. You can copy and paste the below images into your image editing software of choice to start using these. The same rules apply as with the hat template, just with a different resolution and reference material.

[Image: J16n4oX.png]

[Image: zGedJ1r.png]
[Image: dOmPfIR.png]
Reply
#4
Fixed the broken SS13 Spriters Discord link and added Libresprite as an alternative to Aseprite.

Also added a weapons template footnote under the hair template guide.
[Image: dOmPfIR.png]
Reply
Topic Options
Forum Jump:




Users browsing this thread: 1 Guest(s)