CAGD 495 - Sprint Blog 5

I am the 2D artist on the game Little Arthur. This sprint, I lost a considerable amount of momentum and only completed six points. The very thin silver lining to that is that the highest priority 2D art for the game has already been completed, so most of the art that I have had to complete is effects-related and closer to wish cards. Regardless, I should have completed many more cards and I am going to strive to finish much more the following sprint.

I started this sprint off by completely redoing the button icon backgrounds for character skills.. One of the issues that I faced last sprint but did not discuss was that my programmers ran into constant issues with trying to import UI character skill icons into the actual game. When they would import it, elements would be missing, certain parts would look warped, and the icons looked nowhere near representative of how they were intended to look. I went through several different solutions and tried various things in order to try and fix this. Re-exporting the icons did not solve the issue, nor did exporting out of a different Illustrator file or exporting the files from my home computer rather than my laptop.

How the button appeared, versus how it was intended to appear.

Instead of wasting more time trying to amend the issue, I decided to cut my losses and redesign the icon in Illustrator. When I had first started working on this project, I was very inexperienced with Illustrator and it was a daunting task to try and figure out how to do anything that would make professional-looking UI widgets. However, although I am still a novice, I had accrued enough knowledge to make decent looking icon backgrounds rather than relying on Photoshop. I designed the icon background and then ensured that the buttons would export and appear properly by sending it back and forth between my laptop and home computer to check for any issues. Once I determined that there were none, I was able to move on without doubts that I would have to fix it again.

Some examples of the redesigned buttons.

While creating the new icon backgrounds, I messed around with the exporter and was able to figure out why nothing I did worked with the original backgrounds. The original icon background was a raster object that I made in Photoshop, but in Illustrator, you can export objects as a vector, even if your export includes raster objects. However, there’s a catch. If you are displaying the vector locally on the same computer where you made the vector icon, it will display normally. If you display the vector on any other computer, you have to embed the raster elements into the vector file in order for it to display the raster elements–otherwise, elements will be missing, which is what my programmers encountered. Why didn’t I do that instead of remaking the icon backgrounds from scratch? Simple–without exaggeration, embedding the raster element multiplied the file size by 1000. The whole point of creating vector icons was to optimize the game and keep file sizes small, so although I eventually solved the issue with the old icon background exports, I needed to remake the icon backgrounds for the sake of optimization.

With that problem aside, I made some minor visual effects assets that would appear based on different characters’ attacks. These two effects were a slash trail, and various black lightning bolts to play as an animation. For the slash trail, it was fairly straightforward, and I used a gradient in order to introduce lighter opacity towards one end of the trail and make it appear more dynamic. For the lightning bolts, I simply referenced real lightning bolts and tried to make them as jagged and erratic as possible. I also used the blur filter to create a soft glow surrounding each lightning bolt.

After those visual effects were complete, I got the opportunity to create the game name logo. I had been looking forward to completing this card because although the main menu background was complete, there was no logo or quick representation of our game to be made. The logo came together very quickly–the main thing that my designer desired for the logo was for each of the beginning letters to be drawn with a flourish, and the remainder of the lettering would use the regular game font. I designed the beginning letters so that although they would be fancy, the regular lettering would still be able to sit into the letters and make it feel unified. I finished the lettering, then figured out the best layout for integrating a sword into the logo. King Arthur’s excalibur is important enough to the game’s identity that I figured it would be a nice shorthand representation of the game, hence my choice to place it in the game logo. I wanted to create this design entirely in vector to test myself and give the programmers flexibility as to what resolution it would be exported at. As such, the sword was very intricate and had many layers in order to give it the appearance of an edged blade with different textures and bevels present.

The last cards that I worked on centered around the game poster. I knew that this poster would take me longer than the main menu background, primarily because the level of detail would need to be higher as the characters were the central focus rather than a landscape. I designed a handful of thumbnails for different layouts of the poster, but we decided on one where the four characters are in a tavern, celebrating their victories together. I redrew the very simple line art and added some blocked out colors so that it would be easier for my designer and producer to tell what was going on, and to make a final decision as to whether or not I would move forward with the design. Once I got the green light, now comes the longest and most difficult part of the process that I am still currently working on–the rendering.