Real-Time Motion Graphics: GRID

My advice for the future: Play more video games. Reader Joe Walker recently pointed out the slick in-game menus and motion graphics in Codemasters GRID, and I realized how woefully behind the times I am regarding the practical application of real-time motion graphics as it relates to video games. Motion design is increasingly becoming a key element in video games, blending into UI design and information design.

I couldn’t find good videos of GRID online, but there is a nice review from Gametrailers that includes some decent shots. If you don’t have time for a full seven-minute video, I’ve also made a cut-down version here.

In terms of motion design, GRID isn’t really doing anything new, but it is taking advantage of the amazing real-time graphics processing power packed into today’s gaming consoles. In the comments, I’d love to hear about other games you’ve played that feature motion design. I need to kick-start my collection and do some… uh… research.

NOTE: I contacted Codemasters about their use of in-game motion graphics, but I haven’t heard back from them yet. If anyone has an inside connection there, drop me a line.

About the author

Justin Cone

/ justincone.com
Together with Carlos El Asmar, Justin co-founded Motionographer, F5 and The Motion Awards. He currently lives in Austin, Texas with is wife, son and fluffball of a dog. Before taking on Motionographer full-time, Justin worked in various capacities at Psyop, NBC-Universal, Apple, Adobe and SCAD.

31 Comments

kenneth Lee

The motion design in this game is great! The 3-D type lends another level of sophistication to the game, and it’s laid out really nicely. The exaggerated animation of the information would be almost comedic for a real-life motorsport event, but it adds to the “macho” look of this game.

neRo

VideoCopilot’s Action Movie Essentials in Call of Duty 4

https://www.videocopilot.net/blog/?p=104

Justin

Although true, not exactly an example of motion graphics (great game non-the-less if you are into FPS).

lunetta

Awesome usage of Eurostile Bold Extended. It never gets old.

“Dirt” also had a very interesting mograph interface – https://www.youtube.com/watch?v=n9NWK4qPOgU

justin

Eurostile Bold Extended? You sure? It looks like Univers to me…

lunetta

https://img122.imageshack.us/my.php?image=raceoptionsfi0.jpg

pretty sure :)
That font is stuck in head since “Space Odyssey”

justin

Oh, I thought you were talking about the font for Dirt! Sorry, my bad.

suprememoves

If you’ve ever played “Dirt”- it’s got a pretty slick and sophisticated ui as well. Growing trend that is definitely welcome in my book. I would love to work on game graphics.

Spence

MGS4 of course features those great fake adds for PMCs, but it also uses some subdued yet gorgeous real time mograph for VR training and HUDs.

skeletor

Ummm, the parallels are there and can be drawn but I really see the majority of this kind of work (or this example at least) as being more akin to web and navigational design as opposed to motion graphics and animation. Fancy menus are not motion graphics to me at least. Or am I being a snob?

lunetta

type in motion is a part of the mograph umbrella… and most of the interface work deals with moving type around to convey information.

frankenstyles

Sure. This could qualify as “motion graphics” but it is more information and menu design and therefore much more akin to web work in my eyes. Every pitbull is a dog but not every dog is a pitbull.

lunetta

sure thing, it all depends on the definition of motion design, which is quite open. Also, the definition of web work today and ten years ago is radically different, so these concepts shift and overlap as techniques evolve…

Michal

How about reversing the subject – how many motion graphics are inspired by videogame visuals (REZ or Vib-Ribbon to name a few)?

boca

Need For Speed’s graphics are pretty good as well (although sometimes cheesy), not so much on the UI side of it but with the transitions and stories.

.dE

“…and motion graphics in Codemasters GRID for the XBOX 360…”

Since XBOX is evil and you left it out, I’d like to point out that above all it’s a PS3 game.

justin

Actually, GRID is available on XBOX 360, PS3 and PC. I didn’t realize that until you pointed it out, though! :)

I’ve removed the XBOX reference from the original post.

john doe

“Motion design is increasingly becoming a key element in video games, blending into UI design and information design.”

What do you mean “is becoming”? Does the world revolve around you?

I’m sorry, but as far as I know, motion design not only _always_was_ (and that’s 20, 30 years so far) a key element in video games, but a considerable portion of what we call motion design was born from game design.

As time goes by, more and more it dawns on me how design blogs such as this one only serve as superficial directories for what’s hip, at the most (and to sell ad space, of course). The pretentiousness and presumption with which you folks talk about anything is truly amazing.

steve

chill pill….quick!

justin

“As time goes by, more and more it dawns on me how design blogs such as this one only serve as superficial directories for what’s hip, at the most (and to sell ad space, of course).”

And as time goes by for me (it’s been about five years now), it dawns on me more and more how the comments attract people who seem to enjoy explaining why they dislike a particular blog so much. The fact that they keep visiting and repeating their views over and over is completely mystifying, but well, there it is.

boca

Funny how the heaters always have really creative names and no url, isn’t it?
Listen to Steve “John Doe”, just chill, man… ;-)

scott

i always seem to post on forums when the arguments pretty much over.

oeuf

Ha. I enjoy reading the comments here good or bad.
Now where’s Marc B. at?

ldj

some more screenies of the UI here for those interested:
/ :-)

Matt

(^) Very nice work, Philip!

Nikkons

I always enjoy motiongraphics, even tho i dont know much about it. to me wile this design work is impressive, is not as much as “sehsucht “Black Poem” (fire add) for example.

Something about being a videogame UI takes away the merits (dont know if that make some sense at all)

sincerely yours a videogame freak.

Joe

“Black Poem” is a large composite of pre-rendered images. GRID’s menus are being rendered in realtime by the game engine. You can actually reorient the camera while sitting on a menu (but not so much as to sacrifice the designs balance).

Andrew

As a long-time, avid gamer I’ve gotta say – you’re jusy scratching the surface here. Welcome :)

I would also second MGS4

Macarbon

Assassin’s Creed features some really sweet motion design right from the beginning. I think you can check it out on

freshlyfunked

Being a passionate gamer and lover of all things motion, I’ve seen more and more sophisticated motion design in games. I started noticing motion design elements in games when I was in college. The one that really caught my eye recently was GTA IV opening scene (they used some really nice matchmoving mimic techniques with the type to create a hollywood type mograph intro piece), but also an oldy but goody menu screen that used some good typography for the times, would have to be Jet Set Radio Future (circa Dreamcast…). I might have to dust off the good ol’ N.E.S. and revisit those sweet 80’s 8bit constructions.

freshlyfunked

Ooooh, more games using mograph came to mind. NBA Homecourt would have to rank up there because of the consistent look and feel of the game (a 70s soulful feel) throughout the menus, cut-scenes, color pallete, and special moves (gamebreakers). They never used any style or technique that was cutting-edge or groundbreaking, but the piece was polished throughout. And even though its not my cup of design tea, all the sports game that mimic the mograph of the real-world counterparts.

Comments are closed.