Latest in Gaming

Image credit:

Reader UI of the Week: Todoroku's tower


Each week, WoW Insider brings you a fresh look at reader-submitted UIs as well as Addon Spotlight, which spotlights the latest user interface addons. Have a screenshot of your own UI that you'd like to submit? Send your screenshots along with info on what mods you're using to

After a wonderful weekend at PAX East, I return to the convention-less world of writing, World of Warcraft, and cleaning a perpetually messy living room. Oh, how nice it is to get away from it all. PAX East was a lot of fun this year, and I very much appreciated all of the kind words from fans. I had no idea I was in any way recognizable.

Since we're back to reality, that means more insight into our own user interfaces by taking a look at some of the WoW Insider community's creations. This week, Todoroku's user interface is under our magnifying glass, exhibiting some nice panel work to make a comprehensive healer UI. Let's take a look.

Gallery: Reader UI of the Week gallery | 267 Photos

Todoroku sent me this fine email:

Hi Mat,

I am a huge fan of Reader UI of the Week and have wanted to submit my UI for several months, but have never felt my UI was complete or ready to submit. I've gone through numerous changes since Vanilla WOW and wished I'd kept screen-shots of each iteration to show the progress from the mess my UI was when raiding MC. I finally feel my UI is in a state I can be proud to show.

As a Resto Druid, I like to have my raid frames right under my feet so I can easily heal and keep watch for things to not stand in (or to stand in for group heals) . I use Healbot for my raid frames because I like the the user interface and I've been using it since BC. From there I like to keep all the rest of my information close to the raid frames. The closer to the raid frames the more important the info. My Focus and Focus's Target are on the left hand side and my Target and Target's Target are on the right side with the targets buffs and debuffs above the Target. This way I can easily see them on either side of my raid frames. I have sexycooldown just above the raid frames, hotcandy above that so I can see the lifebloom timer, and quartz for the cast bar. I have my unit frame below the raid frames so I can see mana and the special bars (Cho'gall's corrupted blood and Atramedes' sound bar). I have bartender buttons below. I have SLDataText underneath, which I learned from reading this column. Under this I have XPBarNone to track my reputations and xp when on my alts.

To the right under the target I have Sexymap so I can make quick looks to see where out of range raid members are located and next to that I have skada so I can monitor my healing output and I have omen underneath. I don't use omen all that much but I like having there. Plus I like the layout with skada and omen.

On the left I have my chat frames. I use Prat for all of it's great chat customization. I hated the default chat tabs and I haven't found a chat addon that does anything with the tabs to customize the layout, so I created my own. Using KGPanels I create my own tab frames and scripted them to click on and show the state of the tab, such as the current tab selected(text colored white), and messages being received. When a message is received, the tab that receives those messages will change to the color of the type of message it was. The default color is grey if there are no messages. An example of this is when I've selected the combat tab and a guild chat message is received the guild tab text turns green. In the example pic you can see the General tab is yellow, Combat is white, Guild is green and Raid is Orange.

I use MikScrolling data to see my heals, but mostly to see crits. I have my Buffs to the left and my debuffs to the right using Satrina Buff Frames. Most of my addons allow for borders and backgrounds, but for the ones that won't let me do what I want I use KGPanels and script them for resizing. It's not pictured here on my main, but I use Carbonite for my alts when leveling. It's very useful for showing where to go for quests and has a cool zoom in feature for the map.

The following is a list of my addons I use that aren't mentioned above:

  • Addon Control Panel
  • Atlas
  • AtlasLoot Enhanced
  • Auctioneer
  • Bartender4
  • ButtonFacade
  • ButtonFacade: Sleek
  • Carbonite
  • Deadly Boss Mods
  • EPGPLootmaster
  • Healbot Continued
  • HotCandy
  • KgPanels
  • MikScrollingBattleText
  • MoveAnything
  • Omen Threat Meter
  • OPie
  • Pitbull Unit Frames
  • Postal
  • Prat
  • Quartz
  • SatinaBuffFrame
  • SexyCooldown
  • SexyMap
  • Skada
  • SLDataText
  • TBag-Shefki
  • Tidy Plates
  • Tidy Plates: Clean Plates
  • TinyTip
  • XPBarNone

I hope you enjoyed my UI.

Todoroku, Level 85 Tauren Restoration Druid

Thanks for the email, Todoroku. More healer user interfaces, you say? I answer with healer user interfaces.

The tower

As I am one to make up words and concepts, assigning a description to things that may be descriptionless, Todoroku's user interface is now an example of "the tower." The tower has three basic components.
  1. A tower UI is one with two to three different UI elements stacked on top of one another.
  2. The tower is generally concentrated in the center of the screen and expands outwards. Touching the edges of the screen does not usually happen.
  3. The Tower concentrates focus on a fairly robust set of group or party frames as its centerpiece. These components are indicative of the tower.

When fashioned together, these qualities create a user interface that, on its face, looks too intrusive. However, as you might have already guessed, this might not be such a bad way to work. The tower-type of user inteface is a great way of focusing the player's attention onto important UI aspects while keeping the eyes centered on the screen. For larger monitors and resolutions, this is almost imperitive.

While at PAX East, Fox Van Allen and myself went to a booth that was showing off an impressive 3-D, tri-monitor display of World of Warcraft. While a good amount of the game was prettier with the 3-D technology and filters applied, ultimately it felt shallow and wasted on a game not designed with the technology in mind. But past that, the size of the user interface available was almost too insane and too much to handle. To look at the auction house menu or his bags, Fox had to move his entire head to a different monitor.

The tower solves many people's problems of eye darting, as I call it, and can keep you focused. There are ways to make the tower less daunting or manageable, which we can get to in just a second.

Todoroku's tower

Todoroku's tower sounds like a game I played on the NES at some point in my childhood, and it makes me happy just to say it. Todoroku's healer tower is focused on providing healer information front and center. And since Todo is a raider, healing is especially important. Action bars and wider UI elements make up the base and middle of the tower, with the more configurable and smaller pieces lining the right side and a Prat chat interface holding up the left wall. The target and target of target frames are cleverly placed above the Skada and Sexymap elements, much like a Tetris block. I'm a fan.

I talk about Tetris a good deal when discussing interface creation because I feel it is a very apt comparison. It is a universal metaphor for gamers and stacking things. Quality tower-based user interfaces are all about quality stacking.

Improving the tower

I think that Todo's tower is a good construct. While I understand the predictable placement complaint ("How will I see what is directly under me?"), healers have been dealing with that very sort of issue since the dawn of healing user interfaces and giant Grid/Healbot/Vuhdo interfaces hit the scene. The trick is to pull the camera back more.

We can, however, improve the tower a bit. Last time, we talked about transparency and hiding interface elements. For a healer, a very small set of UI elements need to be out at once, always visible during combat. The rest of the UI can be hidden and the tower restacked once combat is finished. Using Kong, you could get rid of some of the stack in combat or just make it transparent so you get more of a sense of awareness directly under the character. However, I don't know if that is too big of a deal.

Great job with the tower, Todoroku. It's a great setup, and I hope our healer readers and enthusiasts will take to heart the lessons of the tower -- ease of heal-awareness and every UI element nice and packed together. I know that I didn't talk about the kgPanels scripting awesomeness that Todo has done for the Prat interface; it is incredibly awesome but a little outside readers' ability. This might be a time to change that. If people have some great resources for the novice scripter, let me know, and maybe a Reader UI of the Week focused on some cool scripting techniques could be worked out.

Until then, see you guys next week, and thanks for coming out at PAX East.

Gallery: Reader UI of the Week gallery | 267 Photos

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, or visit Addons 101 for help getting started.

From around the web

ear iconeye icontext filevr