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









Reader Comments (Page 1 of 4)
Dezaris Oct 26th 2010 8:07PM
I love it!
Everything except the keybinds.
In particular I like the long, sleek quartz configuration, and the use of Tell Me When, definitely borrowing some ideas from this!
Jack Mynock Oct 26th 2010 10:27PM
To what keybinds are you referring?
Aedus Oct 27th 2010 5:05AM
How do you turn off the target buff options on Quartz? Its been driving me crazy.
Sunae Oct 27th 2010 8:06AM
To turn off the target buffs, go into quartz and down to the buff menu. At the top of that menu there should be something that says focus, target, colors, etc. Go to target and uncheck enable.
Aedus Oct 27th 2010 9:03PM
@Sunae - Thank you.
Noyou Oct 26th 2010 8:15PM
This is awesome. one of the top 3 (if not best) UI's I have seen featured. Thank you also for mapping it out so we may replicate it. I will be using this setup after cata to heal on my new druid and shammy.
Alexander Oct 26th 2010 8:29PM
Id just like to say on note of his chicken fingers. I work at Wayside Take Out and we have AWSOME chicken rated top 5 in the south
Eph Oct 27th 2010 11:51AM
Top 5 in the South, eh... that's not saying much if you bring the rest of the world into the running, but then again, if you live in the South you probably weren't raised to try exotic things like Thai chili sauce or Indian spices. Enjoy your chikun fingehs lil buddy. /endtroll
wutsconflag Oct 26th 2010 8:25PM
Anyone know of a good way (downloadable or a guide) to set up Pitbull to look like X-Perl?
(Yes, I realise I can just use X-Perl, but it sounds like Pitbull is more configurable. Unfortunately, when I tried to use Pitbull, the options simply overwhelmed me.)
Eternauta Oct 26th 2010 10:14PM
Ask yourself this question: What do I need that Pitbull has and X-Perl hasn't?
If your answer is "nothing", install X-Perl.
I don't know why would you want to make Pitbull look like Xperl though. I'm a minimalist obsessed with efficiency, and Xperl in my opinion is the antithesis of that.
impaler Oct 26th 2010 8:40PM
I love the UI's of the week.
lazymangaka Oct 26th 2010 9:24PM
I love these minimalist UIs, but they just wouldn't work for me. I don't like to be fishing for information when I need it, so I tend to just display everything and if it looks a bit cluttered, then so be it. Plus, since I play on a laptop I don't have a ton of screen real estate to work with, so most minimalist UIs wouldn't look quite as minimalist anyway.
Looks great though. I like this column and the glimpse it gives me at what other people are working with.
Helston Oct 27th 2010 12:39AM
That's what they all say.
Over the last few months I've become more and more desperate to make my UI as minimalist as possible. You only realise how much you've been missing out on when you start to cut down on size. What's more, a minimalist setup works even BETTER with small screens so you can actually see what you're doing.
I yearn for something like the UIs of the week, I'm slowly getting there.
Saeadame Oct 27th 2010 12:59AM
I have the same problem. I don't know if it'll work for you, if you have a small screen, but I solved my problem by making the things I used different sizes based on how much I used them. For instance, my action bars with spells/abilities were quite large, but things I wouldn't need to immediately need to find like professions, flasks, food/drink, etc, I made quite small. It solved a lot of my space issues and allowed me to make a much smaller UI in general.
aapocalypse Oct 27th 2010 12:08PM
That is why I am glad my laptop has a 17.3 inch screen. Not the biggest thing in the world but a decent amount of screen real estate at least for me(Use to use a 19 incher so not much of a difference).
Mel Oct 26th 2010 10:22PM
You can create an extra target-buff/-debuff area with Satrina Buff Frames and shove it wherever you like. Also, you can adjust it to you liking just as you did with your own buffs and debuffs.
Euphande Oct 27th 2010 12:02AM
I was in love with my UI, until I saw this one. MUST SOLVE KGPANELS.
JaimeRavenholdt Oct 27th 2010 12:40AM
Love minimalist UI's. WoWInsider seems to like ones I would still consider full of clutter. :P
dmberreth Oct 27th 2010 1:39AM
One of the first UI's I've seen in a long time I actually want to try. Graphics are fun, but there is a LOT to be said for a useful, minimalist approach.
I play on a laptop, and while it doesn't generally give me any issues graphically or memory wise, screen real estate is still pretty small, and I still prefer to keep my addon memory as low as possible, just to be on the safe side.
I've looked through the archives, and haven't really seen anything that screams "LAPTOP USERS REJOICE!" If you come across anyone of these small-screen cowboys who are making killer UIs, give us some love with a new UI of the week, eh?
Darky Oct 27th 2010 3:50AM
Love this UI tried to set it up to look just like it...failed miserably.
On another note does anyone know a decent add-on that shows when you have a de-buff on the enemy in an obvious place but only a certain few de-buffs (ie the death knight's diseases)?