HomeUser Control Panel (unavailable in archive)ForumsTutorialsArt GalleryResourcesMaps

UI Mods Tutorial

10-18-2007, 02:25 PM#1
Argus
UI Modification
This Tutorial is about how to edit the existing Interface (The part of the screen ingame that shows for example time, resources, selected units etc.) of Warcraft 3. There are some created UI Mods available but since they are alot more difficult to edit than a skin or an icon there aren't many available. In this tutorial I will be using Unwirklich's Pandaren Interface so credits to him for it (I got my inspiration to write this tutorial from his wonderful UI mods so more credits to him I suppose). The image below shows how it should look when you are done. Credits to Norinrad's Pandaren Sage to as it is seen in the images.

Zoom (requires log in)

Step 1. Importing

All full UI mods contains the following files:

An Inventory cover (1)
Time Indicator Frame (2)
Tiles 1-4 (3)
Cursor (4)
Inventory Slotfiller (5)
Cinematic Border (6)
A "Spell Area of Effect" See Image (7)
And finally: the Options Menu Border

Zoom (requires log in)Zoom (requires log in)

If your UI mod doesn't contain all these it's ok. But hopefully the designer made them look good together with another allready
in game UI (Human, Orc, Undead or Night Elf). But if you have
all of the above then it is adviced that you use them all.

Step 2. Paths

Next we have to change the paths for the UI to replace an
allready existing UI. You can NOT use all the ingame UI's AND
the imported one simply becuse there are only 4 races to chose from
thus making it impossible (unless you creating a modification for
the entire wc3 program.) for the game to show the UI for a player.
In the example I will be replacing the Night Elves. Please note
that changing the paths on the imported files is the "hard way".
If you are making a singleplayer map or a campaign you can
change the gameplay interface but I will put that in the end of
the tutorial. Now there are sertain paths that MUST be used.

For the:
  • Inventory Cover: UI\Console\*race*\*race*UITile-InventoryCover.blp
  • Time Indicator Frame: UI\Console\*race*\*race*UITile-TimeIndicatorFrame.blp
  • Tile 1: UI\Console\*race*\*race*UITile1.blp
  • Tile 2: UI\Console\*race*\*race*UITile2.blp
  • Tile 3: UI\Console\*race*\*race*UITile3.blp
  • Tile 4: UI\Console\*race*\*race*UITile4.blp
  • Cursor: UI\Cursor\*race*Cursor.blp
  • Inventory Slotfiller: UI\Widgets\Console\*race*\*race*-inventory-slotfiller.blp
  • Cinematic Border: UI\Widgets\EscMenu\*race*\*race*-cinematic-border.blp
  • Spell Area of Effect: ReplaceableTextures\Selection\SpellAreaOfEffect_*race*.blp*
  • Options Menu Border: UI\Widgets\EscMenu\*race*\*race*-options-menu-border.blp
    *: In the SpellAreaOfEffect the night elves are a bit diffrent as
    it is "ReplaceableTextures\Selection\SpellAreaOfEffect_NE.blp"

Step 3. Testing

Be sure to test you map in case you have gotten any paths or such wrong.

Step 4. Extra (Singleplayer)

If you are making a singleplayer map or campaign you can take a shortcut by changing the game's interface on your map. First open the map in question then click the advanced button in the upper part of the World Editor next to tools. Choose "Game Interface", the fifth alternative from the top. Scroll down untill you get to the part where everything starts with "Image -" look for "Image - Cinematic Border". Check the little box in the upper left corner that says "Use Custom Game Interface". Now dubble-click the cinematic border line and change the path via the imported section. Do the same with the other imported files. To give you a challange you get to find out where to
put what on your own.

This is the end of the tutorial. If you have any questions post them in this thread and I will answer. It's better that evryone that has the same question getts it answer in one post than that you drive me insane with everybody asking the same question. Thank you for reading...
Attached Images
File type: jpgTutorial 1.jpg (138.4 KB)
File type: jpgTutorial 2.JPG (133.2 KB)
File type: jpgTutorial 3.jpg (111.4 KB)
10-19-2007, 01:47 AM#2
midiway
uhuuuuu

Where I can find the custom panda model you used?

I liked your tutorial, but it's too basic, if could add more interesting things...

10-19-2007, 12:20 PM#3
Argus
Well the Unwirklich's Pandaren Interface can be found at http://wc3campaigns.net/showthread.php?t=94788 (There's a link in the tutorial). But about the "basic", could you specify a bit? This is about all you need to know about importing custom UI's.
Edit: Oh you meen the Pandaren Sage? It's on page... 3 i think, in the wc3campaigns model section.
10-19-2007, 05:24 PM#4
kebabmeat
It's good to have a tutorial like this for beginners.
Very good anyways :D
11-04-2007, 11:36 AM#5
PitzerMike
Nice, good work.
I went over your formatting a bit and now it's ready for approval.
11-04-2007, 02:31 PM#6
Argus
Thank you!
11-11-2007, 01:36 PM#7
unwirklich
thank you... really. i got so much pm's how an interface works.
in my oppinion this tutorial is usefull. and its understandable and clear. +rep
11-12-2007, 01:42 PM#8
Argus
No, thank you! As mensioned in the tutorial your great UIs inspired me to create this tutorial. I'd +rep you if I knew how.
11-24-2007, 02:37 AM#9
Medevil_Nuke
i may seem really nooby by asking this but, y is it that every time i look in the interface box i see everything human?

I've been looking here recently because i map im making requires custom heroes and every time i see human, how can i replace night elf or Orc?
------------
edit: sorry reread nice tut!
01-14-2008, 05:59 PM#10
DukeCz
arg help plssss! i've got rith paths for tiles but the dont work!
01-18-2008, 09:22 PM#11
Argus
What doesn't work? Can you show me an image?
02-09-2008, 04:38 PM#12
Nyte
hi, great job with the interface, but i also have an problem. pls look here, the ui doesnt work at the left side:
http://www.wc3campaigns.net/showthre...222#post989222
02-09-2008, 05:42 PM#13
Argus
The problem is with Tile 1. The path (for night elves) is: "UI\Console\NightElf\NightElfUITile1.blp". I was tired when I wrote the tutorial, that's probably why there are so many spelling mistakes, sry.
02-10-2008, 10:31 AM#14
Nyte
hum, my paths are right, cuz i took the original pathname and copied to the new pandaren interface. (btw i guess its no differece between tile01 and tile1)
and also i wonder why the problem is not only in panda (NE) interface, but also in Demon (UD) at the same place =/
02-16-2008, 10:57 AM#15
Argus
There is a very big difrence between tile01 and tile1 (To the game anyway). What do you meen by "orginal pathname"? If you want to be 100% sure then u got to use a MPQ opening program, that's what I did. When u import an UI you are overwriting files in the mpq files (temporarly). There is no file at UI\Console\NightElf\ in the mpq file that is named Tile01, therefor the game will not find the file to overwrite and you wont see it ingame.