1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. Hey Guest, If you'd like to instant message with many other users, then join our
    Official Rune-Status Discord Server!
    Dismiss Notice
  3. Got your own Server? Looking for a Server to play right now??
    Make sure you check out the Public Server Directory!
    Dismiss Notice
  4. If you're new to the Rsps Scene and want to jump straight into learning how to Set-up and Customise your own RuneScape Private Sever then check out the Guides and Tutorials for RS2 here.
    Dismiss Notice
Dismiss Notice
Hey Guest,
Are you sure your posting in the Right Sections?
If your unsure which RuneTek version you are working with visit this page to find out.

Sprite Editor Tutorial

Discussion in 'Guides & Tutorials' started by Ian, Dec 13, 2016.

  1. Hey guys,
    Im writing another How-to tutorial for the RuneScape Classic Development enthusiasts - This time I wish to guide you though the usage of the RSC Sprite Editor which was originally developed by Reins, then modified by Tim Creed.

    It is pretty much an all in one sprite editor, the onlything you can't use this tool for is image editing but you can use image tools like Microsoft Paint or Adobe Photoshop to acheive great RSC graphics :).

    It has the functionallity to unpack and repack Sprites from .rscd archives in an Image format and also the default Sprite format which you can open in the Editor or as mentioned before with the Image format version - in a Image manipulation program.

    So the first thing you need to is download the RSC Sprite Editor from the Resources Section:
    RSC Sprite Editor

    After you have downloaded the tool from the Resouces section you will need to extract the files from the archive into a new folder, you can do this using Sorry you must be logged in to read this.
    Click here to log in.

    Once done - providing you have Java installed on your machine you will be able to simply run the program by either opening the 'Sprite_Editor.jar' file or either of the '_pack-sprites.jar' or '_unpack-sprites.jar' executables, though the last two will not give you the Graphical user interface of the Sprite Editor.

    On opening the Sprite Editor you will see a screen like this:
    [​IMG]
    Some of you will have tested the buttons to see what each does and you will have figured most of the tools potential on your own, but nevertheless I will continue to guide you about what each of the functions do and how to prepare Sprites ready to be added to you Client and Server. Although you can close the Sprite Editor for now while we setup.

    First things first we need to get together the neccessary bits and bobs from your Client and Server so we have an upto date reprisentation of what we want to acheive, we need to grab files from both the Client and the Server side to allow the Sprite Editor to be able to work to its full potential, If you are happy using the Sprite Editors default files which I have packed with it feel free, but ifnot this is a list of the files you will need:
    • CLIENT-SIDE
      • Animation.rscd / .xml.gz
      • Entity.mem / .data
      • Media.mem / .data
      • Textures.mem / data
      • Textures.rscd / .xml.gz
    • SERVER-SIDE
      • ItemDef.xml.gz
      • NPCDef.xml.gz
    Once you have collected all these files from your Client and Server direcotrys you firsly need to make a back-up of them all and also make a copy of them in the data/ folder for the Sprite Editor to use, you will need to rename the .rscd files to .xml.gz as the tool hasn't been written in a way where it will check for both.

    There is one more thing we need to get for the Sprite editor and that is the Sprites.rscd archive from your Client, this is where the Sprite Editor will pack the Sprites you make for you to add to the Client. This doesnt really need to be located in the Sprite Editors directory although it will be easier to find when you have to use the File Opening interface to load the Sprites.

    The first program I want you to run is the '_unpack-sprites.jar', and use it to open the Sprites.rscd:
    [​IMG]

    The '_unpack-sprites.jar' unpacker will dump the Sprites held in the Sprites.rscd archive (which is used by the Client) so you are able to see what Sprites are conained inside it. It will dump files into a new folder called unpack/ in two different formats, PNG and SPR the image file for allowing you to customise default sprites in image editing software and the binary file for use with the Client:​
    [​IMG]

    Just like the '_unpack-sprites.jar' program the Sprite Editor also has an unpacking feature, though this will unpack the sprites into seperate 'Packages' instead of the one folder as this has done - I'll explain more on this further in the guide.

    Now its time to open the 'Sprite_Editor.jar' again, so - the first thing we should do is just like the previous step using the '_unpack-sprites.jar' program this will give us some sort of indication of what the Package should be when adding or customizing one of the sprites.

    The steps to take are, Open the Sprite Editor tool, and click the 'Unpack' button, this will show you something like this, and create a directory called sprites/ in the directory your Sprite Editor is in:
    [​IMG]

    If your Sprite editor fails to unpack the data from the files in the data/ directory - you will know by there not being a new sprites/ directory or the Sprite Editor stops working completely, to fix simply ensure you have renamed any .rscd to .xml.gz this should fix any problems occuring.

    You should now have the sprites/ director which has subdirectorys including:
    • png
      • entity
      • media
      • media.object
      • texture
    • spr
    Its worth explaining each of the Packages to stop people getting confused later in developments. It's happened to the best of us but thats not what were aiming for with this guide so I will give you a quick overview.
    • The Entity package is where you will find Player and NPC sprites - this is also the package for Animation frames, though the Client will push the correct Sprite for the Animation you will need to make sure that if you add new Weapons that either Players or NPCs will use, you alter the Shift and Width values for the Sprite and add these to the ItemDef/NPCDef files - Ill speak more on this later.
    • The Media package is basically the Client Sprites, you will be able to make changes to the basic in-game Client Game-frame and also things like Hit-splashes and Magic/Ranged Missiles.
    • Now the Media.Object package is an important one for adding new Items, this is where you do... add the Items :) - You will need to remember that the same Sprite is used in RSC to do pretty much everything item relates, this is the sprite that will be in the Inventory and also on the Ground.
    • Finally the Texture package, this is a fairly unused package of sprites with RSPS as it mainly consists of Tile Textures, and a few odd textures that are used for Specific objects.
    For the Purpose of this Tutorial I am going to add an item out of Chrismas Sprites from the Christmas Sprite Pack found in the Resource section - It's that time of the year at the time of writing this.

    After downloading the first thing to do is extract the Christmas Sprite Pack to somewhere easy to navigate too with the Sprite Editors file loader.

    Now with the Sprite Editor open you want to 'Load Image' as the Sprites in the pack are PNG format and not SPR of which we would use the 'Load Sprite' button instead. It depends on the Sprite Pack you use and the person who made the pack to be perfectly honest.

    The Sprite I am going to be adding is the Magic Gift Box which was given during a Christmas event towards the end of RuneScape Classic and never made it over to RS2. It'd filename is 3345.png in the Sprite pack:

    rsps

    On opening you will notice at the bottom of the editor the Values for the Sprite are all defulted. The Package is 'unknown' the ID is '-1' etcetera. We need to fill in these values I will try my best to explain what each value is for.

    For now place the values as seen below:
    rsps
    The Values needed need explaining so you can continue to add your own customs:
    • Package
      • The Package of the Sprite loaded.
    • ID
      • The Index of the Sprite loaded.
    • Size
      • Dimentions of the Sprite loaded.
    • Shift
      • Does this Sprite 'Flip' when looked at from different angles.
    • X-Y Shift
      • The X-Y Offset of the Sprite drawn in-game.
    • Width/Height-2
      • Dimentions of the Sprite to be drawn in-game.
    You will need to make a note of the values you have entered or which were loaded from the SPR file you opened in the editor to use in the XML files you will edit later on.

    Once you have completed the values you can go ahead and 'Save Sprite' by clicking the Button ;). You need to number the sprite so just number it the same as the Image file loaded which was 3345 and add the trailing .SPR (in lowercase!) so you have saved 3345.spr to the unpack/ directory.

    Providing the 3345.spr is in the unpack/ directory you can now run the '_pack-sprites.jar' program. The Sprite Packer program will firstly ask you to provide it with an .rscd archive file to pack the new Sprite files into, you can either choose the one provided with the tool or the one from your Client conf/ folder.​
    rsps

    You can ensure the Sprites have been packed by opening the .rscd archive with WinRar or software similar and check the sprite number you added is there, for example:
    rsps

    Now that you have packed your Sprites you need to copy the Sprites.rscd file over to your client if you were using the provided file. After which you will need to add the Item to the XML files in your Servers conf/ directory, for example in ItemDef.xml:

    <ItemDef>
        <name>Magic Gift Box</name>
        <description>I wonder what's inside</description>
        <command>Open</command>
        <sprite>445</sprite>
        <basePrice>1</basePrice>
        <stackable>false</stackable>
        <wieldable>0</wieldable>
        <pictureMask>0</pictureMask>
    </ItemDef>

    Its important to note that when adding Weildable Items to your server you will need to also pack the sprites of the Animation which will be shown to players with the appropriate package added and also You will need to note the overlay color which will replace the monochrome whites and greys.

    The sprite Editor has a feature to show you what a Sprite may look like with the overlay colour added to it, the first thing you need to do is load a sprite which can has a overlay, for example a Dragon.

    Once loaded you click the 'Overlay' button and choose the colour you wish to preview:
    rsps
    As an example for this guide I will choose a random colour to use as an overlay:
    rsps
    Which resolves to something like this (lol):
    rsps

    Now this color #FFCCCC which is a Hexdecimal value wouldn't be valid as a colour overlay is only read as a Decimal Number in the client so this Hexdecimal number and needs to be converted to a Decimal number, you may be wondering how do I convert Hex into Decimal, well heres how to do that:
    1. Get the decimal equivalent of hex from table.
    2. Multiply every digit with 16 power of digit location.
    3. Sum all the multipliers.
    Or alternitavely you can use a converter :) which you will find online easily:Sorry you must be logged in to read this.
    Click here to log in.

    The Hexdecimal value FFCCCC equals 16764108 in Decimal. You would just simply duplicate the NPCDef.xml values of say a Black Dragon and Paste them towards the end of the file ammending the NPCs ID and Character color (Overlay).

    Well thats enough, if you feel like there is something missing from this guide feel free to PM me and I will rectify any mistakes or add more detail if needed. Thanks for reading
    - Ian.
     
    #1 Ian, Dec 13, 2016
    Last edited: Oct 14, 2017
    Tags:
  2. Cool man , this will definitely help a lot of people :)
     
  3. Thanks a lot for this, will be using in the future :)
     
Loading...
Loading...