Evolution of A Game's Background: Boxdrop Edition

I created Boxdrop for Merit Industries back in 2004, I wanted to document the process I went through to make the final look, and here it is.

I always wanted to document my process of creating various elements for a game...
Back in Spring of 2004 I was the Video Arts Manager at Merit Industries.  Now AMI Entertainment, Merit was the creator of the Megatouch touchscreen gaming system.  Every year we were tasked with creating a bunch of games for our Fall updates.  This particular year I was given the OK to design/develop a game of my own creation.  I was totally excited!!!

Seeing as how our quick-paced card/math games did, I decided to create something along those lines, sans cards.  The result was Boxdrop, initially I called it Skailz.  What I wanted to do was create a game like Run 21 (one of our most played games, at the time) but with a bit more depth.

Boxdrop consisted of 4 scales with an order number atop each one.  The player had to place randomly drawn (numbered) boxes on one of the four scales.  When the boxes added up to exactly the same amount as the order number, the scale was cleared.  A bit had to explain but easy to play :)

So, after all of that, why am I sharing this with you all?  
Well I always wanted to show my process, via renders and screenshots, as to how I got from the initial idea to the end product.  So I figured why not start with this game...  throughout my career I have always placed this game into my  'My Baby' folder.

So let's get this party started right?  Let's begin with the initial looks - then I will show various renders of the final look.  Maybe later I will update with a chat about UI, but for now I wanted to talk about the overall progress...

Screen 01 - In the beginning...

This story actually begins back in 2000.  During some free time i wanted to flesh out an idea I had in my head.  The original concept was called Skailz.  The game design was still being kicked around in my head, so I wanted to just focus on the 'look'.

So at this moment my "look" was part space-metal boxes in a back alley.  And, please, let's not get into my multi-font design issues - LOL
Screen 02 - Enter the claw!

So yeah, things changed ALOT from the first one, right?
After some thought, and coffee, I decided to take the game inside - and start getting really industrial with the look.  As you can see there is still a good amount of that space-metallic look going on (sometimes i feel like i need to apologize for it - lol) but I started to bring in this storage/warehouse environment.

The claw element was brought in because as I was visually designing I was game designing... and what I was missing from the first screen was 'HOW ARE THE BOXES BEING DROPPED?'

(Please Note: I always had a need for the game to make sense visually - i always needed the boxes to come from somewhere - go somewhere - etc... over the years I have eased up on this mind set but for this project i was ALL ABOUT MAKING SENSE! :D)
Screen 03 - Lasers and Flipping Up

So it looks like i did a complete redesign again - and mind you we are only on the 3rd screen - 4 years before i even got into the final look.

So with this pass I decided to do what I always did around this time.. "What would the UI look like up top?'... i also went a bit more into the space-metallic look, replace the cool crane with a haunted TV AND I ADDED LASERS/LAZERZ

The lasers and side numbers were added because i had this great idea to make the game incredibly difficult and hard to play, as you will see in the next screen i removed these elements :)
Screen 04 - And now we are getting somewheres...

so in this pass above I decided to take it a step further. i took a step to the right and decided to make a new path. the previous passes were becoming more and more bulky and this pass was a bit more light, readable and (maybe) still a bit too space-metallic.

i also removed the lasers (sorry) and side numbers but i did manage to keep 30 different fonts in their.

i also made real-looking boxes! finally!!

this passes up until this point were created back in 2000, but even they lay dormant for years they set the foundation on where i wanted to take this game when it was finally approved in 2004
Screen 05 - A new hope...

So, again, it's 2004, 4 years since I made the preceding screens.  Many things have transpired... i have loved, i have lost, i have loved again AND i learned alot more about 3DS Max :)

So sure this is a blank room, but let's think of it as a blank canvas that I am about to do in the following screens.
Screen 06 - Lights. Camera. Render!

Having decided to go with a rather industrial color scheme (dirty, grungy) I started to layout the game in 3D space.  

Here I add in the 4 places for scales AND how tall they should go.  On the far left is where the 'to be dropped' box will be displayed...Im not too too worried about lighting and textures at this point.
Screen 07 - Where will the rabbit hole lead?

Added in tubes that would cover the 'where do the boxes go/come from' question in my head.  Again this is still very early.
Screen 08 - What the duct?

So in this pass i decided to add some duct work (that the boxes would be travelling through).  I also gave the tubes some grungy metallic textures.
Screen 09 - Time to reflect on textures...

So in this pass I removed the duct system (too box-y and boring IMHO) and I replaced it with some girders and longer pipes.  This is where i began to think of this as a complete room and not a hodgepodge of random pieces and elements.

I also started texturing the scales themselves - and added some reflections!
Screen 10 - I was framed, i tells ya!

So in this pass i added a frame to the design.  I felt that this environment needed a natural framing mechanism. so what makes sense here? a BIG garage door!

I also brightened the scene a bit - it was getting too dark, for my taste.

I removed the block structures on the floor and let the scales have a look of their own.
Screen 11 - Floors, Walls and Scales - Oh My!

So in this pass, i started to think about the walls and flooring...  still keeping on target with the industrial warehouse theme. I made some overly worn down walls and a caution taped floor...  

NOTE: This is just the beginning of the room!  Little did i know that, at the time. ;)
Screen 12 - What's under the under?

Who doesn't like some depth? Well maybe lovers of a 2D world may now, but i love to give simple spaces some depth.  Something that makes you think,"Hmm where does that go?"

In this pass I created a subfloor from which the scales and other environmental elements came from.
Screen 13 - Return of the Arrows!!!

This pass was a three part affair...  (1) i wanted to add a door, because you have to get into this room from somewheres else (2) I needed to put some flooring over the subfloored spots, for safety reasons - duh! and (3) I brought back in the arrows.

"But what are those triangles at the top, Chris?" you may be saying.

Well the triangles up top are meant to be a holder for the total number for that scale/order - and the arrows are gameplay controls for picking where to drop a box.
Screen 14 - PRODUCTIVITY!!!

I think that during this pass I decided to get crazy with content, room development and lighting - and and some effects.

So what is a warehouse without random boxes?  It's stupid - that's what it is.  So i added some boxes AND a fencing system to protect people from crazy gameplay!

I also worked on the lighting.. nothing too too drastic, i just wanted to add some cool crispness to the environment.

Lastly i added some mysterious fog to the room - and then i later pulled it.. hey, i can be fickle too ya know! :P
Screen 15 - Room-evolution

So here is where my need for things to make sense went plaid**

First off, I decided to fence off the entire background.  The box shelf elements were a bit to eye-catching and i needed to bring the focus back to the foreground.

Secondly - It was time to attack the 'incoming box to be placed' area... 
So the idea was to have the box drop through the pipe (the one w/o the triangle sign) and land on that metal device.  When the player picked a scale to send that box to the top of the metal device would open sending the box to the proper scale.

I decided to add the clear tubing (far left) so the player could see what boxes were coming up next in the queue.

**Spaceballs reference, for all you kids out there! May the Schwartz be with you!
Screen 16 - Sh*ts getting real!  (AKA There's a lot of game designing in this screen)

So again - being content with the background elements,I really wanted to work out the foreground devices.

So again - lol - i evolved the environment...
Not to be redundant here but to avoid confusion... the 4 elements on the right are the 4 drop tubes and their 4 scales (with drop arrows).  On the right I decided to create a 'discard pile' device.  So instead of the current box dropping onto the metal device.  I had the next box roll in from off screen left into view.  The player would then have to press any of those 5 arrows to place that box onto a scale OR onto the 'discard pile'.  The box would get vacuum sucked up and drop down through any of the other pipes.

The cool thing about a discard pile is that it game players some room for error but in a finite space.  once the boxes stacked high enough it would block the discard pile.  I'm a genius, i know - lol jk jk :)
Screen 17 - Turtle Wax Time

So in this pass I just dotted Is and crossed Ts...

- I themed the discard pile as a RECYCLE pile
- I gave the conveyor belt some structure - just a simple frame
- I added a space for a (end game) button
- I tweaked the look of the arrow boxes... just gave them a little texture-personality
- I also turned the triangle signs into rectangles because i needed to cleanly fit 2 characters into that space. 

And, again, here is the final design, with UI and boxes.  The UI itself is rather minimal because i wanted the game environment be the main attraction, of course.
Well I hope you enjoyed this project post, as much as i enjoyed the stroll down memory lane.  This is my first posting of this kind, so I would love to hear your comments, thoughts, how to make these project posts better, etc.

Back to Top