Archive for category Twist Image
I just wanted to show you what came out of my work with Robotlegs. Recharge with Milk is a hybrid site Html/Flash. We did the flash part because for the home section it would be faster to take care of the page resizing and to add some animations in the compare tool.
Only the home page was built using Robotlegs. It is pretty simple so it was a good fit to try a new framework, but there is way more going on than what it looks like. Everything on the home page is customizable from a xml and there are a lot of layers of views.
At some point in the project I was finding real beauty in the code, but I was really sad because nobody other than developer could see that beauty…
I know that for every project I say that it was the most complicated one that I did, but this one really was the most complicated I ever did. There even was a night where I didn’t sleep because I wasn’t sure I could make it happen.
My big challenge was to create an experience that was close to what the design team was imagining but that wasn’t too CPU intensive (like all my other projects). I think I did manage to do that. It runs pretty smoothly even on some bad computers. I let Papervision3D do all the heavy lifting but I kinda trick the user into think that there are a huge load of dominoes while at any time there is only 300 of them max (you could consider this object pooling). A second challenge was to position those 2400 dominoes so the they make the final path. The design was done in Illustrator so what we did was that we exported the .AI file as a .SVG file. SVG is just an XML so I made another program that would read the SVG and output (trace to the console) ActionScript code that I would paste into the main application. Finally, the last challenge was to show a zoom out with all the dominoes fallen revealing the message. As I said earlier, if I had 2000+ dominoes at the same time that would be too hard for the computer and run really slow. So I replaced the scene with a bitmap. To get that final bitmap I had to make yet another program that would render me the final path with all dominoes fall and that a screenshot of it.
So I ended up doing 2 more ActionScript projects to end up with the finished product: The Holiday Humanoes.
Oh yeah, just a little trick to finish up, when you deal with COLLADA models, make sure your 3D guy exports the model without the textures if you don’t want the Flash Player to query the server each time you create a DAE. That is what was happening at first and it really scared me.
If you have been wondering why I haven’t been writting a lot this summer, well it’s been mostly because of this project. I learned a great deal on Papervision3D, using the webcam, on playing with bitmaps and on Facebook connect (even if I wasn’t the one doing that part) while building this project. So here you go, create some roars:
The goal of the campaign was to get teens involved with milk and to build on some ad spots that performed very well on MTV. So what you are doing with this application is recreating the ads but adding yourself at the end instead of the cow. Now I knowthat the site is a bit (to say the least) CPU intensive (3D tends to do this), but believe me it was worse than this before and I wish I would have had a bit more time to perfect this site.
The technical cool part is that you can use your picture, be it by uploading it or using your webcam, and using the derivate bitmap I will composite it with the cow skin and apply that to the loaded Collada model. That was kind of the premise of this site and we built around it with a vintage design. I hope you like it.
Here is a short list of librairies we used: as3corelib, TweenLite, Alcon, facebook api, google analytics for flash and Papervision3D.
Another cool feature is that you can embed your roar on your blog like this:
I haven’t written in the last month or so and I wanted to put an end to this. Two new Twist Image productions were just put live for The Home Depot : considering carpet and treat your windows. They are basically tools to help you choose carpets and window coverings. While I can’t say that I was as much involved with those project that the 3 before (think in colour, redefining floors and transition to tile), these projects have been really great at introducing the PureMVC framework to new developers. Since they didn’t have to build them from scratch because they are based a lot on the previous tools, these projects gave PureMVC a better learning curve and really showed them the advantages of using the framework. I didn’t have to do any convincing after that to get them to use PureMVC on every project we do.
The technologies used were about the same as the previous ones. This raises the number of tools we did for The Home Depot to 5 and our toolbox is nearly completed but stay tuned for something new in a near future.
Here are the links again:
Yes this is the third installment of tools we did for the Home Depot and I can say that working on this one was just simple and easy, mostly because we used PureMVC on the previous one. As you can see, Transition to tile reuse a lot of components from Redefining floors, but the middle part is really different. Making the changes and adjusting what was already there really was a breeze and that is were you see the advantages of using a framework. The technologies we used were mostly the same as the one before but I am going to list them here again:
- Alcon (for tracing SWFAddress stuff)
- Google Analytics for Flash
I hope you like the tools we are building for Home Depot because there is more in the pipeline.
I’m happy to announce that we just lanched today a campaign for the Dairy Farmers of Canada. My part in this was to do develop the microsite, but their was an entire team working on the facebook application, the banners, the widget. We worked really hard on this and I think this is going to be a sucessfull campaign. I went on again using PureMVC even if this was more a website than an application and I can say that I really don’t regret it. Even if we kept adding features, the project grew correctly and I could go back in the code in a month and I would still be a happy developper and understand where everything is. Here is a list of the features / libraries used in the project:
- SWFObject from Google hosted libraries API
- TubeLoc (I had a few problems using it at first, but I could do it way faster now)
- The microsite resizes to fit smaller resolutions
- TweenMax (I am going to use the colorMatrixFilters everywhere now)
One of the goal of the campaign is to get the most people clicking on a button on June 3rd to make a world record. You can click on the button from facebook, banners, the microsite and a widget like this one:
And I forgot on June 3rd, go back to the microsite and go beserk on the moo button!