"Chapter One" Website Experience

"Chapter One" Website Experience


Superhero Cheesecake collaborated with Born05 and WeTransfer to bring an award-winning site to life for the biggest kiteboarding movie in history called ‘Chapter One’. The movie sought to unite the best riders in the world to into a single cinematic experience, and the site sought to tell the story of all of the elements that comprise it. It is as visually rich and slick as the film itself, highlighting the riders, locations, crew and the movie via a beautiful UI that works across all platforms and devices.

"Website Experience"

"Website Experience"


The team at 14Four partnered with Struck to launch a beautifully redesigned website for Icon Fitness to showcase their brands in a unique way. While the old site was static, stale, and lacked visual interest, the new site's fresh design and unique interaction design concepts are more reflective of Icon's innovative approach to fitness.  

Upon scroll, users are navigated horizontally through the experience, which incorporates subtle animations and interactive elements. Users may also jump to specific pages, using the provided menu or arrows. Blog posts, videos and news articles are easily managed through a Craft CMS, and job postings are pulled in using the Jazz API. 

"Data Narratives"

"Data Narratives"


Ogilvy and Grainger came to We Are Royale to help them make OSHA’s year-end workplace safety information easier to engage with and understand for their site in support of their safety product lines. With data-visualization being one of the team’s geeky obsessions, they got straight to work and crafted a series of beautiful and intuitive data visualizations to illustrate the complex or obscure business-related analytics from OSHA. Creating (9) Data Narratives in all, highlighting everything from how many sick days does the average manufacturing worker take vs someone working at a bank, to where and what types of injuries happen around the workplace. 

These responsive Data Narrative modules, each purposely designed in a style that best serves it’s respective information, provide users with an interesting perspectives on subjects we’ve all taken for granted. Purposeful design in this case means designing a visual that reveals patterns and trends in the data that no one chart could do. The data is intended for industry professionals who need correlations and answers, and they need it fast. So the team employed a minimalist approach with a pop of color and subtle depth to round-out the design language experience, creating highly legible, clean and easy to quickly understand visuals, free of “chart-junk”. Explore each of them via our demo site below.

"Top Grier" Game

"Top Grier" Game


To promote Go90 and Rated Red's newest series, Top Grier, The Uprising Creative designed and developed a pixel art, 8-bit inspired HTML5 motocross web game. The game features online star, Hayes Grier (and his pups). Start your engine, crank the throttle, and blast your away across a procedural, infinite terrain. Perform stunts and flips to rack up points, and work your way up the global leaderboard.

Hyundai "Drive" Platform

Hyundai "Drive" Platform


Wildlife teamed up with Innocean USA and Hyundai to make car shopping, owning and driving better with a massive new mobile platform that starts by bringing the test drive to you. A robust, Uber-like experience connects consumers with local dealerships through a custom back-end portal spanning all levels of the brand, enabling sales agents to deliver test drives at locations most convenient for the buyer.

The project launched following (10) months of collaboration to conceptualize the flow of the consumer and dealer-facing portions of the app, in a comprehensive UX design process led by Wildlife. The team had to account for not only for how consumers would engage with this product, but also how independent dealerships across the country could integrate this new tool into their day-to-day operation, aiming to ensure they would embrace it.

A deep UI design period followed to create a user-friendly, clean and intuitive visual experience. Simultaneously, the cutting-edge React Native framework was leveraged by the team for mobile development to bring unmatched efficiency in delivering fully native, dedicated iOS and Android apps, while being able to cleaning integrate with Wildlife’s robust, scalable back-end services built specifically for Hyundai that power it all.

Like Uber, users will see a new Hyundai model traveling to them and mapped in real-time, with the ability to communicate with the dealership via in-app messaging. Users can also survey their friends and ask them to weigh in on their prospective purchase, and engage with Hyundai's official NFL and other brand content.

 

DEMO VIDEOS

User-Flow Demo

Agent-Flow Demo

UNESCO "Reclaiming History" Site Experience

UNESCO "Reclaiming History" Site Experience


Collaborating with Ogilvy NY, Rekrei and Unesco, the team at Pet Gorilla developed a beautiful WebGL site experience for the Reclaiming History campaign. This campaign site brings attention to the efforts to restore fallen monuments and pieces of history so we never forget where we came from. Using photogrammetry from Archeologists, the team also created virtual versions of these monuments and artifacts with geo-location placement to populate the site with educational content that is all navigable with an interactive 3D globe. 

Taking the efforts one step further, the site has a crowdsourcing component to it that allows people from around the world to do their part to help out through photo submission of these pieces of history to keep the rebuilding efforts going. 

Additionally, a small collection of these virtual monuments and artifacts have been 3D printed to be used in an ever growing exhibit that will add new pieces to it as more are reclaimed. Learn more about it by watching the case film here or clicking the button below to check out the site


CASE FILM

FX American Horror Story "Fearless" VR Experience

FX American Horror Story "Fearless" VR Experience


Courtesy of IGN Network

Working with North Kingdom, the creative agency, and FX Networks, Groove Jones was brought in as their VR partner to help bring their creative concept for the American Horror Story ‘Fearless’ to life for launch at this year’s Comic-Con in San Diego, CA. 

The intent was to use VR, via the HTC Vive headset, to tease the new season of AHS and provide fans with an opportunity to step into a CG recreation of some of the most memorable locations across all of the AHS seasons in a manner that was not for the faint of heart. Providing a top-notch horror experience and fans were given a glimpse into what was ahead.

The Comic-Con experience was setup at Hilton Bayfront Park, where FX built a dark ominous looking silo to serve as the stage for the VR-driven screams. Five fans at a time would enter the silo and be taken into an all-white room where they were instructed to lay on a bed-like slab and put on an HTC Vive headset by teams in lab coats. 

The fans then wake-up on a hospital gurney in the AHS CG world and are transported through a tense trip that they’ll experience everything from fear, vertigo, panic and a lot of claustrophobia on. With the added bonus of going through the experience with multiple people, so they can hear every scream and whimper in the room, which increased the terror and drama exponentially.

After the success of the Comic-Con activation, FX Networks wanted to take this experience on a mobile tour. Always one to oblige, Groove Jones modified the experience for the tour and helped with the redesign and implementation of taking it on the road. With the mobile tour version of the experience being contained inside a modified trailer system with the ability to have two users experience Fearless VR at the same time.

Learn more about the experience, see what IGN had to say about it, and keep a lookout for the new Mobile Tour Experience via the buttons and video below.


IMAGE GALLERY

"The New Porsche 718" Site Experience

"The New Porsche 718" Site Experience


Wildlife teamed up with Cramer-Krasselt Chicago to develop a sleek and fast-paced site experience for the new Porsche 718 Boxster and 718 Cayman. The full-screen video experience is packed with impactful running footage and fluid transitions that give the user a taste of what it's like to drive one of these incredible vehicles. An interactive road map comes to life on each side and serves as the navigational tool that carries users through the different sections of the site. In addition to developing the responsive site, Wildlife cut the footage together into pulse-pounding snippets that could loop and serve as transition during the user’s journey across the site sections and content.

Toyota "#LetsJoinHands" Experiential Installation

Toyota "#LetsJoinHands" Experiential Installation


Wildlife worked closely with the team at Saatchi & Saatchi L.A., their Toyota client, and Twitter, to conceive and concept a live-streaming interactive video portal installation between L.A. and NYC, pulling passersby into spontaneous connections with strangers 3,000 miles away. Using the power of joining hands via the touchscreens to trigger a linked experience that allowed user to remotely play drawing games, create connection-triggered scene changes, and new friendships to be formed in the name of Standing Together to support the United Way. 

Passers-by in Herald Square in NYC and at Hollywood and Highland in L.A. would have the ability to walk up and put their hand on the screen to ping the other location, connecting them with a user at on the other end. Then, a collaborative drawing game takes over as the two users share the screen and join together to create playful scenes of city skylines, outer space and sunny days. All the while, they captured the video feeds and drawings on each side, with a cloud-based renderer automatically editing each session into a 30-second highlight reel that was tweeted back to users from @ToyotaUSA.

In order to achieve a real-time live stream between the locations, Wildlife worked with AT&T to secure special 4G LTE frequencies that, when paired with the hardware with their custom HD video streaming software, VPN and OSC protocol, provided the real-time communication necessary for this to be a success. All done in a 6-week total production timeline.

Reach out and touch the project case study for yourself with the button below, or check out the video.


CASE FILM

Chevy "Positivity Pump" Experience

Chevy "Positivity Pump" Experience


The Uprising Creative worked together with The Martin Agency to help craft a 360 experience For Chevy in support of Positivity Week. A key element of this experience was to takeover various gas pumps around the world and outfit them with specially fitted iPad Pros to work as the new User Interface for the pumps. The twist comes with the creation of an application that, instead of cash or credit being used a payment for their gas, a user could use their Facebook or Twitter feed to pay based on the Positivity level on social. 

The custom app that drives the experience, which was built via a combination of Node.js, React.js, Cordova and the IBM Watson API, searches through the user’s feed to determine how positive of a person the user is based on their status updates. The more positive they are, the more free gas they would receive. 

Additionally, behind the scenes was a secondary web app where an Admin (and film crew) could review the incoming sentiment analysis, which would in-turn guide them to select a unique reward experience for the user to be printed out onto their receipt from the pump. All of these rewards would guide users to #FINDNEWROADS. Check out more about the campaign experience with the following buttons.


CASE FILM

"Liar, Liar, Trump on Fire" Site Experience

"Liar, Liar, Trump on Fire" Site Experience


It seems like every day the man that’s lobbying to be the leader of the free world steps in his own shit. He’s vulgar. He’s mean. He’s a bully. Worst of all, he’s a liar. Quite frankly, we’re scared for the future of our country. 

So 14Four wanted to do their small part to inform and convince undecided voters to not put this man in power. We shine light on some of Trump’s biggest whoppers by creating a site that calls him to task. Created in collaboration with freelance Creative Director, Peter Cortez, the ‘Liar Liar Trump On Fire’ experience allows users to interact with, and discover the truth behind Trump’s lies. The more users scroll, the more lies they uncover. Rollover the lie and the truth is revealed. The site also provides a persistent link for users to Register to Vote. 

This living, breathing Trump take down will be updated in real-time. The more lies he tells (and he will tell more before the election), the longer his nose grows, more lies are added, and their truths revealed. So voters of Ad Land and beyond, undecided or not, don’t F around on November 8th. Get out and vote. And make sure we all don’t catch fire. Follow his nose via the buttons below.

Heineken "Go Places" Site Experience

Heineken "Go Places" Site Experience


Alongside the team at Cloudfactory and their client at Heineken Company (Parent of Heineken Beer), the team at Superhero Cheesecake crafted an integrated site experience they affectionately call ‘The Interview’; an interactive job interview that guides the viewer through a live-action guided personality test consisting of 12 questions - defining in which way you fit the Heineken Company. Based on your answers, a highly personal profile is created that reflects who you truly are and where you may be able to go within the company’s network of 250 different brands located in more than 70 countries around the globe to maximize your strengths.

Furthermore, with this site experience being intended for the global market, the site catered to a slew of different languages and respective minimum required drinking ages to make sure it was localized and within the letter of the law. Also, the live-action quiz content throughout the experience would be different from culture to culture to create a quiz that’s relevant to the user’s world where they are.  

Everything from the landing to the end result feels as one, smooth experience, no matter if it’s on Desktop or Mobile, by using several tricks, such as using cinemagraphs instead of video so we have the ability to show a custom user interface on top of video material on older devices that don’t fully support inline video in the browser.

The Interview is a unique crossover between HR and marketing that shows the innovative spirit of the Heineken Company as a brand and a potential employer. Interview and learn more about the project via the buttons below.

Toyota "Bold Choices" iAd

Toyota "Bold Choices" iAd


When creating an iAd for Toyota and Saatchi&Saatchi LA, why not reinvent what in iAd can do on a mobile device. 14Four partnered up and developed a ground-breaking experience that added an exciting layer of depth and dimension to the Toyota 'Bold Choices’ campaign that, to that point, had never been done before. With clean animation, accelerometer detection/control integration, and a few killer easter eggs thrown in for good measure, even the folks at Apple were amazed.


CASE FILM

Taylormade PSi "Demand More" Website

Taylormade PSi "Demand More" Website


Undefined look, shape, and feel

Taylormade was looking for a website that did their new PSi irons justice. Zambezi reached out to 14Four talking about 360˚ interactive video, apps for Google Cardboard and exploding animations for their ‘Demand More’ campaign to do just that. The team excitedly responded with a high five and some storyboards, and then got to work in close collaboration with the agency. The result was an immersive cross-platform experience that caters to a discerning, experienced audience with no handicap.

State Farm "Safe Teen Driving" Interactive Installation

State Farm "Safe Teen Driving" Interactive Installation


14Four loves video games. So do teenagers. But teenagers can also be scary drivers. So when the The Marketing Arm asked 14Four to help create an arcade-style driving game for State Farm to promote teen driving safety, they jumped into the driver’s seat (see what we did there?). The game features a 3-HD monitors array and cockpit/driving pod to immerse the user. It was part of the State Farm booth at the largest Auto Shows in the US (Detroit, LA, Chicago etc). The game was created using Unreal Engine 4, 3DSMax, and play’s like a timed obstacle course. Teenagers loved playing, and hopefully we made the roads a little safer in the process.


CASE FILM

Subaru "Ride of Her Life" Website

Subaru "Ride of Her Life" Website


Official Trailer

What better way to excite consumers about the new Subaru WRX model than to promote a fake movie about a country girl being swept off her feet by a handsome drifter (Sponsored Rallycross Driver Bucky Lasek) and going for the ride of her life. Carmichael Lynch created this amazing campaign and they tapped 14Four as their partner to develop a site experience that employed video, animated gifs and images as promotional materials for users to get the word out. Buckle up.

Nikon "Show Your Love Some Love" Website

Nikon "Show Your Love Some Love" Website


In today’s social media age, ‘Likes' are thrown around like disposable currency. I ‘Like' your baby pictures, I ‘Like' your selfie, I ‘Like' your vacation pics. But what about ‘Loves'? Be it travel, family, or the ocean. To celebrate ‘Loves', 14Four created a socially-driven site experience with Cramer-Krasselt and Nikon as part of the ’Show YOur Love, Some Love’ campaign to let people submit photos and videos of their ‘Loves' and allow other users to vote/‘Love' on them. Check it out and decide which submissions you ‘Love', and which submissions you 'Love Love'.

ING "The Next Rembrandt"

ING "The Next Rembrandt"


The brilliant team at Superhero Cheesecake collaborated with JWT Amsterdam and their client, ING, as well as their partner, Microsoft, to craft a new portrait from the passed Dutch Master, Rembrandt. On April 5th, 2016, this portrait, of a man in black 17th-Century clothing with a white collar and hat, was unveiled in front of a packed auditorium. The painting was created using data from Rembrandt’s total body of work, using deep learning algorithms and facial recognition techniques, and consisted of over 148 million pixels, based on 168,263 painting fragments sourced from the Master’s oeuvre.

SHCC spent 18 months collaborating with JWT, ING, Microsoft and numerous data scientists, engineers and Rembrandt experts to create a highly detailed and complex algorithmic process which resulted in 150 gigs of digitally rendered graphics, all to service the creation of a new masterpiece from beyond the grave. To tell this feat art and technology’s full story, the team also created a beautiful, responsive site experience that provides full details on how they resurrected Rembrandt for one last piece.

All of this hard work was intended to fuel the conversation about the relationship between art and algorithms, data and human design, and technology and emotion. Start those conversations later this year when The Next Rembrandt will be on public display in a location to be disclosed very soon. Until then, check out the project that garnered 16 Cannes Lions this year, including 2 Grand Prix Lions, via the links below.


CASE FILM

Diadora "Make it Bright"

Diadora "Make it Bright"


Superhero Cheesecake partnered Norwegian agency, SMFB, and their fellow Dutch compatriots, MediaMonks, to create an interactive experience for Diadora that transcended the interwebs by giving one lucky consumer the power to set an epic real-world trek in-motion. By pre-ordering a pair of Diadora’s Italian-made N9000 shoes, one person unknowingly pushed the start button for the spectacular Bright Delivery; a 1500 km journey across Europe to deliver a pair of shoes by foot. In an amazing relay, runners from 10 different countries passed on the shoebox until the final destination in Barcelona. 

The team at Superhero crafted the responsive HTML5 interactive site experience that allowed users to re-live the run in all of it’s statistical glory by developing a creative UI that allowed them to navigate through quite possibly the greatest delivery in history, while also allowing them to meet the fantastic crew of runners and their personal journeys that all came together to make the Bright Delivery possible. It all starts at the Diadora Headquarters and by dragging on the timeline with which users can swipe all the way to Barcelona without missing social posts, heart rate changes, shoebox hand-overs, inspirational quotes and live-video content. Check this monumental trek our for yourself via the FWA and Awwwards winning site linked below. 


CASE FILM

Samsung "The Dunbar Edge Experiment"

Samsung "The Dunbar Edge Experiment"


Our number of friends are ever increasing. But in reality there are only five you can really rely on. Which five would you keep close? Which five would you keep on the edge?

Together with DDB Stockholm and MediaMonks Films, Superhero Cheesecake created an interactive experiment to showcase one of the premium features of the Galaxy S6 edge+, for their Samsung client.

The team at Superhero Cheesecake crafted this engaging, cross-platform, HTML5 site with the help of Robin Dunbar, Head of the Social and Evolutionary Neuroscience Research Group at Oxford. It starts with him explaining how the human mind can only cope with 150 friends at any one time. And of those, only 15 are people that we would consider close friends. But refining further, we can count those that would actually come to your aid when you need it on one hand. 

With that in mind, the team developed the ultimate social friend test to help users find out who those final five friends that would come to their aid, if needed, are. This test, which leveraged the Facebook API, guided users through the five specific scenarios, ranging from having a panic attack to being all alone on a mission to Mars. Each scenario required them to name a friend with a specific characteristic that they though would aid them in the situation in order to determine once and for all, who their five friends were. Learn more about this FWA SOTD and MOTD experience with the link below.