Clean UI Template I Created

Hi guys, here is a “clean” modern UI I created on the beta after messing around with it. The key features are

Simple
Clean
Opens up visual space to the left and right (when not in a raid)

The basic idea behind this design is to get the extra vertical action bars on the right hand side a lot of us used for non combat stuff, down below into a completely horizontal setup.

Once you import it, when you’re in editing mode on, make sure every box for every UI element is “check marked” you can then see where these individual items would show up when “active”

The thing with the UI is, about 70% of all the stuff available in edit mode doesn’t really show up on your screen 90% of the time. So it’s important to know where it will be ahead of time by visualizing in edit mode.

It’s a basic start, customize and have fun with it however you want, your mileage may vary depending on your own personal needs.

It does utilize portraits being centered around my character at the bottom middle of the screen - i prefer it much more than my eyes racing up to the top of the screen and back down, but if you don’t like that just drag those elements back up top wherever you want them.

NOTE: In order for it to show up mostly properly you need to make sure you have a 6th action bar enabled, it is disabled by default in the new patch. Go to “options” then click on “action bars” then make sure “action bar 6” has a check mark beside it, as well as 2, 3, 4, and 5.

copy and paste the below code into your UI Editor under Import, be sure you create a new loadout first in case you don’t like it, you can revert to your old one!

0 30 0 0 0 7 7 UIParent -270.5 111.0 -1 ##$$%.&(‘%)$+$ 0 1 0 7 7 UIParent 269.5 111.0 -1 ##$$%.&(’%(#,$ 0 2 0 1 7 MainMenuBar -0.5 -4.0 -1 ##$$%.&(‘%(#,$ 0 3 0 1 7 MultiBarBottomLeft 1.5 -4.0 -1 ##$$%.&(’%(#,$ 0 4 0 1 7 MultiBarBottomRight 0.5 -4.0 -1 ##$$%.&(‘%(#,$ 0 5 0 1 7 MultiBarRight 0.0 -4.0 -1 ##$$%.&(’%(#,$ 0 6 1 1 7 MultiBar5 0.0 0.0 -1 ##$$%/&(‘%(#,$ 0 7 1 1 7 MultiBar6 0.0 0.0 -1 ##$$%/&(’%(#,$ 0 10 0 7 1 PetActionBar 1.0 4.0 -1 ##$$&(‘% 0 11 0 7 1 MainMenuBar -56.5 4.0 -1 ##$$&(’%,# 0 12 0 7 1 StanceBar 128.0 4.0 -1 ##$$&(‘% 1 -1 0 4 4 UIParent 0.0 -312.5 -1 ##$# 2 -1 1 2 2 UIParent 0.0 0.0 -1 ##$# 3 0 0 1 1 UIParent -302.0 -726.0 -1 $#3# 3 1 0 1 1 UIParent 298.0 -724.0 -1 %#3# 3 2 0 3 3 UIParent 546.5 -173.5 -1 %#&#3# 3 3 0 3 5 ChatFrame1 29.0 137.0 -1 ‘#($)#-#.#/#1$3# 3 4 0 7 1 ChatFrame1 -4.5 64.0 -1 ,$–.’/#0#1#2( 3 5 1 5 5 UIParent 0.0 0.0 -1 &#$3# 3 6 1 5 5 UIParent 0.0 0.0 -1 3# 4 -1 0 4 4 UIParent 0.0 -353.0 -1 # 5 -1 0 7 1 CompactRaidFrameContainer 78.0 4.0 -1 # 6 0 1 2 0 MinimapCluster -10.0 -10.0 -1 ##$#%#&.(()(# 6 1 1 2 8 BuffFrame -13.0 -15.0 -1 ##$#%#’+(()(*# 7 -1 0 7 7 UIParent -655.0 742.0 -1 # 8 -1 0 6 6 UIParent 44.0 45.0 -1 #&$X%'&# 9 -1 0 7 1 MainMenuBar -238.5 4.0 -1 # 10 -1 1 0 0 UIParent 16.0 -116.0 -1 # 11 -1 0 5 5 UIParent -262.0 -245.0 -1 # 12 -1 1 2 2 UIParent -110.0 -275.0 -1 #K

3 Likes

mate what are you even trying to do rn.

use block text

1 Like

This is very kind and helpful of you. It’s especially nice that you put in this part:

2 Likes

Checking this out. Its quite lovely. I usually play in windowed mode so i have to go fullscreen to get it all in place proper. But this is nice ty

1 Like

Oh right. How do you get rid of the gryphons / wyverns on our action bar again?

If you want to enable those turn edit mode on, find bar number “1” by clicking through the bars physically on your screen. Bar #1 only will have two check mark boxes for “enable bar art” and “enable bar scrolling” check or uncheck those if you want those gryphons or scrolling back

as you click on each bar or UI element if you pay close attention there will be an additional sort of “pop up window” that appears somewhere on the screen with information about that specific UI element, whether it is your action bar, party group frame, or whatever. You can usually adjust the settings for each UI element in that pop up window as you click between elements.

ah lovely ty

??? Well now edit mode is kinda wigging out on me. Oh dear

Update: Okay fixed it with a total restart. Sall good

See, this is the kind of thread I’m happy to see in GD.

2 Likes

Yeah we have to create a thread were players can share their UI. With screenshots too

Screenshots are great! :slight_smile:

1 Like

Unfortunately my trust level is not high enough to insert pictures :’(

Otherwise would gladly post some.

Mine either. Can anyone help a bruddah out?

not sure If I did it right

1 Like

Looks pretty much how it is on my screen, you have a lot of UI elements not check marked so we can’t see them but thanks for posting that, that’s awesome! If you could ideally grab one screenshot with the edit mode off, then one screenshot with the edit mode turned on and every UI element check marked or enabled so it shows up as blue, it would be a great help to people to see both the edit mode versus the play mode. Just so they can visualize where I put all the elements that may show up later (like party or raid frames) that don’t show up automatically.

Not a lot else is showing for me.
and the only i could turn on was Boss and arena frames

Wait

in that box up in the left hand corner of your screen that’s where you want to check mark all the boxes. See how a lot of them are not check marked. If you just click each box it should enable those UI elements to show as blue which gives you an idea of where i placed them while edit mode is on. The only one it should not let you check mark normally is the loot window box.

this is with all checkmarks

That’s perfect, the only thing I would say is that you’re missing an action bar in the lower right because by default blizzard doesn’t have them all turned on.

if you go to “options” then “action bars” make sure you check mark “show action bar 6”

for some strange reason your party and raid frames aren’t showing up even check marked. try saving and going out of edit mode then going back into it.

btw is it intended that the exp and rep bars are hidden behind the action bars?