Advertisement

Reader UI of the Week: Mar's UI

Mathew McCurley
Updated ·8 min read


Each week WoW.com brings you a fresh look at reader submitted UIs. Have a screenshot of your UI you want to submit? Send your screenshots, along with info on what mods you're using, to readerui@wow.com.


As promised, this week is non-widescreen addon/UI week! Often requested and often put to the side, I receive a lot of e-mail from readers about configuring user interfaces for non-widescreen resolutions and smaller monitors. The secret is that there really is no difference between configuring for a widescreen or non-widescreen monitor -- it's all about knowing how things fit together. On this week's Reader UI of the Week, we are going to take a look at Mar's UI. Mar has asked for some pointers on getting her interface right, so let's see if we can help out and, at the same time, give some awesome design pointers on configuring a user interface with less space.



First, we let Mar do the talking:

Ok, I am constantly tweaking my UI, I'm never truly happy w/ how it looks, how an addon works so i'm constantly playing w/ it. I'm fairly content now w/ all of my addon's i use, but getting it to look to where i'm happy w/ it doesn't seem to be happening anytime soon lol, so any ideas i'd welcome, but please be nice :-) Most of these addon's aren't being used during a raid and some of them just make my life a little bit easier.
As a side note, i did move my player, target and target of target frames from where they are. My player frame is now up in the upper left corner, while my target and target of target frames go above my raid frames rather than below it. But that is about the only changes i've made since last night :-)

Addon's I use:
AtlasLoot Enchanced
Vuhdo
Quartz
VisualHeal
Mik's Scrolling Battle Text
Bartender
Button Facade
DBM
Omen
Recount(along w/ recount absorption)
WIM (to keep my whispers separated and allow me to respond to ppl after a boss fight rather than during it)
PowerAura's Classic
Ag_Units
Titanpanel
Compofeeder
Addon Control Panel
Mounty
SexyMap

-Mar

Thanks for the e-mail, Mar! Let's start off by examining a few details about Mar's UI and build off it to some key concepts and general tips for working with smaller screen real estate.



Top and Bottom

Mar has the right idea when it comes to placement of the top and bottom portions of the user interface. Since we're dealing with a raid screenshot, things will be a little messy, but not unmanageable. Mar has placed most of the important information into the TitanPanel (I prefer FuBar) at the top, only using the top panel portion instead of both the top and bottom. I like to recommend only using one or the other -- otherwise the screen feels too boxed in for me, and reminds me of Everquest's user interface (I am still haunted to this day.) By relegating yourself to one panel, you get to make the important calls on what information is pertinent. Culling the chuff addons and information is a key skill in pruning your UI.

As for the bottom, Mar's UI has everything necessary, including a nice setup of action bars aligned with unit frames and targets. I very much like the setup that Mar discussed in the e-mail as well as the current setup in the picture. Everything needed is in the middle of the screen. This is especially good for healing, allowing your eyes to be focused on one area of the screen for maximum information gathering. As I am just getting into healing on my shaman, and have had little experience with Grid in the middle of my screen, I've slowly started moving Grid from its old position to the middle of the screen, a few nudges at a time. It'll get there eventually...

Another excellent part of Mar's UI, and in user interfaces that have to occupy smaller screen real estate, is that the art from most of the bars is removed. Bar and buff skinners such as ButtonFacade work wonders for getting rid of the extraneous art that might clog up the window. Using ButtonFacade helps immensely, and is an invaluable tip.

Tips and Tricks for a Standard Resolution UI

Now, on to the meat of the matter. Configuring for a standard resolution in Mar's case (800x600 from the screenshot I was sent) requires nothing more than a change in perspective. Let me show you a piece of paper -- one of my original basic blueprints for the UI I am currently using:


Oops. Wait. Wrong paper. Here we go:


Now, that's the space I will be using for a wide-screen monitor. For the standard resolution screen, we will fold the paper in half and see what we can work with.


Here is a quick mock-up of something that puts all of the necessary addons and information at a convenient place and accommodates the main four addons I have listed in the middle. The goal is to fit all of the pieces seamlessly across the bottom of the screen to give the most viewable area possible above. Take a piece of paper and plan out your user interface before hand -- doing this allows you much more flexibility in designing before you hit the proverbial bricks and jump right in. A blueprint is always nice. Here are some key tips when dealing with smaller spaces:

ChocolateBar and FuBar

These addons are excellent for removing a good deal of information off of your screen proper, including the repair man to see your item's durability and bag space/gold. In addition, you can use them to display ammo on your hunter and other resource management systems like latency, ping, and frame rate. Again, as stated above, relegate yourself to only the top or the bottom panel, culling the least important information. You'll thank me when you have less to keep track of.

Fading Bars

A great way to clear up your screen is to have your bars fade out when they are not moused-over. Dominos and Bartender both have options to fade out your bars depending on if they are moused-over. Bartender has great options for hiding your bars out of combat, and then popping them back in upon entering battle. Play around with the opacity of your bars and your "at rest" UI will give you plenty of room to see the world. You can even have the parts of your user interface that are specifically for being in town/out of combat fade out when raiding or in combat.

A Sexy SexyMap

SexyMap is much more than the default setting. I love the default because it looks great, but there is a much more boring and space conscious setting called "Simple Square" in the presets. Using this setting allows you to position the map snugly into a corner, reducing the addon's footprint. If you like the fun borders, or just do not want the minimap in a neat corner, use the scaling function to shrink the map down a bit. If you're going for minimum footprint, a simple square is key.

Popout Your Chat Input

Using an addon like Chatter or Prat allows you to have a free-floating chat input bar that can live anywhere on your screen. I do this on my user interface to shrink down the amount of space the chat box takes up. By having the input bar off the chat box I can fit the addon snugly at the bottom of the screen and perfectly against the action bars. Otherwise, you'll have to adjust the size of the chat box and, in the case of having the input box on the bottom of the chat addon, having unused space under your nice and tidy UI.

There are just a few tips for dealing with less screen space. Remember, most addons can be hidden out of combat, and set up in such a way that they all lock together during combat. Also remember that most addons have a scale feature, allowing you to change the entire size of the addon with one variable. Take your time to treat each portion of your screen with lots of love and care, and see how much space you can save by getting rid of dead space. Play your UI like Tetris!

One Last Thing

Finally, and I'll be quick, remember to download your addons from trusted sources like WoWInterace, Curse, or WoWAce. I've been getting some e-mails that have asked me to remind people of this. In the future, I will be putting up a little something about addon safety. Just remember to be smart, only trust addons from sites you know are legit, and never run an installer .exe file. Addons only require you to move the contents of the folder into your interface directory -- don't fall for hacking scams! Just be careful!

Addons Discussed

%Gallery-19902%


Interested in getting the most out of your user interface? Come back once a week for more examples of reader UIs. For more details on individual addons, check out Addon Spotlight, your source for everything addon-related.