Jimmy Chattin - I make better games.

Thursday, October 10, 2013

Designing Contest Visuals for Bungie - The Nightmare

--- NOTE: This is a post that was lost a few months ago.  It's back, ready for your review and comment.  If you forgot the last Designing Contest Visuals post, read it here!

Bungie is a world-leading game development studio with an awarded mantle of games.  The Halo series serves as the pinnacle of the company's accomplishments, but the design team has moved on to new ventures.  Destiny is the next title coming from these champions of entertainment, where the hope is to outdo even Halo.

Bungie has been hosting Destiny themed contests for most of this past summer.  I've tried to be a steady competitor, so I'm here to talk a little about the design considerations used in submitting.
___________________________________________________________________________________

The second Bungie Destiny challenge I submitted to was "Your Worst Nightmare."  Spoiler:  My piece got a lot of backing.


Halo CE and Halo 2 were both games that contained an element of horror that has never been emulated in Bungie's other titles (though Halo 3 came close).  Contest was asking for something nightmarish be put into one of their screenshots, so, if something terrifying was to be made with Bungie content, it's fitting to use something from the studio.  Hence, I chose the slime, the green, the meat of the Flood.

A lifetime of playing, reading, viewing the designs of, and enjoying the universe of Halo told me that tentacles and gooey are 'in' when in comes to terror.  But, since time was short, the main form of the worm-like figure I needed was constructed by lassoing parts of an enemy character from Halo 3 to give quick blocking and a free color-palette.

Having so much room to play in, the piece needed to have a flow - successful visual design will focus the eye to the primary point of interest and then guide the viewer to the rest of the picture.  Curving appendages, the point of the firearm, and the angle of the overhead beams helped utilize the whole space.

A black maw next to the harsh light-source was chosen because it is a common (and almost required) technique to put the darkest darks next to the lightest lights.  It is beneficial to add a bit of mystery into any concept, so the inner glow coming from deep inside the monster's gullet added a bit of dread.  "I should be running in the other direction, but I want to know what that comes from" is something that any viewer should be asking themselves, especially in a video game horror scene.

The smoke from the firearm indicates that rounds were just fired, while the orange-glow barrel shows it must have been shooting for awhile.  The "000" of an empty clip evokes a sense of hopelessness given that the viewer has thrown everything at the opposing beast, seemingly to no affect.

After getting feedback from fellow designers and honest friends alike, I must emphasize that a room's light-source needs to be reflected by all the objects in the room.  Adding a color filter over the entire image removed a lot of the blue from the provided photograph, hence leaving the subject matter in a similar environment.

In my honest opinion, any artificial addition to a photo ought to interact with the environment in some way.  Certain tentacles and the bottom recesses of the creature help suspend disbelief that the new subject does not belong.  Then, equipping any digital object with a grainy texture (credit to Dan LuVisi and his tutorial) gives it a photo-realistic touch that saves hours and hours of rendering.

Finally, anything that I wanted the viewer to see first was kept saturated and lighted.  A slight blur was added to the entire work but erased in areas that should show-off details.  Next, the speed-lines actively draw an observer's gaze to the creature's face and provide a roadway back to it if the eye wanders.


All-in-all, I felt I really nailed the whole work.  The lighting is there, the focus areas are appropriate, dread is evoked, and it was completed in a timely manner (approx. 8-10 hours over 2 days).  The creature design is a little boring, but when taken into a game engine and put with an already gloomy area, this fits.

If you have questions or comments on why I did or didn't do something with this piece, I'd be very happy to address them.  In the meantime, checkout the piece and read more about the design process.  As to setting up how my Bungie submission got the backing it did to come out on top, well, that's for another time in explaining how to use social media.

___________________________________________________________________________________

In the next round, a number of movie posters get a Destiny twist of their own.


Sunday, October 6, 2013

What I Learned - 12

Not a whole lot this week, but there's talk I'll be applying what I learned in a professional way soon!

What I Learned - 9/29 to 10/5






Wednesday, October 2, 2013

Cow Tippa! Board Plans


Do you know how awesome white boards are for planning games? And how paper prototypes bridge the gap between designers, programmers, and artists? Well, let me show you some cool stuff on the game, Cow Tippa!

At this point, [Pending] - the team - only had "agriculture" as the theme we were to use.  One of the first ideas was to 'farm' enemy units like a player does in classic MOBA (Multiplayer Online Battle Arena) fashion.


From MOBAs, we came across the thought that Creeps (farmed units in MOBAs) would be another player's crops, where if you could destroy enough agriculture, you'd come out on top in selling your crops.

In this picture, you can see that we started playing with the mechanic of tipping cows...


Running with the bovine line, [Pending] figured that a bunch of cows would be better than just one.  With a never-ending line of cattle, the game would never end, but more points would drive the player to new high scores!


One thing hit right off the bat was whether to do a top-down or side-view of the moving animals.  Because of my concern over a quick schedule, the argument of how long many different layers in a side-view would take to code and test was made, and a top-down view was secured.


Paper mother-lovin' prototyping.  This is the first one I constructed to get a feel of how a gauge like those in golf-sims would impact an experience.  Moving the cow pieces while handling the gauge allows another player to tap on the table to represent clicking.  What we felt at the end of the experiment was that the mechanic was just OK.


Coming into Saturday, I just couldn't support the gauge idea.  Having gained the element "volcano" (our game needed something to do with a volcano), I proposed a simple context of tipping cows into a volcano.  Easy!  However, making 2D objects (we decided to use 2D Toolkit with Unity) go in a believable circle was not so easy...


During the process of making a 2D circle path in Unity, I had drawn a possible UI setup of the game, with our angry volcano god in the corner with the volcano in the center.  I gave him a hat and a stern demeanor.  This was done completely by accident, but became a feature in the final game.


After about 2-3 hours of trying to get circular pathing to work (and with a personal apprehension that it would be too intensive for our time constraints), you can see the single bridge design on the far left of the board.


Here we see a few notes on benchmarks we wanted to meet with a diagram of what objects needed to do in code.


Those big, blue rectangles in the middle represent what could be done with the game on a mobile screen.  Some ideas were used about putting a farmer tipping the cows on a platform in the middle of the bridge, but it was soon scrapped for being out of context.


Saturday's work in progress.  It is apparent that cows can hang in space; didn't everyone know that?


To show how the player was doing, one of our programmers suggested getting the volcano god angry.  To fill what he had in mind, I put up a few changes of face for our deity.


Screen time!  If you are already ahead in mechanics and design, menus can become important (though, they do little for a game).  There are a few layouts present in what could be done, with in-game screens, instructions, starting frames, and credits all present.


To do a background for each screen, I needed a set dimension in which to work in as the UI visual designer.  Heads-up: Cow Tippa! is 960 by 600 pixels.


Say hello to Feature Creep, the hat-wearing, suit-owning, tentacle-legged... thing.

And Shuckle.


Did I mention that donkeys made it into the game?  Whenever a donkey is knocked into the volcano, the god, for a split second, looks like this meme.


Just more of the same.  We were changing things on the fly, both visually and in code.


I really am all about the prototyping.  Not sure when this was completed, this design was during the early hours of Saturday, where the power gauge was still on the table for consideration.


One more!  Here is the best rendition of what the final in-game screen looks like.  Before creating any UI items, I ran it by the entire [Pending] team to see what they thought of our game's layout.  Though the "Cow Points" are now called "Score" and a bit smaller onscreen, and that the title is missing, this is what a player sees in the game.


And, in the wise (summarized) words of Jonathan, our project manager, paper prototypes are good as, if for nothing else, examples to show designers, programmers, artists, and waiting-in-line players what the game actually does.


Or doesn't do, in the case where the cows were drifting off the bridge, which could be shown to the programmers without having to recreate the issue!



I hope this was helpful in getting some insight as to what went on in team [Pending] making the action-packed game, Cow Tippa!  The team is working on improving the game a little more, so this article will be updated with new builds in the future.