Click "Sleep" for a dark background.
Click "sleep" again if text isn't dark.

 

Tuesday
Nov252008

LBP Workshop: Shapes & Space

The purpose of this article is to give you a crash course into the seemingly infinite depth and variety that can be represented using shapes in an organized space. This investigation will cover a bit of art, science, and game design so brace yourself for a diverse divulgence. You might be wondering how any of these topics aside the obvious game design, could help you make better LittleBigPlanet levels. It's simple. LBP is a platformer at its core, and where there's a platfomer there are platforms. The space taken up by the platforms is a shape. Likewise, the space that's free to jump, flap, boost, swing through, are shapes. By better understanding the relationship between shapes and space and how the we reacts to these shapes, we can design platforms, structures, and levels in LBP that are more effective, efficient, and interesting.

Shapes

Shapes are powerful tools in and of themselves. If you are currently under the persuasion that you've somehow grown out of or beyond shapes, and that those geometric enclosed blobs are better suited pacifying a class worth of elementary kids, please reconsider. Even the basic circle, rectangle, and triangle have be used exclusively to create great works of art not to mention great video game levels.

 

I am continually amazed at how some artists utilize something so elementary producing works with such variety. By manipulating color, rotation, shade, and size, there's already a wide range of options to consider.

I'm sure you're already aware of how curves and straights communicate to us. Curved objects/surfaces communicate organics while straight objects communicate artificiality, and a sense of being man made. But have you heard of the golden rectangle? If not, check out the link. According to the golden rectangle, there are shapes and proportions that resonate with us in the same way that a drum beat resonates with our heart beat. Shapes are everywhere. We're made of shapes. We construct shapes. And as complicated as we think we can make things, nature has a way of beating us to the punch. Oh, and don't forget Fibonacci patterns. Don't underestimate their power.

 

Space

LittleBigPlanet being 2D already comes close to exhibiting the same kind of presentation as a painting. Everything is relatively flat between the two, but instead of exploring a work with your eyes you explore the space in a level by controlling a little Sackperson. Unfortunately, I've already played far too many levels that are cluttered with overlapping shapes and objects. Where paintings can be quite dense with shapes in a limited space, video games must be functional. Putting a bunch of objects too close together (or far apart) can be disastrous to the function of the level. For the purposes of interactive platforming (as opposed to any kind of decorative, cosmetic design) in the shapely world of LBP, less is more. Why? Because of the unique functional relationship between negative and positive space. Never heard of such space, then check out the three quick links before continuing.

I used negative space here that stretches out away from the glass along the surface of the "table."

The reason understanding the relationship and balance between positive and negative space is important in a game like LittleBigPlanet is because it's a platformer. In a platforming game, the negative/"blank" space is all the potential for the character to jump, flap, swing, etc. to. Likewise, the positive space provides the ground/physical structure for the player to land on, grab, jump off of, etc. Without the positive elements, the player would fall for eternity. Without the negative space, the player wouldn't be able to move.

So before we think about spring pads, enemies, hazards, secrets, or any other type of game element, it's essential to understand the potential in the very foundational space you create in LBP. At all times, you must not only consider how interesting your physical space is, but how interesting the space is around those elements. In addition to considering the negative space, you should think of how the positive and negative spaces communicate and interact in the player's mind. Let me put it this way....

Think of the vase, the face, and how the two shapes flip back in forth in the viewer's mind.

There's one more level to understanding how space works in LBP. Unlike many other platforming games, LBP is kind of 3D. Some call it 2.5D. Either way, it's simply a classification that denotes a degree of depth (z axis) to the core design. Essentially, all creators of LBP levels have access to building a level using 3 lanes and 4 wafer thin spaces. In this way, players can make things pop and move much like a pop up book. (If you're in the market, this one blew my mind.)

Now to look at Improvisation #1.

Black lines = layer farthest away.

Gray = mid.

Light gray = closest layer.

Notice how most of the structures are simple shapes, and how the most complicated piece is in the center. For the platforming elements of this level, I thought it would be a great exercise to convert a painting like Kandinsky's into the game. I consider Kandinsky to be a master of shapes, color, and balance. So I figured converting his work into the game would teach me a few things in a reverse-hands-on-engineering kind of way. And it did, which is why I'm writing this article.

As I converted each shape from the painting into the LittleBigPlanet creator, I had to consider how flow, direction, and energy from the painting translated into 3D. Once I had translated the shapes, I had to change the proportions and spacing between everything so that players could not only platform from one structure to the next, but see enough of the shapes on the screen to experience the negative space. With the close positioning of the shapes and by making a few parts move, the entire level developed a unique energy, flow, and motion (more on that here).

I recommend that any LBP creator take a painting like a Picasso or a Kandinsky, and make an exercise of converting the shapes into LBP. If those guys aren't doing it for you, try using fabric patterns. First create the shapes, then adjust the proportions according to Sackboy's platforming abilities, then layer them into the 3D space. Add motion if you like. If you try this exercise, be sure to let me know.

Before I conclude, I'd like to briefly talk about something that can be found in great works of art as well as great music, writing, and (of course) video games. It's called....

 

Internal Energy

Remember when I said that it's important to pay attention to the vase, face, and how the two images dance around in the viewer's mind? The motion of seeing the vase, and then seeing the face (or visa versa) but never both at the same time is what I identify as a type of energy. Just like in many classic optical illusions, you either see the "duck" or the "rabbit," and the fact that the image never completely settles on one in your mind is evidence to the illusion's internal energy.

Duck season! Rabbit Season!

Here are some other interesting examples of internal energy.

  • Older- They Might Be Giants. The internal energy in these lyrics exists due to the inescapable truth in the statements. "You're older than you've ever been and now you're even older." Every time you listen to this song, the lyrics continue to be true, and there's nothing any of us can do about it. The more you listen, the "more true" the song becomes as if there was a slight change that listening to it after an extended period of time would expose some kind of lie in the statements. It's a song about time that plays on the inescapable crawl of time. Thus, the "truth energy" completes a cycle that can't be broken. 
  • Best man for the Gob. The title for this episode is all we're looking at. This title is a 3 layered pun. The well known phrase is "Best man for the JOB." This contrasts with how the title reads phonetically "Best man for the GOB." Both of these contrast with how the character's (Gob) name is pronounced "best man for the je-oh-b." The internal energy is rooted in the endless cycle bewteen your inner ears of the known phrase, phonetic reading, and the special case for the character's name. Try to settle on any one of these three and your own brain will coax you back toward the "middle" so that you're stuck in this hilarious and wonderful pun.  

Out of my own fiddling and experimenting with LittleBigPlanet's creator I created a structure that was absolutely captivating (at least for me). There was something about it that drew and held my attention effortlessly. I found myself gravitating back to this structure and just hanging out like kids sometimes do on playgrounds where just being in the same space as a jungle gym can fill one with a kind of unadulterated glee. I knew the structure was pleasing to me in an artistic sense, but now I can explain why it had such a profound effect on me. I had created a structure that contained a cycle of internal energy using the positive and negative space of simple 3D layered shapes inside of a golden rectangle. Basically, every concept that was covered in this article was exhibited in this structure.

Unfortunately, when my LBP file corrupted and exploded, I lost this shape. Not to worry. I jotted it down on paper before the corruption and I believe I can recreate the magic. Rather than draw a picture of it, I'm more interested in creating it in the game and letting you experience it for yourselves.

edit: here it is.

Stay tuned for that and more exciting ventures into design whether from art or video games. After all, video games aren't art because they can contain well established art mediums/forms inside them. Video games are art because they impact people in the same fundamental ways that all art forms do and then some due to the added level of interactivity.

« LBP Workshop: Contrary Motion | Main | Improvisation #1 »

Reader Comments

There are no comments for this journal entry. To create a new comment, use the form below.

PostPost a New Comment

Enter your information below to add a new comment.

My response is on my own website »
Author Email (optional):
Author URL (optional):
Post:
 
Some HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>