The Smart Home Energy Lab is a family friendly Flash site that was created as an educational story-driven section of a larger energy web portal.

Starting from the story ideation, I worked on the overall feel of the environment and the character development of the main character, the Scientist. As the topics of energy usage and conservation are often abstract to younger viewers, I created something that was a bit more fun, yet still conveyed the key concepts. What resulted was a steampunk-esque world where clicking on each of the objects played a brief animation illustrating related lessons and tips.

Responsibilities: Character and Story Development, Illustration, Animation, Final Production
Tools: Photoshop, Illustrator, Flash, Audacity, AS3

Okapi is a fictional name I used for a confidential client. I was asked to create a quick series of spec wireframes for a high level user experience using speech on a non-specific mobile handset.

With a loose set of guidelines, I worked on a quick medium-fidelity flow of a typical experience for most mobile devices -- listening to music. Above are just a sampling of the overall flow. In addition, I created a more polished, but still general look & feel image for presentation.

Responsibilities: Wireframes, UI look & feel
Tools: Photoshop, Illustrator

AroMobile is a Android platform suite of applications using a semantic recognition technology making your mobile experience faster and smarter.

Working on the in-house Creative team at Kiha (a Vulcan project), I worked on the UI and specifications of the Calendar and Contact applications, as well as designs for the Dialer app. In addition, I created Marketing videos for CES '11 that showed off the speed and intuitive-ness of our node-based user experience.

Responsibilities: UI, design specifications, final asset creation and delivery
Tools: Photoshop, Illustrator, AfterEffects, 9-patch

I was approached by Intermec to help them build a deck of proof-of-concept images for a (confidential) refridgerated delivery truck company.

Working offsite, my contacts at Intermec and I worked through potential concepts for an application on tablet devices, that drivers would carry with them, as well as have a way to mount inside the cab of their truck. The end users would not only be the drivers to help them through their route, check orders and supplies, but also the customers who could use the tablet to see specials, food pairings, or play coupon-based games. Shown here are a sampling of the final medium fidelity wireframes to present to the client.

Responsibilities: Wireframes, UI look & feel
Tools: Photoshop, Illustrator

These are a series of studies into some unique interactions, transitions, and UI.

Responsibilities: Wireframes, UX, UI look & feel
Tools: Photoshop, Illustrator, After Effects

Sometimes, on a rainy day, in a rainy city, the right tunes can turn everything around...

In progress short, based on original story.

Mix of 3D and 2D motion.

Responsibilities: Design, Direction, Animation, Motion Graphics
Tools: Cinema 4D, After Effects, Photoshop

Fresh Face adds the ability to customize backgrounds and icon sets with theme profiles on the myTouch3g and G1 phones.

Working with Filter Studios and T-Mobile, I focused on two of the themes in this customization pack. I created original icons and application drawer pulls for the Traveler and Movie Buff themes, and a seamless background for the Traveler theme.

Check it out on Androinica!

Responsibilities: Illustration, background, icons, application drawer pull
Tools: Photoshop, Illustrator, Expression Design

Mobile Connect gives users the chance to enhance their phone experience, allowing them to share, play, and download content-- ringtones, images, contacts-- onto their own personal physical journal-like organizer. Through this Surface WPF application, partners are able to customize content to give users a meaningful return value.

Beginning to end, I drove the "Rock-Star," youth focused visuals. Making it an enjoyable experience for users to browse content, download new photos and songs, and enter a Photo Contest, by pulling their best shots into a physical guitar case.

See it in action on YouTube!

Responsibilities: Look & Feel, final IxD, visual assets, preview movie, icon
Tools: Photoshop, Expression Design/Blend, After Effects

Light. Energy. Motion. And Emotion. Attributes that inhabit the Microsoft Surface logo. With the colorful lockup getting more notoriety, it was time to give some extra flair, fire, shine, and a comet-like presence.

With my background in motion graphics, I was able to create a blazing motion logo treatment. In cooperation with Microsoft Studios, I used Cinema 4D and After Effects to create the animation. The new treatment bursts onto screen (or table), exciting and preparing users for the Surface experience.

Responsibilities: Motion Graphics, final visual assets
Tools: Cinema 4D, After Effects, Photoshop

On the occasion that a Surface Application needs to load additional data, there needed to be a subtle animation that continues the light and movement of the Surface Logo designed by Razorfish.

The solution was an evolving dimensional elliptical light source that revolves in 3D space. Using Cinema 4D and After Effects, I created the soft glowing pulse of light to inform users that their Surface experience was moments away.

Responsibilities: Motion Graphics, final visual assets
Tools: Cinema 4D, After Effects, Photoshop

This was a joint venture between our internal team, vendor Infusion, and MSNBC. The Newsreader gives users the ability to browse, read, and interact with news, information, using gestures on a fully 3D globe UI.

My role was to create visual studies, elements, background assets, as well as additional design support and final preview movie.

See it in action on YouTube!

Responsibilities: Visual assets, background assets, preview movie
Tools: Expressions Design/Blend, Illustrator, Photoshop, After Effects

Part of the Surface games pack, Chess & Checkers enhances the traditional game and allows users to play, and move pieces using natural gestures. The game can be played with users, AI, or even without rules, allowing users to fling pieces around the screen using real physics.

While the game uses a modern technology, from a design aspect, it needed to relate to the physicality of the traditional game. Employing a natural stone and wood feel, I created the overall visual design, for the Surface Chess & Checkers game.

See it in action on YouTube!

Responsibilities: Look & feel, visual assets, icons, preview movie
Tools: Expressions Design/Blend, Photoshop, After Effects

Using a gestural language, Microsoft Surface Photos gives users the ability to browse, rotate, size through a morphing pod and bar view.

As a designer on the Creative Design team, I helped to support the design process, spec, documentation, and preview movie.

Responsibilities:Look & feel, IxD, visual assets, documentation, preview movie
Tools: Expressions Design/Blend, Photoshop, Illustrator, InDesign, After Effects

These are alternative backgrounds I created for the core Surface experience applications.

The first, a more bright, vibrant background for the Attract application. As the name indicates, I wanted to draw people towards the Surface and have them interact with the table.

The other two are backgrounds for different scenarios in which the Photos application might exist. One is a banking background that needed to speak of professionalism, finance, and security. The other background is more playful and would be more suited in social situations such as bars or clubs. The Photos application is a great way for singles to share photos and stories, in a tactile, fun environment.

Responsibilities: Look & feel, visual assets
Tools: Photoshop, After Effects

Always a fan of the classics of cinema, this was created as a study of the film period know as Film Noir, and it's historical roots.

This site was heavy on the creative assets, as I flexed my digital compositing and illustration skills. Locating appropriate period references, and matching the correct angles, textures, and lighting in Photoshop involved a great deal of detail to create the staging of each of the different 'scenes,' and all of the rollover imagery.

Responsibilities: Design, Illustration, Implementation
Tools: Photoshop, Dreamweaver, HTML