Cisco Together
(2010) - The UX of this site was borrowed from the Space Collective website, with boxes that expand and collapse within the page, revealing entire articles and videos without ever leaving the one page. This was similar to the idea I had for the TakePart website, but in a different design with boxes floating and wrapping around each other rather than a single column of expanding rows. But the premise is the same, allowing the user to explore content in one place without the disorientation that can occur when loading page after page.
The Cisco Together site consists of videos of leading technologists in and outside of Cisco talking about video technology and the creative ways it brings people together, from family to academia and medicine, and the possibilities it brings to our future.
The design was kept clean with a subtle variety of colors. A multitude of media placements were created, utilizing the technologists and quotes or short video clips.
Visit Website >
TakePart
(2008) - I designed the UX and IA of the initial redesign of the TakePart website with a final wireframe document spanning 107 pages. Several months of research and discovery took place with three HTML/Javascript prototypes I built put through testing to determine the best interface.
The premise of the interface consisted of a single-column of rows of content, each row essentially just displaying a headline. Clicking a headline expanded the row to reveal the entire article or video without leaving the page. Thus, the user could browse through the articles without the disorientation that can occur from page to page reloads. This was particularly helpful since each article was related to one another, and the likelihood of wanting to read more than one of them was greater, with the alternative having to click back and forth between traditional pages.
The premise of the interface came with a lot of questions marks, but was one I firmly believed in. After a few months live, it was eventually scrapped for a more formal and common layout, yet I feel vindication in the fact that this form of interaction has since been used in popular sites around the web. A demo can be viewed with the button below, and examples of this interaction can be seen here and here.
View Demo >
NYSee
(2006) - NYSee was a 5 year side project that began long before Google Maps launched Street View. In fact, it was publicly displayed just one year before Google pretty much made this project irrelevant. But the body of work remains, and the entirety of it was done solely on my own.
The crazy idea back in the year 2001 was to videotape every single street in Manhattan, and construct a program to allow a user to turn at any intersection within each video. Underestimation occured at practically every step, but at each point, I'd just gone too far to quit.
Planning a meticulous route that would take me through every single street of Manhattan and building a custom camera mount that I could rig up to whatever rental car I got took me a year to complete. It all paid off in the actual filming part which surprisingly took me only 10 days. That's 10 days where I covered the whole city, every street, in every legal direction, including all highway on and off ramps and every bridge and tunnel in and out of Manhattan save the Cross Bronx Expressway which I scrapped dues to its complexity and exhaustion from 10 days of 8 hour non-stop driving.
Over 4000 hours of video then had to be transferred to hard drive, all through a single mini-dv deck, one tape at a time. The biggest task actually came next, and that was to edit the frames of every single street so that playing it would move down the street at a continous pace, no slowing down for lights or acceleration from stops. This took me 3 entire years, all in spare time. No fancy editing environment. Just Quicktime Pro, copying and pasting frames like stop-motion. Without a ShuttlePro, this probably would've taken me twice as long.
Once I had all the final edited video, I pulled it all together in Macromedia Director with a custom database, embedded map built in Flash which communicated with the core Director program to follow along with the video, and various audio clips matched with the level of traffic in each frame to enhance the experience.
The design left something to be desired, but I was happy just to get it working, and I barely got it finished in time to be accepted into Ars Electronica 2006, the annual festival of art and technology held in Linz, Austria.
The Realm
(2009) - The Realm was an animated web series with custom artwork by renowned comic book artist Mike Mayhew. It featured four superheroes, each representing an aspect of Cisco's Security solution, following their defense of an epic virus attack.
A follow-up project allowed people to create their own custom comic page, armed with the entire library of Mayhew's artwork created for the web series, all meticulously outlined and color-corrected.
I designed both websites, starter custom comics, wallpapers and media, the black & white wallpapers in particular being a joy to assemble from Mayhew's gorgeous drawings.
The Realm series won a 2010 Bronze Effie Award and the Comic Creator received a 40th Creativity Annual Awards Platinum Award and w3 Awards Gold.
Watch Episode 1 > Watch Episode 2 > Watch Episode 3 > Watch Episode 4 >
Barbie 50th Anniversry
(2009) - In 2009, Barbie turned 50 years old. So something big needed to be done online to celebrate her big anniversary. Recalling the Halo Believe site from a few years earlier, I thought the idea of a camera flying through a fully built model landscape was a perfect fit, considering how all of the dolls, accessories, houses, vehicles, and animals were made to be assembled together into a toy fantasy land.
The budget was considerably smaller than that of the Halo Believe site, but Barbie's own professional set designers took on the epic task of building six gigantic detailed landscapes with the dolls, accessories and all composed within.
Since the entire site was based on the interaction of this video being played in an infinite loop, I had to get creative with the site map, displaying an oval track with segments that represent a different chapter in the video, with the ability to dive into detailed content at specific interaction points during the video.
I also had the idea of creating a diorama for the timeline, but this was sadly scrapped for a fairly traditional timeline. You can see the diorama timeline in the wireframes below and imagine how the dolls and accessories would relate to when they appear in the video. A simple and fun idea, and one that I'd like to do in some form in the future.
The Barbie 50th Anniversary site received a Silver ADDY Award in 2009.
Watch 50 Years of Barbie >



















































































































