Behind the Designs
Hello! Below are some of the designs that I've made, and a bit more about how I created them. I created everything here unless otherwise stated. Hopefully this sheds a little more light on how I work and the types of things I've created in the past. Let me know if you have any questions or would like any additional information!
MatterControl is an original short I made for a 3D printing company. The client had only a vague idea of what they wanted, and it was up to me to develop a story, license music, create storyboards, design the art, and animate everything. I primarily used Photoshop and After Effects. I used 3Ds Max for a couple little things here and there (like the cuboctahedron's boolean effect).
Here are a couple storyboard frames with the final versions:
I spent a great deal of time in After Effects for this project. When I'm designing a shot, I like to do quick sketches on paper or in Photoshop, and then throw that immediately into After Effects to get a sense of how the designs are working over time. Then I'll do some camera adjustments or whatever else in After Effects, and then render out a frame to Photoshop where I'll do further paint overs. I'll continue this process until the designs are working well not just by themselves put also in the context of the video. The name of the game is TESTING. Lots and lots of quick tests to get things to a good place before I spend a lot of time honing the art or the animation curves.
Very often I'm animating things with proxy art until I'm quite sure that the direction is solid enough to invest time in making better art. Here's an example of a crappy drawing I used in my timeline for a long time:
This was eventually replaced by this image for a while:
And here's the final frame in the video:
Some character drawings...
Above are some of the style frames I created. Some were based on the previous video I created for the company. I wanted the commercial to stand on its own, but still feel related to the first one.
Typography often plays a big role in the design of every shot. In addition to finding/modifying a font that fits the mood of the piece, I will often clean up the anti-aliasing of a rasterized set of characters instead of using vector assets (if the video's resolution is set). The reason for this is that I can can control exactly how clean everything looks. It can be tedious, but I think it's always worth it.
Once I've done that, I export out every individual character and place them in the timeline inside of After Effects. If I do want a text character to morph or do something like that, then I'll do this same clean-up as a masked layer in AE so that I can animate the nodes of the mask.
This video was primarily built and animated in 3Ds Max and then I composited the render passes in After Effects. I used a render farm to get through all of the frames, as some of them were pretty taxing on just one computer (global illumination, ambient occlusion, etc.). Most of the shadows were rendered as a separate pass so that I had finer control over them. Here are a few final frames:
Here are some of the development shots for this piece. Again, because it's a moving piece, the staging and editing play a big role in what each shot looks like design-wise. And because I like to have every scene transition well into the next, it can be quite the task to get everything working harmoniously.
Some of the stylized modeling that I did for this piece. And while this piece was minimalist in its approach, there were still a lot of props that had to be made to fill out the scenes.
Some of the progression for a scene:
I tried a number of styles for this video. The primary reason for this was that the company (MatterHackers) did not have an established brand at that time. So, in addition to creating this video I was also figuring out a brand direction for them...which included choosing a color palette they could use for all sorts of things.
In the years that have passed since making this, the company has grown quite a bit. Their in-house designer has used my art as a direction for their branding going forward. They've also contracted me 3-4 times to do small things for them along the way (posters, an instruction manual, and some small animations). Here's some booth art I created for them to use at conventions.
Most of this video was either drawn in Photoshop or built with masks in After Effects.
There were also some shots where I had complex transitions going on, so it was challenging getting one composition to transition into another composition. For instance, there is a scene where I have 4 iconic cubes break apart and then reform into the shape of a 3D printer.
It was not a procedural thing. I had to design and map out each piece and then animate them into their pixel perfect positions. It took a number of drawings on paper, and then a lot of experimentation to get the animation paths to flow well and the mass distribution to work. And each piece is actually lined up perfectly to hide the seams that would normally be caused by anti-aliasing.
These concepts were created in Photoshop for an upcoming live-action short. My role on this film is to create the UI graphics that appear on the screens within the scenes (laptops, monitors, and other appliances).
I've worked closely with the director and vfx supervisor to develop the boards for what the UI is doing in the scenes. Some important story information is told through the UI, so there's been a lot of back and forth during development. It's important to try a lot of things, so I've made a lot of storyboards. I can't show very much, but here's a little:
Below are a couple images for game UI that I've done in the past. The sci-fi images were created in Photoshop. I exported the moving elements to 3Ds Max and Unity and animated them in there. Unity is the game engine we used for this project. All of the graphic elements in these were created by me, and I was the only UI artist on this project (a 10-month project with about 30 people on the team).
The following are a few of the style options I made for a mobile game that's currently in development. These were broad stroke ideas to help hone in on what the client wanted. We ended up choosing the option on the far right after I created an animation test for it. I am the sole artist on this project (it's a small team!).
Below are some boards and layout shots for an animated short I'm directing. I'm including them because they relate to design a fair amount. They're not pretty (gray renders from 3Ds Max), but it was important when translating my rough drawings into 3D space. Each scene has to work compositionally, so that meant a lot of camera placement experimentation. And because it's a moving piece, editing plays a role in the composition. Being aware of eye trace, the 180 degree rule, and so forth. Layout is always a tough challenge, but super rewarding for me.
Here is some of the experimentation I did when trying to figure out what the establishing shot of the gas station would look like.
These stills are exploring potential looks and color palettes. Most of these were just sketched in Photoshop, but some of the aerial perspective was done inside of Cinema 4D and then brought into Photoshop for further tweaking.
I've designed and marked-up a number of websites over the years. I designed this website that you're looking at (although I later moved the content to a paid CMS). One site that is entirely my own doing is Behind the Cinematic. I've done all the web design there. I'm building it iteratively, so it's always improving. Click on the images to see the layouts.
Hopefully all of this has been useful to you. Let me know if you would like anything else or if you have any questions!