The Design of TSM4

The TSM Team has been hard at work for a very long time to bring you the TSM4 beta. We wanted to give you some technical insights on what goes on behind the scenes. Today we’ll be taking a closer look at the Design of TSM4. H3ggers will be joining me to answer some questions!
I asked him three questions, and he’s been so kind as to offer detailed answers to them.

On a high level, what goes into setting up a UI from the ground up like this? How much of the old UI gets taken into account, and how do you decide what is best from a user experience standpoint?

Great question. So for any UI/UX work, it’s always good to start with research. Whether you’re working on a brand new product or something that has been around a long time (like TSM), you always want to start by investigating. You focus on what has been done, is being done, what’s working and what isn’t.

With TSM, I had a great leg up in that so much thought has already been put into it, especially in terms of what its features are and what users have wanted added over the years. So yes, the old UI was extremely important from the perspective of starting fresh. The old UI really tells a story about how TSM has developed over time, and why, what its strengths are but also what its weaknesses have been. So it was super helpful when setting out what we would and wouldn’t do from a “refresh” point of view.

As far as going from there and making decisions, I wanted TSM4 to not stray too far from its core competencies, but overall feel more approachable and intuitive. TSM is tricky in that it has always been perceived as a “challenging” addon, with a very steep learning curve. And a lot of that I think has to do with the fact that it has very advanced features comparative to other addons on the market (what other addons can you name that essentially have the equivalent of a file management system within them?). So just the scope of what you can do with TSM is a bit staggering for a new user and I think in some sense, always will be.

But that doesn’t mean there weren’t gains to be made that would help us hit our goals of being more approachable and intuitive. I think in TSM4 we were able to really think about how certain features would be organized and maybe move away from some things in TSM that didn’t really make sense (I’m looking at you ‘Features’ tab).

From a purely stylistic standpoint, what was your thought process on what TSM4 has come to look like? Why did you choose the colors, shapes and style that you did?

Stylistically, TSM operates in an interesting space. Historically, the look of TSM has developed through what I would call a “path of least resistance” mindset. We’ve added and improved upon features but haven’t really thought through the design outside of, “what sort of component do we need in order to achieve X/Y/Z, and where can we place it?” And while this has been done thoughtfully, with great concern for usability, I felt it had led to a somewhat scattered design aesthetic. So my first thoughts about style had to do with just keeping things clean and providing a less cluttered experience.

After that, it was really a matter of what sort of tone and personality TSM needs. I find that addons are a really unique design challenge, because you have to decide if they should align closely with the game’s default UI, or carve out a style all their own. With that said, I opted to keep a clean, modern aesthetic that wouldn’t diverge too much from what existed and wouldn’t be too jarring for our users. Down the road I think it would be cool to think about ways in which we could open TSM, stylistically. One of the early things that always impressed me about TSM was that it had a pretty robust appearance editor. Unfortunately, we rolled that functionality back for the time being due to the nature of the overhaul; I’m personally hoping we can bring it back (in a more structured way) at some point, and possibly even augment that feature with things like “UI skins”. TBD obviously 🙂

Are there any constriction points where looks and function conflict with each other? In such a situation do you make concessions, or look for a different solution?

Hah, oh yes! Design is always about balancing your stylistic goals against usability and feature requirements. The team and I had many conversations about certain design choices that might conflict with learned behavior and expectations from our users. I know that I’ve certainly conceded some ideas in favor of keeping a certain workflow or feature in tact.

This is one area where I really like to look at what our users are saying. There are so many unique aspects to TSM, and our users have all developed different ways of approaching certain tasks. Being able to engage with our community and test certain ideas out with them is really great and I hope that we’ll only continue to grow that process as it makes designing a lot easier.

That wraps up this first Technical insight into TSM4! We have more planned for you so if you enjoyed this content be sure to keep an eye on our blog!

1 CommentLeave a comment

  • Overall, TSM4 is an improvment over previous releases, but some of the design flaws (omissions?) got carried along to the new release.

    1) I really want a AH search tool that makes the one built into WoW look like a child’s broken, crap smeared magnifying glass. The idea of shopping groups is fine and seems like it would be useful at times, However, I am more focused on the exact constructions of my favorite searches and want to be able to save or not save any search I use to query the WoW DB.

    2) Some peeves/attaboys:

    a) The default search is the simple version. It would be nice if one could set the default to Advanced Search. For some strange reason, as a Computer Scientist, I was taught a lot about formal logic, boolean operators, RegEx expressions, etc. and would like to be able to use them more easily in TSM

    That means that if I complete a query about enhancements to head gear, I should be able to go up to the query just done that is displayed at the top of the page, and change ‘head’ to ‘neck’ and click rescan to run the modified search.

    As it is, when I change anything in the displayed search after it is run and try to re-run it, the query reverts back to the pre-modified version e.g., I end up running the same search as before.

    b) There should be user controlled defaults for ‘Search Usable Items Only?’ and ‘Exact Match Only’? I used to have fun explaining arbitrage to WoW players back in BC days. Now I rarely search for things one of my toons cannot use.

    c) ‘Maximum Quantity to Buy’ should also have a user-configureable default, but without user meddling, a default of 1 would be helpful to start out with.

    d) Kudos! The ‘Required Level Range’ and ‘Item Level Range’ are very easy to set with great precision.

    e) TSM4 seems to be mostly (completely?….nah, not possible) free of serious glitches. I have not used more than a few of its features, but the ones I do use seem to work as advertised.

    f) I wish TSM had a way for me to exit and leave TSM running minimized, much like Curse used to and Twitch now does.

    3) As I mentioned above, I tend to approach AH searches at the query line level and want to be able to edit the query I just did to do a slight or major variation on it. A help screen with names of where gear goes and a description of what kind of gear an item is would be helpful. For example, I might want to search for an Enchanting item enhancement for a robe, or maybe I am looking for mage armor that goes on the back. A quick pop-up cheat sheet with information such as:

    Back: Robes and Cloaks….are items worn on the back.

    Mages are my favorite character class so I suspect there are heaps of other names for things that go on the back that I do not recall at the moment.

    I bet Blizzard already has such information in a concise format for use in-house by WoW developers. Maybe asking a GM nicely would get you the information quickly without much effort. A lot of programmers and not familiar with the terminology of medieval/fantasy armor, spells, etc. but I bet some of them learn it quick when they start working for Blizzard.

    4) Slow scan works as advertised. Normal (fast) scan also works, it the server is not very busy. Back when I was spending what seemed like half of my game time on AH activities, I found that a full scan twice a day was almost always sufficient, and scanning just once a day would do fine as a practical minimum.

    If the TSM authors want more of my sage advice about how to design a query tool, you have my email address and we could go from there to chatting on the phone. If they do not want and do not use my input, TSM will certainly be more simple and easy to use. The stuff I want to see modified/added is of interest to power users, for the most part.