Website spotlight: Still-alive

What a load of news on the past few days, uh? I mean, Apollo is now AIR, a new beta version of the Flash Player includes plenty of goodness (including mip map support when resizing images, goodbye Moiré effects!), Apple presents a lot of stuff (including a glimpse of id Software’s next project!)… exciting times.

I’ve also been busy as hell lately (hence why I haven’t posted so much). So as I do once in a while, I’d like to show you the final product of those long hours.

Still Alive is a website the company I freelance for (Gringo.nu) has built for Companhia Vale do Rio Doce, a metal and mining company. Despite being a big client and all that, it’s a playful website, meant to teach people about some of the company’s reforestation projects. It’s also designed by Victor Sahate and developed by me.

In this website you can knit over a dead tree and while doing so, you reveal a new, lively tree, and find – “save” – a few animals in the process. Finding all animals means your name is saved and kept on a list on the website.

Now here’s the cool thing: this entire process, including browsing the website areas, is done with a multiuser environment. This means that while you’re reading the (few) text areas, you’ll see small tags (representing other people) flying around; and when you zoom in to knit the tree, these other people will be there knitting with you. They see what you knit and vice-versa; up to 8 people can be knitting the same tree – like a multiuser room – at once, and new rooms are created when needed.

A very nice website and my first big, commercial website using Flash Media Server (I usually focus on the user interface instead). Getting the multiuser protocol for this to work fine (considering it’d need a lot of updates so you could see the other users moving and knitting in real time) was a real challenge but still fun. And funny enough, it also contains some of the most difficult artificial intelligence I’d had to build to date: if you log into the website and there’s no one else there to knit with you, or if you’re visiting from a network that blocks RTMP messages (so socket communication won’t work), it creates a fake “bot” user that simulates a real user and starts knitting away. The bot leaves when a real user joins.

And while I’m at it, here’s some Tweener statistics for this project, as I’ve mentioned this somewhere else but didn’t go too deep into it:

  • 272 addTween() calls;
  • 2 addCaller() calls;
  • 70 removeTween() calls;
  • Transitions used: easeoutquad (47 times), easeinoutquad (1), linear (116), easeoutquint (4), easeinoutquint (10), easeinback (2), easeoutback (4), easeoutexpo (12; which is stupid, considering it’s the default one)
  • Some parameters used: rounded (5 times), skipUpdates (6), onStart (3), onUpdate (24), onComplete (57)

Pretty much the reason why I like to keep my tweening development process simple and straightforward.

Update: Still Alive just got the FWA for 19/jun, and into the Cannes (Cyber) Lions shortlist on the same day a bronze on Cannes (Cyber) Lions for the “Charities, Public Health & Safety, Public Awareness” website category a couple of days later. Awesome.

  • Nice work Zeh. I love the multi-user interface! Smart thinking on the AI as well. 😉

  • Awesome!!

  • Excellent stuff Zeh you should post your work more often. Do you contract outside of gringo?

  • Zeh

    Thanks, guys! It means a lot to me.

    Ryan — thanks. And no… although I’m a freelancer, I work exclusively for Gringo.nu, so I’m not currently available for other gigs (I hope my post didn’t look like work advertising, but sorry if it did).

  • Nice multiuser stuff here. I was gonna ask which you were using FMS, RED5 or just sockets for the multiuser aspect. I am implementing that in an engine now using sockets and Red5. I went against FMS due to price and limits on users (I think 50 is the base user count that can easily be hit).

    I am also working on a set of bots that move around if there is not many people in at that moment. I am thinking about turning it into an engine for otehrs but not sure about time. It is fun stuff that is for sure. Have you done much with Red5? Have you seen: http://www.ff0000.com/ ? It is a killer use of multiuser chat right on their site, it even has cheats.

    btw I was only asking on contracting because you woudl be a great guru/consultant it didn’t appear like an ad more like a showcase of your work I was just asking 🙂

  • Zeh

    Ryan: it’s using FMS, although it’s just sockets (I didn’t even use shared objects as I wanted deep control of the syncing procedure and I didn’t feel confident with SO), so any other socket/rtmp server would work just the same, Red5 included. FMS was chosen because they already had the dedicated server available (it’s being used for a few other projects for the agency who has the client account) so the cost wasn’t really an impact. And it’s nice, using actionscript is awesome even if it’s as1, etc, but really, most of the times it’d just be overkill because of pricing.

    Red agency’s website is killer. It’s really awesome. What we’ve built on Vale is similar in concept, but it’s simpler in the aspect that it only sends the user position, even if there’s a certain cooperative aspect as the points the user has knit are also sent, the animals he has revealed, there’s an endgame, etc.

  • Mirko

    Waoooo really impressive, cangratulations Zeh!!!

  • Hi, Zeh … impressive work man!
    just today a read about your Tweener project, and it rocks! hope contribute debuggin it in my spare time…

    see you.