Dev Blog: UI Update
Hi everyone! My name Mike and I’m one of the UI Artists on Star Wars Commander. I’ve been on Commander for almost 3 years and have helped design all of the UI in our game since launch, including the Planets and Squad Wars features, and most recently, our UI update. As someone who has worked on this game for a long time, I know that feedback will be both positive and negative, but I wanted to open up some communication to give you insight into why we redesigned the UI and also to address some of your concerns.
Updating the UI of a live game is definitely a challenge, and one we did not take lightly. You guys have developed play styles, patterns, and habits based on existing UI, so we didn’t want to change anything too drastically, or else everything you learned would be lost. We also didn’t want to move things around where you couldn’t find them, so we mostly kept things in their original places. The version you see today is something that we’re proud of and feel best represents Star Wars Commander moving forward. It’s also a culmination of a lot of input, both internally to our team, externally with other creative groups within Disney Interactive, and also the final approvals with Lucasfilm.
So, Why did we update the UI?
1. Simply put, the old UI became outdated. Our original UI was designed 2 and a half years ago, when the landscape of our genre was vastly different. It was more playful, bubbly and glossy, definitely more catered to the general public. But as we’ve progressed over the years and our game has advanced, we found that the general playfulness of our original UI no longer reflected the game that we’ve become. Our game is a more advanced, tactical, strategy game, geared towards a more advanced user, and our interface needed to reflect that. I’ve personally never worked on a game where I was able to update the UI. You typically release a game, and that’s it for the UI, you just keep adding content and features. But the fact that we were able to update it, meant that there a lot of people in our organization that believe this game has more room to grow.
2. We wanted to utilize the larger screens of new devices. Also when we launched almost 2 years ago, the largest phone size was probably an iPhone 5/5s, and the average user had an iPhone 4/4s. If you’re familiar with app development, you know that you have to design for the lowest common denominator and scale up, so all of the UI was built around those tiny dimensions. But as you know, phones are just getting larger, and our UI was always fixed to that small size and never utilizing the space. This created a lot of problems as we continually added new features and more information. So now you’ll notice most of our main dialogs are fullscreen, which gives us more room to show troops, starships, heroes, buildings, and their information. It also allows us to build upon these dialogs to add more information and content as we see fit.
3. We wanted to showcase the characters. Star Wars, in every media genre, has always been about the characters, and ours should be too. Our previous 3D models were never meant to be shown any closer than the top down isometric view, which limited how we could present them. But how cool would it be to see a battle replay up close? Or create larger environments where you could interact with the Characters? This is now possible because of the work that was done in up-scaling all of those assets. However, as you know, this is a live game, so we can’t completely change the gameplay experience, or else everything you were used to doing would be different. So the first places we thought to roll out the new higher res 3D models, were in the troop training and info screens. Places where time isn’t a factor, and choices wouldn’t be affected by a different camera angle. This is why we kept the original angle during battles, so you would still recognize each troop as before.
4. We wanted to showcase the environments. Not only is Star Wars character centric, but it’s about the planets. Our old UI style was heavy, too detailed and really took attention away from what we wanted you to focus on, which was the planets and environments you were playing on. So we simplified the design, lost the bevels and strokes, while still keeping it Star Wars. This allows us to really bring attention to areas of interest, rather than lose your focus on distracting UI.
Ok, now the fun part, I want to address some of the direct feedback I’ve been reading from a few of the threads to let you know that, yes we are listening!
PhoenixAZ1899 – I will say my chat takes a really long time to load. Like, 15-30 seconds after I press the button to see what everybody says. If that’s the worst of it, good, but still a tad annoying.
Zero-Alpha – “The Chat Loading Screen is a mess – takes forever to load now.”
DarkRebel – “The initial loading of the chat messages took too long. DEV, can you address this ? Are we trying to load hundreds of messages right off the bat here ?”
RebelYell actually nailed this one: “My guess is that the chat lag was (invisible) always there in the last version. Startup, After returning from scouting attacking, after Base Edit. They now moved the lag where it belongs, to the chat. That is bearable for me. Much more bearable than to have the lag after i.e. scouting -every- war base. So the reason is possibly their slow chat server.”
So yes, we are loading a lot more messages and updates because of Squad Wars. And to minimize the loading every single time you return to your base from scouting or an attack, we front-loaded the loading to the initial chat opening.
More Detailed War Log:
spoock1 – “I would love to see a little more detail in the war log. Maybe mention the squads we faced and not just the results. Maybe even a list of the members that were in each war? It looks a little bland right now.”
WhoDaMan_YodaMan – “Would be cool for the squad wars log to record all attacks. Would be fun to see what took place when I was offline. Also would be nice to see who attacked me”
We created the War Log as a solution to a couple issues found after we launched Squad Wars. One, people were unable to collect their rewards before the new war started, which is why we initially had a 24 hour reward period. And two, that 24 hour period prevented people from immediately starting a war. So now with the War Log, your uncollected rewards will be available, and you can immediately start a new war! Also you will be able to see the Squad you battled in the log moving forward, it just won’t show retroactively.
SoCal_Hawk – “The HUD is so large encompassing the screen, I’m worried I may develop tunnel vision! Obviously my device is smaller than most players, but I’d have to believe the aspect ratios are the same.”
Billbartley – “The new interface is too hard to read on my iPhone screen. I wish I could revert to the previous interface’s font sizes. Even with my reading glasses, it is hard to read the texts. I can play more comfortably on my iPad tonight, but the gaming experience on my phone has dramatically been reduced by the new interface. Bring back the larger fonts or add an option for us visually challenged old folks.”
Viledoom – “even on my iPad mini the screen is so cluttered with icons it’s difficult to scout the base I’m potentially attacking.”
Whether the UI is bigger or smaller might really depend on your perspective. Dialogs are bigger obviously as we wanted to maximize our space on larger devices. And in general, we did bump up the font size to ensure legibility. In regards to the HUD, it’s actually the same physical size as the previous, maybe even smaller. When you design for multiple devices and different players, you have to make some decisions on size. And in the end, having something be legible and larger will always be better than the opposite.
Gourmet – “I mean the god awful 2-4 pixel space between buttons is still there making scrolling a giant pain… At least make that scroller actually WORK 100% of the time by removing that space or adjusting that area so the whole troop ribbon is a solid scroller!!!”
Thrak – “At least one member of my squad has pointed out how hard it is to tell if some units have been deployed, especially the Imperial Darktrooper, which is already black on black. It would be nice if they put some sort of color cast on used units, as opposed to simply darkening them.”
PCChausse – “SCROLLING to select troops is what sucks, not what the icon looked like.”
DarkRebel – “Remove unwanted troops from load or from SC”
The way troops are displayed at the bottom is designed for a reason. The reason we dim deployed troops instead of remove them, is so you still remember where your troops are. A battle is time-sensitive, and requires quick decision making. Your eyes are moving across the screen trying to strategize where to place your troops, and as you place troops, your eye leaves the bottom row and focuses on the base your attacking. If we removed that troop when deployed, everything would shift over, and you might accidentally select a troop you didn’t want to deploy because it was in the spot where you thought it was last.