Last week, Reader UI of the Week profiled Mvin's UI, an awesome creation that rose the bar for UI submissions. You guys loved Mvin's descriptions and included legend, if the number of emails I received are to believed. This week, the awesome UI progression submissions continue with Kiela's UI, a story that spans expansions and some excellent insight into how user interfaces evolve over time. Do you hear the clatter of bone and steel coming up the tunnel behind you? That is the sound of your impending Reader UI of the Week.
Take us home, Kiela:
Aloha from Stormrage.
I know that the last Reader UI you posted had a similar story and theme (progression of the UI) but I promise that I was already planning on this, lol.
My UI tale goes back to before I hit 80 on my shaman. My main is a Hunter who has been 80 for some time and actually raided with a similar UI to this all the way to ToC.
At lvl 65 I realized that my shaman was truly a resto. I had no interest in dealing damage with her at all. This was my first healer but I immediately saw the benefit of having the party/raid frames lower down and closer to the action. In the middle of my first healing task (Utgarde Keep @ lvl65) I quickly pulled my party frames down in between pulls so that I could get to them easier.
Eventually I got tired of lunarsphere. What was once awesome and cool soon became simply clutter and painful with no updates to address changes in the game. I had also grown weary of the "X-Perl" look so I decided to revamp my entire ui. Starting with my hunter I switched to Shadowed Unit Frames and Dominos. I discovered power auras through a mage friend and quickly fell in love.
I finished off ToC and entered ICC with this UI and it served me fairly well, soon, though, before clearing Lower Spire I switched to Pitbull because Shadowed was behaving weirdly and I realized that I could exercise total control over my raid frames with Pitbull, fitting any size raid into the same relative space. This was truly something I yearned for as I began to realize that I really wanted less, not more.
Finally, about a week ago as I was perusing some really fantastic minimalist UIs I "saw the light" so to speak and realized how my UI had been failing the whole time. I had no solid direction, no plan of attack, no "theme", as it were. I quickly grabbed some paper and sat down to it, iterating over ideas and it hit me. I needed to whittle down what I wanted on screen to a small list. What was absolutely necessary for me to perform my job as a healer?
I quickly ran to a co-worker who also has a resto shaman and shoved my list in his face inquiring whether I had left anything off. Once I was satisfied that, no, I had not left anything off I quickly returned to my sheets of paper to place these items ever so delicately. The end result left me thinking "wow, I just might get this done right this time."
I showed it to another co-worker who plays a priest and he declared his intent for possessing a copy of my UI once completed. This positive feedback served to motivate me last weekend to disregard my guild mates and friends. I hunkered down with a clean symlinked install of WoW and began downloading each add-on to it's new home. I logged on and began positioning things, remapping keys and clearing my bars. By the way, when you are running dual installs for this purpose, remember that you moved your buttons and remapped your keys before you decide to go raid on the regular install... the results can be bad.
In the end, I have both friends eager to use this UI, one of them actually brought his laptop to my house to have my copy everything over and set it up for his paladin. I am excited and I think I may have found my perfect shaman UI.
I have not decided yet whether I want to use DBM, which I am familiar with or BigWigs which seems to be a lot more customizable visually to fit with the rest of the UI, so I have no included either in the list below.
Thanks for the awesome email, Kiela. We have a lot to talk about this go-around, especially with all of the issues of user interface tweaking Kiela's UI expounds on. Like a good user interface, we need a plan of attack.
Thematics -- not just for high school English class
Theme is, and always has been, the most important aspect of a clean and crisp user interface. The ability to plan out a road map for the future of your UI design allows you to make decisions that fit nice and neatly into the parameters you have already set for yourself. The theme gives your UI rules that you can then abide by. The last thing you want to happen is to let your vision get in the way of practicality.
Take some time to do what Kiela did -- place your role at the forefront of your decisions. Since Kiela is a healer, the core healing requirements were what shaped the user interface. For healers, user interfaces revolve around robust group and raid frames, coupled with an action bar setup providing ease of access for many different healing spells and a macro system or Clique-like interface to increase reaction time during the battle. After you have that basic premise down, you can begin to design around the main attraction.
When I was designing my tank's user interface, the number one rule was that screen real estate had to be clean and clear -- I never wanted to have to "look through" an addon in order to assess the situation as the main tank. Everything needed to be on the periphery, so to speak, so that my field of vision was clear. The design took shape from that, with pieces falling into place as the design process went on.
The action bar dilemma
Notice one of the huge differences between the early user interfaces and the later incarnations is the lack of profession buttons and having less-used skills on action bars as opposed to living inside the spell book. Blizzard promises a completely revamped spell book come Cataclysm, but for now, the spell book is a functional menu that might be a better alternative than crowding your screen with profession-related buttons. I will cop to having my professions on bars, but I made them nice and neat in their own little area to flesh out the bottom row of addons. If you are going to keep your professions and other similar buttons out on an action bar, keep it simple and small -- those action bars take up some decent space and are usually in the running for first to go when you're cleaning up your screen.
One simple way that I choose what goes on an action bar and what stays in the spell book is asking myself this question: When I am surprised in combat or PvP, do I need to hit the button? If the answer is yes, it belongs on an action bar. If the answer is no, I am safe to assume that the ability can be accessed at my leisure inside the spell book.
kgPanels -- UI Botox
You all keep asking for it, and in a few weeks you will get it. I'll be doing a full feature on kgPanels and discussing some awesome tips for making awesome borders and other artistic elements into your UI. For now, marvel at how a simple, uniformed border design can bring out the beauty in a user interface. I love the double-line look of Kiela's UI -- simple is always better than cluttered.
Lines are powerful things. We like borders and containers as everything feels like it has a place and a purpose. It's like a really well organized kitchen cabinet. Everything is where you need it, is accessible, and there are defined boundaries. Think in terms of boundaries and your user interface will fall together nicely, just like Kiela's. Giving yourself those rules to work by make decisions easier and the ability to judge whether something belongs or not much smoother.
A thought about DPS meters
DPS meters are a handy thing to have on screen, and Kiela's work very well with the overall motif. Personally, I would have toned them down a bit. While the elongated bars are used to fill space, I would have cut down on the bar size to make room for some extra buttons for less-used cooldowns or even the minimap to keep the upper portions of the screen clear for the buff frames. Of course, that is all dependent upon whether you even have more buttons to add or are used to seeing your minimap in its default location. Again, just my personal preference.
Thank you all so much for the amazing submissions these past few weeks. I have been getting some awesome suggestions and submissions, so stayed tuned next week for some more awesome ideas. Remember, if you are going to submit your user interface to Reader UI of the Week, please make sure that the pictures you submit are large enough for me to do whatever I can to show some detail, as well as give a little bit of insight into your design and what was going through your head about what is important to you. See you all next week!
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.