Applications & Web: Direct Antidote: Website

Direct Antidote Website

Redoing the website was one of my first big projects while working for Direct Antidote. The biggest challenge was integrating the creative department's ambitious ideas for the site in just 2 weeks.

The original plan from creative was to record a video of someone drawing the site's landing page on paper. After some discussion it was decided it would be more practical to record a video clip of just the hand drawing, and programmatically animating the landing page. Combined with the new (at the time) 3D capabilities of Flash, this created a realistic looking site without using up excessive bandwidth.

My Role: Developer   |   Languages Used: AS3, XML, PHP

Screenshots

Loading bar being programmatically drawn on screen.

Previous | Next

Loading bar being programmatically drawn on screen.

Video of hand erasing the loading bar.

Previous | Next

Video of hand erasing the loading bar.

The biggest challenge of this site was synchronizing the video of the hand with the background, which is programmatically reacting to the video.

Previous | Next

The biggest challenge of this site was synchronizing the video of the hand with the background, which is programmatically reacting to the video.

Intro being programmatically drawn. I tried to make it as quick as possible while maintaining creative's direction.

Previous | Next

Intro being programmatically drawn. I tried to make it as quick as possible while maintaining creative's direction.

The navigation bar on the left is being drawn programmatically while a video of a hand is being moved and played on top. The content on the right page is programmatically animated in 3D.

Previous | Next

The navigation bar on the left is being drawn programmatically while a video of a hand is being moved and played on top. The content on the right page is programmatically animated in 3D.

Final position of the landing page, just before the hand video moves away.

Previous | Next

Final position of the landing page, just before the hand video moves away.

The portfolio section of the site is based on an XML content management system.

Previous | Next

The portfolio section of the site is based on an XML content management system.

Browsing through a 3D carousel of portfolio items.

Previous | Next

Browsing through a 3D carousel of portfolio items.

A custom video player I created for the site, complete with buttons and sliders skinned with artwork drawn with a marker on paper.

Previous | Next

A custom video player I created for the site, complete with buttons and sliders skinned with artwork drawn with a marker on paper.

Movable window box is also skinned in marker art.

Previous | Next

Movable window box is also skinned in marker art.

Talent section of website. The magnets at the top of the page were another great opportunity to use Flash's 3D animation.

Previous | Next

Talent section of website. The magnets at the top of the page were another great opportunity to use Flash's 3D animation.

Hand video pops up again to finish drawing a staff member in the talent section. More sliders and controls are using the unique artwork drawn on a paper with marker.

Previous | Next

Hand video pops up again to finish drawing a staff member in the talent section. More sliders and controls are using the unique artwork drawn on a paper with marker.

News section also features 3D animation and artwork consisting of marker and paper.

Previous | Next

News section also features 3D animation and artwork consisting of marker and paper.

Contact section animating onto screen.

Previous | Next

Contact section animating onto screen.

Final position of contact screen.

Previous | Next

Final position of contact screen.

Direct Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote SiteDirect Antidote Site