Saturday, November 2, 2013

Ragnarok Online 2 UI Texture Editing

I've had a few players ask me if this is allowed.

You won't get banned for changing your UI, but we don't support it because if something changes in the files and breaks your game, we can't support it.

So, we won't punish you for making changes, but we can't be responsible when it breaks.

Otherwise, these look cool!

We have gotten permission to edit the UI, However they will not give support if we break or mess up the VDK files.
(Mods will not give support if you mess up your client. Reinstall the game if you did not keep a back up.)

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
VDK files are located in

Normal Installation
C:\<Directory you installed in>\Ragnarok Online 2\Data\
or 
Steam Users
C:\<Directory you installed in>\Steam\steamapps\common\Ragnarok Online 2\Data

378a504ab5.png

The VDK is called "UI.VDK" 

You can extract the vdk using a VDK unpacker.

!The program you can find on your own, Search google or pm someone.!

Inside the UI.VDK you will find a number of folders and files.
Most UI texture files you will find under UI.vdk\UI\Texture and the names will start with Rag2_<Base/Btn/Con/Damage/Hud/Icon/Option/OutGame>_<Number>.tga

abdca91370.png
These files can be edited with free art applications such as Gimp, and Paint.net.

Lets see what everyone can come up with!

PS: Make sure you repack as version 1.1 and not version 1.0 otherwise it will not work and not display the hud.

~Texturing Tutorial~
We will be focusing on the menu button
First of all we will open the file Rag2_Hud_001.tga
Down in the bottom right you will see
a3ed36074b.png
^Normal                                       ^Hover                                      Click Down^                                    Inactive^
From here we can assume that these buttons are triggered by mouse events

Now we need to find the bounding boxes by trial and error.
be8ca986bd.png

Red is unviewable, Black and inwards is viewable.
So any edits shall be done at black and inwards.
We will add the mouse event names over the menu buttons so that we have a base to work from.

6105893b75.png

And then we remove the Menu buttons.

2bbf08bb68.png

Make sure to also check the top left of the image file where the menu button is embeded into the hud, find the bounding box and remove it like so.
261a96ed24.png
The black is the area that matches the black bounding box of our previous edits

And when it all matches up you get

d5f52b6b76.jpg

You can change the inside of the bounding box to anything you like!
Hopefully this was informative enough to give a small intro to texture editing.
If you have any questions please feel free to PM me.
Also when you repack you can replace the original UI.VDK as long as you make a backup of said file.
From what I have seen "UI2.VDK" or "UICustom.VDK" Isn't read by the game file system.

~List of Edited Huds~

No comments:

Post a Comment