Archived Design Notes

PROCESS

Posted by Cysero on

Making a games involves a LOT. Some people think that you just draw and code and presto, you have a game. Launch it and make millions. 

I wish. 

Everything from the characters to the user interfaces go through a million changes and its all part of a process to try and make every screen, every animation, every NPC, every in-game purchase, every punch or jump or sound effect as perfect, fun and pleasing to the senses as possible. I thought I would show you some of the process that I've been going through for the past few days. 

This is the story of the AQ BattleOn Character Create Screen:

1. First the Project Lead or the Lead UI Designer (in our case, the Project Lead, Artix) comes up with a concept sketch of how the character screen should work and how the process of character creation will flow. Once the sketch is complete, the Project Lead will usually talk it over with some or all of the team to make sure that everyone is on the same page and nobody has any questions or better ideas.


AQ Battleon Character Create 1

2. After that, it gets mocked up in a very simple wire-frame form, usually at-size. You can see in the image below that the mock is made at a 16:9 ratio (most modern mobile devices) but the active area is in 4:3 ratio (so it can fit into even older devices and still look good and function properly).

AQ BattleOn Character Create 2 

3. Next, it goes to the UI (User Interface) Artist (in this case, me) who begins cementing the layout and making some of the actual art assets. You can see that I added a bulkier armor to the player model so we will know how much room we have to work with, exactly and began creating some better selection arrows and one of our finalized buttons for CREATE! I created some new cions that work inside the limited area of the circles. I removed the color splotches to indicate a color option, thinking it would look cleaner if we just colored the icons in the circles with the selected color. I also made a nice, long player name to see how a long one would fit in the allotted space. Being me, I made it an awesome name. 

AQ BattleOn Character Creation 3 

4. Then we continue forward. You can see that I've reused some slick AQW assets (J6's art just can't be beat) and combined them with some of the new game's art (like the guardian tower in the distance) to create a nice, friendly background. After looking at the previous version on my phone I thought that the arrows looked too much like the icon circles so I made them solid gold and Yergen comented that they were kind of smallish so I enlarged them and they got a lot more reasonable to hit on a touchscreen. 

AQ BattleOn Character Create Screen 4

5. Next, it goes back to the Project Lead for notes and changes. When it's this far along you can see things that you didn't before like name options on the bottm need a backdrop to make them more visible, and how changing the color of the icon circle instead of the icon works better. A few other small changes were made like getting the clouds and sun out from behind the name so nothing interferes with the readability and fixing the size of the sword to reflect it's actual size in-ga. 

AQ BattleOn Character Create Screen 5

6. Then the file gets passed back to the UI Artist for another round of changes based on the notes from the Project Lead. This can go on for a while, back and forth, if something isn't working or grating on one of the team but eventually it all comes together in the finished mock up. 

AQ BattleOn Character Create 6

7. Once the mock up is complete, each element of the mock is exported at-size as a transparent PNG, taken into Photoshop and exported again because they manage transparency better than Flash's kind of crude exporter (it was never really meant for this). Then all the elements are assembled in a 1024 x 1024 texture atlas, imported into Unity3d and reassembled there to match the mock up as closely as possible, then handed off to the coders for functionality. 

All this is going on at the same time as the animators are working on animating the players, pets and monsters... the artists are coming up combat effects and with new monster sketches, getting those aproved and moving forward with the art... the programmers are working on the core engine to make sure that Character Create actually creates and saves a character and all the goodies like color customization on the various character parts work and so on... and almost everyone here is working on more than one game at a time. 

For example, while I was doing this I was also testing and restesting the most recent round of AQ Dragons bug fixes and rebalancing which will be released soon. I was also in mettings about Battle Gems fixes and what we are replacing the BG Founder package with and a ton of other stuff (like tweeting with you guys and writing this, for example). 

It all has to be done right but it also has to be done fast because I really believe from my experience that no industry on earth moves faster than the gaming industry. Things change every day and delaying the launch of a game, even a tiny mobile game like ours, by as little as a week can mean the difference betwen a hit and a flop. 

AQ BattleOn is still in the early stages of development so there is no estimated release date yet but keep your eyes here on the ARTIX.COM design notes for more info on this and other upcoming projects.