Check it out:
http://www.gamemarketingsummit.com/awards/winners/#bestwebsite

Check it out:
http://www.gamemarketingsummit.com/awards/finalists/#bestwebsite

The scene is set in a marketplace in downtown Hong Kong: The day is ending and the light from the neon signs shine into the street. The streets are busy with people pushing along on their way – their shoulders brushing as they pass.

As dusk fades and the sky darkens, the people who thrive in the night are left alone in the market.

Sleeping Dogs is an open world video game mixed with crime and a dash of drama. Originally called Black Lotus back in 2009, it was delayed and re-announced as Sleeping Dogs in 2012 by Square Enix.

Working with FutureUS and Square Enix, we were presented with the challenge to immerse users’ into the actual vibe of downtown Hong Kong. While at the same time, we were to tie custom features into the site’s functionality that were pertinent to the game. This was all to be done in one execution.

So we built a plan around a highly interactive HTML5 site & Flash site, where the user gets a first hand look in a Hong Kong street-market through a full-screen experiential website.

Each scene was carefully laid out with small details given that some might not take the time to notice. This is what brings the realism to a scene like this – and what makes the experience fun for a fan to find those extra surprises and uncover hidden easter-eggs as a reward for taking the time to dig through each scene.

Pre-Production
The Sleeping Dogs Night Market Website involved careful planning and meticulous production details to create a user experience that encourages exploration of many different elements from the game.

Once we had the scene established we added in the characters and props to bring it to life.

Production
We managed all aspects of production from the casting and auditions of the talent to the live action shoot held at a production studio in Orange County, CA.

We shot the talent and the props on green screen. The talent was all shot live, and the props/booths were all shot as still images.

Compositing the character footage, prop photos into the CG background(modeled from scratch, based on a scene in the game) was a time intensive process. Here’s one of the early early versions we did while on set to make sure everything was going to line up properly.

Special attention was spent on the lighting during the shoot to recreate reflections that can be experienced within the scene on the characters and props. Here’s J and Jordan stuck on the monitor directing the talent’s performances.

Development and Design
From there we moved to keying the characters for the site. The natural movement of the characters upon roll over were carefully planned for by shooting them in neutral to action to neutral poses and then morphing the frames to show a very natural range of motion

The little details are what really bring this site to life. Particle effects and special effects were used to create details like steam from the manhole or sparks from the fuse box.

Quick Look at the Design

When it came to the development of the site, we developed a very robust, full screen experience in Flash as well as a robust HTML5 version that gives user’s a similar experience on tablets.

So that’s a look behind-the-scenes, but please take a second to experience the Sleeping Dogs Night Market website and explore all of the different elements yourself. We hope you enjoy the many details and surprises in this immersive experience we thoroughly enjoyed creating.

Check out the site here:
http://nightmarket.sleepingdogs.net

Design
The site is a very cool top down scroller that has horizontal sliding for certain sections. Brilliant design and functionality overall. It utilizes HTML5 with a few small flash elements.

The tour traveled through nine European countries over four months.

Stunning photos from the event were captured at each location.

Video

The spot is even cooler. All sections are shot at night with controlled lighting. Even the surf scenes.

Nike claims a major stake in the action sports industry.

Check out the site here:
www.NikeChosenSeries.com

If you’ve got talent, we want to help expand your folio with great work and help push you to a new level. Your success will be our success. Come and grow with us.

You
You will be a key contributor to the production of various online initiatives such as: Websites, Rich Media Units, Mobile/Tablet Interfaces, Casual Games and Banners.
• 3+ years of Interactive Design experience
• The ability to conceptualize and design for different types of digital products(sites, rich media, mobile, etc..)
• Can build Wireframes and map out the User Experience.
• Collaborate with dev team to ensure the best digital result conceptually and creatively
• You stay up-to-date on new trends and ideologies in the digital world
• You have good time management skills. Such as, the ability to multi-task and prioritize deadlines.
• Of course, you must have extensive experience working with Adobe Photoshop, Illustrator and other CS5 applications.

Bonus
None of the following skills are fully necessary, but will definitely be to your advantage to posses one or some of these skills.
• Have a good sense of motion design and can work with After Effects and/or 3D software (StudioMax or Maya).
• Have Flash Timeline Skills
• Have a solid understanding of HTML/CSS, Javascript, XML, PHP & MySQL and integrating with server-side technologies.
• Have Agency or Studio experience
• Loves playing video games and working on projects in the game industry.

About Us
MoreYellow is a boutique, award-winning creative content studio. The majority of our clientele are in the gaming and entertainment industries, but we do work outside of these industries as well. Our office is in a really nice area in old-town San Juan Capistrano. We’re seeking passionate people looking for ways to push their work as well as themselves.

How to Apply
Send your portfolio and salary requirements to: jobs@moreyellow.com

Check it out here: http://www.howdesign.com/design-creativity/top-10-sites-for-designers/september-2011-top-10-websites-for-designers/

Thank you very much HOW Magazine!

This was the one sketch in our presentation that stood out to the client. So they asked us to develop the idea further.

From here we came up with a full Aug Reality campaign that got users to record video of themselves using the AR, then share it with their friends through Facebook. And to make a campaign out of it, we built multiple weapons into the AR that could be released in consecutive months.

We made a sword version of the AR for the Aragorn fans.

Here’s the 3D tests as we were finishing the sword moves.

Then we made a whip action for the Balrog fans in the game. Excuse these drawings, we made these quick at lunch. Ha. But they got the point across.

Here’s the 3D tests of the whip progress.

Also, for the fireball, here’s some of the first test animations.

Website
Then as we were building the AR application, we were designing out how we wanted the site to look. Here’s some of the first comps we built to show how it would look and work. We really were attached to 2 different styles from the beginning.

Of course, we ended up somewhere in the middle.

Print Ads
One of the most important features of the whole campaign was the Print Work. We had to get people to the site! Over the course of 3 months we released a new ad. Each promoted a different character, and each character’s card contained a different AR power. IE., Aragorn’s card enabled the sword AR, Gandalf’s card activated the fireball, etc.

Here’s some of the progress of the Print Ads and Trading Card designs.

Results
The results came in very positive. Through the Print and Rich Media initiatives we ended up with over 120,000 hits to the site, with an average of over 4 minutes of time spent interacting. Over 3 hours of User Generated Video was created and shared through Facebook. Check out some of the entries here.

If you haven’t gone yet, make sure to go to the portfolio page for this project to see some better shots of the creative.

This first walk-through shows how we developed the “Company” main header graphic
from concept sketches to finished 3D.

The Cannonball Man is one my favorites. He’s all about confidence, chest out, eyes closed, and saluting
his respect for his mission. We worked on many versions of this guy, here’s his sketch, to one of our first
models, to his finished image.

And here’s the finished image.

Here’s the opening shot for the Homepage Header. Our Ring Master stands out front with his hands in
the air and welcomes everyone to the Circus.

We spent alot of time with him. Here’s a couple progress shots as we modeled him.

And then we have the creation of our “Join The Show” page. The idea is that the Show is moving and
you’re either coming with us or getting left behind. There is hope if you missed the bus though, a flyer
was left on the tree giving people info to Join the Show. Thus the reason why all the contact info goes
with this header image.

As usual, we start with a sketch, then to modeling, then to textures, then post.

Some of our first passes on textures for the Caravans.

Then putting it all together and finishing the post work.

KeyArt sketch(above) turns into first round renders(below).

The finished image.

We then used it for the Cover Art as well as the Homepage of the Site. We built the UI of the site to
work with the Image.

See the built site page to see the animated Particle FX in the scene. Preview Page

The game is known for its Co-Op gameplay. So we wanted to build an image where you could see the
all the guys kicking back together and enjoying themselves as a group. We thought it would be
pretty cool to see everyone pulled away from action with a cool view of the city below that they
just went through and destroyed.

See the built page to see the animated Particle FX in the scene. Preview Page

We re-created a battle scene much like one in the game. This is a quick progression from sketches to finished render, to implementing in the site.

See the built page to see the animated Particle FX in the scene. Preview Page

Cover Art