Puma got a nice mention in Rob Ford’s Adobe Edge column:
Related Link:
http://www.adobe.com/newsletters/edge/june2009/articles/article3/
While I was working on the "National Grid Floe" project (yes, that was last year! come on I'm slowly catching up with my posts.) I was facing the problem, that I had to place a massive amount of differently sized elements in a certain area on the site, with the problem being that the elements were not supposed to overlap with each other. A very basic approach - that's actually used more often than you would think - is to just place an object at a random place and test if it overlaps with any other object. If it does, place it somewhere else and test again, if it does not overlap with anything move on to placing the next object. As you can see this procedure is highly inefficient. Since you're working with randomly generated positions, it could easily happen that you place the object at the same position over and over again, wasting a lot of performance on something completely useless. The more objects you are placing, the more likely it is that this method makes your computer freeze and the browser crash. Since "National Grid Floe"'s community works with a ton of "user bubbles" that are not supposed to overlap each other I had to find a way to get an available spot on the first placement, otherwise the site would run into massive performance problems...
My solution works with a simple two-dimensional array. I create a grid of many rectangles and store in the array which of the rectangles are still available. Whenever I am about to place an object I look at the object's size and figure out how many rectangles next to each other in the grid I will need for this object and search for the nearest empty blob of free rectangles, big enough for the object. Since I keep checking each cell until I found a place for the object, the worst case scenario for repeated calculations with my system would be the amount of cells in the grid. That is still quite a few recursions but definitely beats the possibility of infinity with the common basic method. I created this solution in around a day or two, because I was under a really tight deadline back then and couldn't afford to research if there are even more efficient methods, but my class proved to be more than fast enough for what I needed it for.
As usual, I'm running a little behind with the blog entries. I've been busy in the past month(s), but it was well worth it; on April 21st the site I've been working on for Puma has won the FWA SOTD award. For this project firstborn teamed up with droga5 and created an interactive video experience in which the user can weigh the new Puma shoe against everyday objects. Our goal was simply to show (not tell) in a funny and interesting way how light the shoe is. I was the Lead Developer for this project, but was also involved in the video shoot (for example experimenting with different shooting and "stitching" styles in the very beginning of the project). Next to the main site I also developed the teaser site and the "Pullback" banner execution - you can see both in the case study in firstborn's portfolio.
Related Links:
http://lift.puma.com
http://www.firstbornmultimedia.com/#/our-portfolio/1056/case-study/
National Grid Floe got featured on "Creativity" magazine's website. Check out the right column. Lead Developer: Jens Fischer. Very nice.
*edit: Since it has been more than 14 days, you now need a subsciption to view the post on Creativity's website. For those who don't have one, check out the link to Ads Of The World, it's pretty much the same thing...
-
Related Links:
http://creativity-online.com/work/view?seed=dd500551
http://adsoftheworld.com/media/online/national_grid_floe
Whoa. During the Lost season's finale the national grid commercial, which is driving traffic to our site, was aired. I'm surprised how efficient such a commercial is: so many people visited the site, that around midnight the server gave up and had to be restarted.
The site had around 1000 new registrations in one night (not visitors... registrations !!!), which is a huge success. Usually no one registers on a website if it's not necessary...
Finally, after a good one and a half months of hard work, short nights and tons of coffee and 0.5 liter Red Bull cans, http://www.nationalgridfloe.com went live. It's been my first project as a full time employee for firstborn, and I think it's safe to say, that it was a good start. Firstborn was approached by the ad-agency Mullen to build a site for the electricity and gas company National Grid. The goal of the website is to create awareness of the fact, that even little everyday actions have an impact on the environment and that by taking little actions in your everyday life, you can make a positive change. To achieve that, we went with a polar bear theme, which is a very emotional topic right now, because of the US government's very recent admission, that the polar bear is an endangered species. On the site, you will find three main sections: "take action", "befriend a bear" and "community".
Take action:
This is the "adult" part of the site, where you can compare everyday actions and find out, how they affect the environment. For example: Eating one cheeseburger has the same impact on the environment as drinking 28 cans of coke. Who would have thought that? But don't worry. In this section, you can also add those everyday actions to your private action list and pledge to behave good in this special area. So if you pledge to eat one less cheeseburger per week, for example, you would save 1.22 lbs. of CO2 per week. The moment you drag an action into your action list and pledge to make the change, you can see the environment in the background react...
Befriend a bear:
This section features a little polar bear cub and is a little bit less serious, it's meant for kids and adults at work. By playing little games with the polar bear, you can increase his health, happiness and friendship. Throughout the game play, you have to answer questions, to unlock games for example, and those questions teach a few facts about environmental impact in a playful way. I love this section.
Community:
This section keeps track about the statistics of the site. You can let the community know, why you decided to take action and can see, which actions have been pledged the most, how much has the community saved in total and how much you have saved yourself since you joined the site. As of May 29th, 2008 over 3800 people registered on the site already, which is pretty amazing. Usually no one registers on websites if it doesn't really have to be. Also, due to the site being hooked up to Google analytics, we know that the average user stays around 8-9 minutes on the site, which is also pretty amazing for an average.
Our team:
- PRODUCER: dealing with the ad-agency and the client, managing the whole project time line, working on concept and copy
- CREATIVE DIRECTOR: modeling and rendering the 3d, designing pretty much the whole site
- MOTION DESIGNER: animating the 3d models, which is a lot more work than it sounds
- BACKEND DEVELOPER: our main programmer, working on the php and database part of the site (saving user data etc)
- SOUND PRODUCTION ARTIST: hired by firstborn on a freelance basis, to produce the sounds for the site, in the end our German intern did most of the work tho (hi Marcus)
- ME: I was the only frontend developer, which means i put the whole thing together in Flash and brought the static screendesign to life. The project is coded in Actionscript 3 and funnily enough: even tho it's a Flash site, I didn't really open the program Flash for this project, because I used Eclipse and FDT to code and Flex to compile the project... Last but not least, I also played a major role in the conceptual design, so I was allowed to do the two things I enjoy most: C&C... concept and code...
To sum it up...
I'm pretty proud of the outcome, especially because firstborn showed a whole lot of trust, by giving me such an important role in a pretty big/important/expensive project as my first job. I'm thrilled to be part of the team/family and the next project for me starts on Monday already. I'm excited and you'll have plenty of cool things to look forward to here on this blog...
-
Project Link: http://www.nationalgridfloe.com