Reader UI of the Week: Zhee's UI
Finally, I return from BlizzCon 2010 with an ache in my head and a stomach hardened with Anabella hotel chicken fingers and Domino's pizza. Please, put me out of my misery. Actually, the chicken fingers were awesome -- it's hard to do good chicken fingers, and the Anabella came through in spades.
Thank all of you who came out for the reader meetup, by the way. You guys were awesome, very supportive of my MCing the night and asked some great questions while I was off the mic. It was so nice to meet so many of you, talk about all this crazy stuff and lead you guys in what I thought to be a really fun night. Anyway, we've got reader UIs to discuss, and I fully intend to do that now.
This week, Zhee emailed me all the way from the Netherlands to show off her healer user interface. What follows is a clean, crisp user interface that is functional, elegant and barely using up any screen space at all. Also, this article is being drafted on a keyboard that barely has a space bar, so if you hear screaming (or the article itself features splatters of blood), it's probably me prying my fingers off one at a time because this damn keyboard has driven me insane. Reader UI, go!
Take me to the special place, Zhee:
Opacity is a beautiful thing
Opacity is not a new topic in my columns. I find that the approach chosen by Zhee here is the cleanest, easiest look you can get in most UI setups. Essentially, position an addon on top of a kgPanel and set the addon's own settings to remove the border, then bring the opacity of the addon and the transparency of the background to zero. What you effectively have is letters and numbers floating in the ether. Moving this floating information over a kgPanel that does have some opacity/transparency/color to it allows you to give this "clear" addon a background to rest on top of.
This approach is particularly powerful with Recount, Omen, Skada and chat addons, as you can see in Zhee's examples. Look at how clean and solid her chat and healing meters look against the similarly styled kgPanels. What this also means is that you can block out your user interface in kgPanels, and then add in clear addons into those blocks, making resizing an easier task as you now have guides to help you with the occasionally tricky shapes.
A Grid worth healing for
This Grid is adorable. The setup reminds me of 10 iPod shuffles from a few generations back. The elongated Grid windows allow for more Grid notifications and alerts, a smaller spacing footprint, and potentially larger healing numbers and amounts available to Zhee. So many people are afraid to move away from square Grid formations that it makes me sad. Trying out new shapes and sizes can seriously up your game, and you might even stumble across a really awesome setup that you couldn't have ever come up with had it not been for a little experimentation.
Mouseovers are little gifts from heaven
Seriously. Mouseover bars and commands are the secret sauce in some many user interfaces. Setting certain bars to only show up on mouseover means you can add these hidden UI elements and save a ton of space. Action bars that are rarely used, pet bars, utility bars -- the sky is the limit with interface elements that can happily disappear from sight until they are ready to be used.
A good number of addons have the ability to be mouseover unveiled, so tinker around a bit in the options for a mouseover option. Bartender and Dominos are two of the best examples, since the action bars you can setup can easily be set to mouseover status. In fact, I'm working on a really cool Dalaran minimalist UI right now, making heavy use of mouseover bars for professions instead of Opie, because I want to test myself and see if there is a UI in the world without Opie that I would be happy with.
Anyway, great job, Zhee. It was refreshing to come home from BlizzCon, sit down at my desk, and be treated to such a simple piece of interface beauty. It almost makes up for all the Spartan UIs in my inbox.
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.
Thank all of you who came out for the reader meetup, by the way. You guys were awesome, very supportive of my MCing the night and asked some great questions while I was off the mic. It was so nice to meet so many of you, talk about all this crazy stuff and lead you guys in what I thought to be a really fun night. Anyway, we've got reader UIs to discuss, and I fully intend to do that now.
This week, Zhee emailed me all the way from the Netherlands to show off her healer user interface. What follows is a clean, crisp user interface that is functional, elegant and barely using up any screen space at all. Also, this article is being drafted on a keyboard that barely has a space bar, so if you hear screaming (or the article itself features splatters of blood), it's probably me prying my fingers off one at a time because this damn keyboard has driven me insane. Reader UI, go!
Take me to the special place, Zhee:
Thank you for the email, Zhee. Since it's just a few days since BlizzCon and I'm trying to keep everything as simple as possible, Zhee's UI is perfect for my mindset. This user interface uses a good amount of transparency to achieve a really cool effect that ties the whole thing together. In addition, the uniform spacing and sizing of the unit frames makes for a slick raid interface.Hello Mathew,
First off, I'm a big fan of your blog. It's a true inspiration for me!
I would like to submit my own UI. My main character (the one I raid with) is a discipline/holy priest on Kul Tiras (EU). The UI is suitable for all my alts as well, though.
As you can see, I like a clean UI, but it must be functional for raiding as well. Most healer UIs I have seen have very big unit frames, but I like them a bit smaller. All I need to know is shown in Grid, with small indicators and icons. No big flashy bars for me.
I have hidden the micro menu (on top of Recount) and a Bartender bar (under the Quartz bar), by fading them out with Bartender. They appear when I mouse over.
On the top of my screen is a Titan panel and a reputation bar, also visible on mouseover. I like to hide everything I don't need to see all the time.
I have tried to make my UI as symmetrical as possible. What bothers me a bit is the extra block of auras on top of the Pitbull target unit frame. Unfortunately I don't know a way to smooth this out without losing the option to check my targets buffs.
I absolutely love what you can do with Pitbull, though. I have set it up to show the unit frames of the player, player target, focus and focus target, each with its own configuration.
Here's a list of the addons I use:
- SatrinaBuffFrame
- Button Facade
- Titanpanel
- Chinchilla
- BasicChatMods
- Pitbull Unit Frames 4.0
- Bartender 4
- Grid (supported with Clique)
- Quartz
- Recount
- TipTac
- eAlign
- TellMeWhen
- RaidBuffStatus (hidden)
- KGpanels
- Decursive (hardly visible next to Grid)
I'd love to know what you think of my UI. Any tips are always welcome!
Thanks in advance. :)
Zhee
Opacity is a beautiful thing
Opacity is not a new topic in my columns. I find that the approach chosen by Zhee here is the cleanest, easiest look you can get in most UI setups. Essentially, position an addon on top of a kgPanel and set the addon's own settings to remove the border, then bring the opacity of the addon and the transparency of the background to zero. What you effectively have is letters and numbers floating in the ether. Moving this floating information over a kgPanel that does have some opacity/transparency/color to it allows you to give this "clear" addon a background to rest on top of.
This approach is particularly powerful with Recount, Omen, Skada and chat addons, as you can see in Zhee's examples. Look at how clean and solid her chat and healing meters look against the similarly styled kgPanels. What this also means is that you can block out your user interface in kgPanels, and then add in clear addons into those blocks, making resizing an easier task as you now have guides to help you with the occasionally tricky shapes.
A Grid worth healing for
This Grid is adorable. The setup reminds me of 10 iPod shuffles from a few generations back. The elongated Grid windows allow for more Grid notifications and alerts, a smaller spacing footprint, and potentially larger healing numbers and amounts available to Zhee. So many people are afraid to move away from square Grid formations that it makes me sad. Trying out new shapes and sizes can seriously up your game, and you might even stumble across a really awesome setup that you couldn't have ever come up with had it not been for a little experimentation.
Mouseovers are little gifts from heaven
Seriously. Mouseover bars and commands are the secret sauce in some many user interfaces. Setting certain bars to only show up on mouseover means you can add these hidden UI elements and save a ton of space. Action bars that are rarely used, pet bars, utility bars -- the sky is the limit with interface elements that can happily disappear from sight until they are ready to be used.
A good number of addons have the ability to be mouseover unveiled, so tinker around a bit in the options for a mouseover option. Bartender and Dominos are two of the best examples, since the action bars you can setup can easily be set to mouseover status. In fact, I'm working on a really cool Dalaran minimalist UI right now, making heavy use of mouseover bars for professions instead of Opie, because I want to test myself and see if there is a UI in the world without Opie that I would be happy with.
Anyway, great job, Zhee. It was refreshing to come home from BlizzCon, sit down at my desk, and be treated to such a simple piece of interface beauty. It almost makes up for all the Spartan UIs in my inbox.
Filed under: Add-Ons, Reader UI of the Week
Patch 5.3 interview with Ghostcrawler
Mystery of the Unborn Val'kyr
The latest patch 5.3 news
All of the latest Mists of Pandaria news








Reader Comments (Page 2 of 4)
Darky Oct 27th 2010 4:04AM
Also Is there an addon to alter the default Hover over tooltip?
neogramps Oct 27th 2010 7:38AM
I used Shadowed Unit frames; I have a player and target bar in the centre of screen - you can track buffs and debuffs below the bars.
For the latter - tiptac - lets you change and reposition the tooltip notice, and add things like spec etc for players.
Neyssa Oct 27th 2010 7:48AM
I am sure you can set PowerAuras up for that. The closest I think of is how I set up my paladin, to show if my enemy target is under 20% health (for Hammer). On Power Auras, you can set any style you like (text, flashing horde symbol, etc :), wherever you like, with your preferred opacity.
Neyssa Oct 27th 2010 7:50AM
@darky: the other issue - tooltip
Get TipTac, its great and fully configurable tooltip addon.
Beleg and the Dude Oct 27th 2010 12:42PM
Satrina Buff Frames. I use it to show only my diseases on the target and it works great! I also use it to show debuffs on me (and the debuff count, if any) to help with tank switching.
Darky Oct 27th 2010 1:48PM
Ok thanks guys I just went the route of using quartz to make the bars nice and easy for me to see, right next to my portrait too. I have tried using power auras before but in the end I found its too much hassle for me and other addons are usually there to fill it's place with a lot less hassle.
Nick Rawr Oct 27th 2010 4:02AM
Is there a way we can download this as a addon package ?
purpletigerdevil Oct 27th 2010 5:03AM
Yes, and it would be so awesome if the creator would do it. Curse has setup a way to download addon packs. Give us a link if you do decide to share. http://wow.curse.com/downloads/packs/default.aspx
G01851 Oct 27th 2010 11:33AM
/agree
Love seeing these articles, but it would be much nicer if we could GET them too (along with WTF folder info) so we could install them ourselves and have them look the same.
StClair Oct 27th 2010 12:19PM
Seconded/thirded/whatever. I'd love to be able to grab this as-is and plunk it into my own WoW folder.
Zhee Oct 28th 2010 12:55PM
Zhee's UI can now be downloaded as a package at http://www.wowinterface.com/downloads/info18534-ZheesUI1920x1200.html
Poppy Oct 27th 2010 4:56AM
That is a really nice UI - very clean, elegant and functional
I don't see how people managwe with only 1 chat window though. I have one for guild, party and whipsers, and one for raid and all the other stuff that goes on. Doesn't that get too confusing in the one window, or do people use different tabs, or just cope with the noise?
Poppy Oct 27th 2010 4:58AM
Gah - 'manage' and 'whispers'
Zhee Oct 27th 2010 5:36AM
I use different tabs for different channels. (General, guild/officer, party/raid/custom healing channel, (Real ID) whispers)
There is a lot of info you can turn on and off for each tab, and it flashes to notify you for incoming messages, in case you have selected another tab.
Kemikalkadet Oct 27th 2010 8:40AM
I use two different windows:
Left window is my main one. The first tab is basically default, all channels except for party raid and battleground go to this one. I also have tabs in this window for Guild chat and Whispers, if the main window is moving too fast (trade spam etc) then i'll switch over to guild so i don't miss chat, the whisper tab also flashes when i recieve a whisper until i click it, so i don't miss any.
In my right window i have all party related messages: Raid, Party and battleground. This helps to keep track of any party communication and stops it getting confused or lost in the main one.
All done, with the default chat interface, it's really easy to set up.
mr b Oct 27th 2010 5:01AM
Tooltip addon is called TipTac, can show lot of detail or just very basic info, Great addon.
Darky Oct 27th 2010 5:42AM
Thanks heaps :D
Luis Alluren Oct 27th 2010 5:10AM
Great job Zhee - UI looks great: minimal and very straightforward - I would go for a bigger Grid but that's just personal taste - I would take some good notes from it
p.s. - lol at matt's Spartan remark - some just don't get it
Daniel Oct 27th 2010 5:25AM
I like the UI,one (slightly off topic) question,I'm rolling a hunter and I tried SUF but it wont show my pets happiness.And,when messing about with BT4,My entire quest description area(the one that tells you where to go without opening the quest log itself) is highlighted in a massive,obtrusive green.Other stuff like vehicle seat mover,armored man chooser or somethin,vehicle control bar,I dunno,I just moved out of the visible screen area.And it wont go away on a reload-ui! HELP! ITS DARN UGLY
Zhee Oct 27th 2010 5:42AM
As for your pets happiness, get Pitbull. ;)
The green areas for quests, vehicle etc. sounds like it is part of a minimap addon? (SexyMap? Chinchilla?) Bartender does not have the option to move those elements.