Â
When I go looking for an updated UI, my number one concern is how “clean†it looks. Why would the aesthetics be the most important factor of my UI? Well, first and foremost, it’s because I’m a raid leader. This means it’s my job to notice EVERYTHING. Is someone standing in the goop? Is that new healer casting or standing around? Are two people standing too close and about to get Ice Blocked? It’s my responsibility to be the extra eyes in the raid.
In Combat, Healing
Â
Â
Therefore, it is vastly important that I have a nice wide viewing area in which I can notice these things. Sure, there are elements of my UI that block my view, but they are very limited when they do. I keep my chat box transparent so I can see through it, my raid frames only light up who have aggro or who has taken damage, and my scrolling combat text scrolls down, and away from the center of the action.
Â
UI Map
Â
Â
But it isn’t just about the viewable space; it’s also being able to find what I need to know, right away. If I’ve got the injection from Grobbulus, the notification shows in the front center of my screen. I keep my raid frames just slightly to the left of the center, and decursive is to the right of the center. My own HUD is in the middle. This allows me to see health bars, my own health and mana, and who needs to be cleansed without moving my eyes. Mods like Healbot (which I use) and Clique allow me to keep my motions to the center, allowing me to use my W,S,A,D keys and key binds to heal myself.
Having all these mods cleanly in the middle keep my attention where I can be aware of everyone around me and my own situation when it comes to environmental hazards, but there is also other important information all around. A quick glance to the top shows my durability, and a glance to the bottom shows how we sit in terms of the meters. I have a Chat Mod called WIM that stores all tells until combat is over, and PallyPower and Buff Bars on the upper right tell me all I need to know in a hurry about buffs and debuffs.
This kind of setup may seem cluttered to a non healer who is not in a raid leading position. When you start having responsibilities, there is a lot of information to process and you need to know it all. When I am in a raid, not all of the features are active. Things like Quest Helper turn off. Aesthetics are just as important as functionality, and I encourage anyone looking for an updated UI to consider this information in their search.
Found a cool addon? Want to share a UI tip? In the mood to contribute a guest post? Have some ideas for future posts? Feel free to 
The problem about designing UI’s and judging it is that it is a very subjective matter. I have seen people complain about cluttered screens when all you can see is a minimap and 3 icons. I have also seen people boast about their clean ui when only the screenshot of it confuses me. People have different tastes and views. In the end, your UI is your language: your way of communicating with your environment in wow. Everybody speaks a different language.
Personally, I’m a minimalist in a very hard way: I go mad over seeing too much, duplicated or badly structured information. For example, in your screenie I wonder why the following information has each a different frame:
– party
– raid
– decursive
– threat
– buff
(- ress monitor?)
When all of this information can (and imo should) be integrated into a single raidframe. Well ok.. perhaps pally power is an understandable exception (though it shouldn’t be).
A second issue I always struggled with is colors. Every addon throws a flowerbed of colors on your screen. Why? Some do it for the looks, some do it to categorize information, some to indicate information relevance. Neither criteria is bad, but I see these 3 criteria being mixed in the same ui at the same time, near eachother. And people love it! It seems people are more break down a wall of text and dazzling colors into relevant and non relevant information than changing the color codes and have an intuitive interface.
User friendlyness is a difficult and subjective topic I suppose… but I think people haven gotten so used to badly designed interfaces (from webpages, Windows and some Linux ui’s) that they can’t distinguish good from bad anymore. I struggled with some things myself. That is why, for some parts of my ui, I do a structured analysis as it enables me to apply logic reasoning where my ‘wrongly trained’ brain is falling back on broken ui concepts. It has revealed me where I keep failing at separating relevant from non relevant information.
Zusterke, I would be very interested in hearing how you go about the structured analysis of your UI components.
I had a post on that on the Blizzard’s fora but it is no longer available (dates early TBC). But I have a condensed backup of it. While I feel this is relevant to the topic, I hope I’m not braking any rule by reposting an old topic of mine. If I am, my appologies, bows and feel free to delete the comment.
quoting—-
It’s quite dry material, but I’m guessing game/ui/mod designers have been confronted with such things before.
The analysis
I came up with (& applied) the following analysis schema.
Phase one: information gathering
Step 1. Identification: first I list the spells/abilities/information I need (duh!)
Step 2. Criteria: I build criteria which are relevant to my playstyle and how I use the spells/information (How and when do I use this ability? When is this information relevant?).
Phase two: Requirement determination
Step 3. Application: I apply the criteria on the spells/information from (1), seeing how good they score on that.
Step 4. Classification: I classify the spells/information from (1) along the criteria, building logic groups of spells which should have a similar or comparable access scheme (or should have adjacent shortcuts).
Step 5. Iteration: I look at my analysis and question the result. I add / change criteria if I find they innacurately helped my analysis. I pay extra care that even ‘less important’ spells/information are given a clear place. It is typically this category of information/spells that cause most of the cluttering.
Step 6. Access/Display logic: I build an access or display logic. For example, I want the “shift” key to switch me to “emergency modus” giving me easy access to all my emergency spells and emergency information. Or.. I want out of combat information to be accessible out of combat only (ress monitor)
Phase three: “to be” analysis
Step 7. Mapping: I deduct an access scheme or display scheme, mapping the classified spells to a matching access logic and matching the information to it’s location and situation when it is to be shown.
Phase four: Design
Step 8. Knowing what I want, and how I want it, it’s easier to find the mod I need to answer my requirements. Different solutions can be presented but can also be measured in quality with the analysis from above.
Phase five: Implementation
Step 9. With a clear view of the features required and the features provided, implementing my preferences was merely translating them into the mod’s configuration.
Conclusion:
Players are often confronted with one ui problem at a time and guidelined into “1 problem -> fix”-solutions. They structure their reasoning and problem solving in the same way: one aspect at a time but this fails to comprise the big picture and merge problems that are, in fact, related.
There seem to be a few modders with a nack for reducing the overload and displaying exactly the information they need, in a structured way. In fact, some UI’s are amazing. I can’t imagine there has been no analysis or top view list of requirements from the designers that yields such a great UI. Unfortunately, I’ve not found any analysis of this kind on UI’s elsewhere so I fall back on some techniques I picked up in software design and business consulting.
@Zusterke
I smell a guest post! You sound like a Human-Computer Interactions major I went to school with.
@Zusterke @Ithato, No kidding huh? I aimed to keep it simple for now as the goal was to express to beginners what kinds of things they might be looking for, but man, you sure can analyze the post. You’d be a great guest writer.
@Zusterke
WTB you as an author, guest or otherwise, PST.
@Andrea
WTB bigger screenshot.
@Nibuca Yeah sorry, I wrote this post before we figured out image sizes, all the rest will be bigger. Thanks for the feedback though.
@Andrea I fiddled with your code :) and found that the full screenshot is here: http://www.nostockui.com/wp-content/uploads/2009/03/wowscrnshot_022709_131722.jpg
If you edit the post and update the href of the anchor to the above then visitors will be able to click on the thumbnail to see the full size image.
Ie, it should be somthing like this:
Nibuca’s last blog post..Hand off ma Phat Lootz!
I find my biggest problem with making a UI is that I don’t have a widescreen monitor. I simply need more horizontal space. I’ve tried putting some of the info on the sides, but it just makes everything look cluttered. For me, as a tank, my biggest requirement health bars on every mob around me with color indicated threat. I need to see when i lose aggro for something i’m not targeting quickly. I use a HUD to see my health, my target’s and my focus’ health. I use floating text to see spell procs so I know when to use something reactive. Everything else is info I might need, but probably don’t.
You give a very misleading heading to your post “Why aesthetics are important” might be a valid question (the importance of having an UI which is pleasing to the eye) but what you’re discussing is more “Why ergonomics are important”.
@Rothtanks Try a view port addon. I sounds crazy that decreasing your screensize actually should give you a better view but in my experience it can. Sort of lika a widescreen movie on an old tv…
The most important thing for an UI layout for me, is that my player frame and target frame are exactly on the level of my eyes. Not in the upper left corner. Not at the bottom. Especially as a healer who makes klicky-klicky on raidframes, to fill those health bars up, nothing is more vital than having my health on the radar at all times.
Also consider the physiology of human sight. Your peripheral view is excellent. I have bossmods bars and my debuffs left and right from the center of my screen. Looking at the top or the bottom of the screen will require much more eye movement and refocusing.
Also, I advise everyone to look at the addon folder once every few months and move every addon you’re not sure if you and other players would die without it into a temporary folder. Better move out too much. Then raid like that and see if you really need all that stuff. Just getting some 2-3 addons out of the system is a big win!
As far as pure aesthetics go: Don’t forget, it’s a game! Allow yourself some eye candy and a sexy UI.
drug’s last blog post..Addons: Ressources
I agree drug. But there’s a difference between eye candy and chaos. Most players tend to customize the look and feel of their ui on an ‘addon per addon’ basis. Looking at such ui’s typically reveals an addon per addon config as you’ll see “red alerts” or “orange alerts” have different meanings on several locations on the screen.
If you look at (mature) UI compilations, such as Caith’s UI.. they tend to present a single, coherent style accross the entire UI, for all addons while being visually pleasing.
@Zusterke I would love to see your UI or even use it. I am always looking for something that does all the jobs I need better. And I totally agree with your thoughts on setting up a functional yet visually pleasing UI.
Unfortunately, I can only show WIP. I’m constantly testing out new things or moving things this way or that way. I try to learn the good and downsides of different approaches and try to understand why.
However, I’m close to finishing a minimal ui I have been building lately. I could post that one in a week or so :-)
[...] Why Aesthetics are Important [...]