How The Martha Graham Google Logo is Animated(acumenholdings.com)

145 pointsby joshclemence15 anni fa25 comments

How The Martha Graham Google Logo is Animated

http://www.acumenholdings.com/blog/how-the-martha-grahm-google-logo-is-animated-short-explanation/

10 comments

gokhan15 anni fa

I can't see any doodle on Google homepage, don't know why it's not available to my country. Here's a higher resolution video of the doodle by the artist Ryan Woodward himself:

http://www.youtube.com/watch?v=IsbI1GE4DGA

It appears that animating dance figures is his speciality, check also this:

http://www.youtube.com/watch?v=OBk3ynRbtsw

kschua15 anni fa

It has been taken down. Their doodles last only 24 hours.

For future reference, if you think that a Google doodle is not available in your country, you can try www.google.com/ncr

akent15 anni fa

Saved mirror anyone? I missed it.

nostrademons15 anni fa

They usually end up on http://www.google.com/logos/ after a few days, time permitting. There's a backlog right now because there've been like 5 animated doodles in the past month.

ableal15 anni fa

A search with "gif" tacked on netted me this satisfactory animation: http://www.gifsoup.com/view/2476182/google-doodle-martha-gra...

seanalltogether15 anni fa

I can't access the article but looking at the homepage, I'm surprised it's not just a giant spritesheet that changes the x/y offset on certain intervals.

Nevermind, it is a giant spritesheet, but it's optimised to allow for static elements to not have to be redrawn. http://www.google.com/logos/2011/graham11-hp-sprite.png

noduerme15 anni fa

Yes, but isn't Google supposed to be able to come up with an elegant equation to represent those coordinates so it's not just this huge ugly pile of crap? I popped the code open on it this morning and yawned. You know a company's starting to get love handles when they have people who spend a week doing stuff like this that runs for a day, mildly annoys a bunch of people, and is immediately replaced.

8345715 anni fa

You do understand that people are literally going to google to watch this animation, play pac-man and whatever else cool that happens on the frontpage? Made it to Hacker News frontpage and people are talking about Google's homepage. Job well done.

noduerme15 anni fa

Lighten up. People go to google regardless. And people talk about it because it's the first thing everyone sees when they get to work in the morning. All I'm saying is it's not really much of an accomplishment. An animated gif would have been the same size file, for example -- no giant array necessary. I'm just saying it's ironic that a company that's supposed to exemplify elegant systems would end up writing single-use code that basically boils down to a large ANSI graphic you'd see on the front of a WWIV BBS.

Hugh Hefner's birthday is April 9th. Where was his banner?

cma15 anni fa

http://upload.wikimedia.org/wikipedia/commons/c/c7/Marissa_M...

(edit: nevermind, she is now VP of Location and Local Services; I was thinking of the background image debacle)

leejoramo15 anni fa

To get an animated feel for how this works, add a user CSS to outline the border. I use the "User CSS" extension for Safari

http://code.grid.in.th/

Then add this CSS:

#hplogo div { border: 1px red solid; }

audionerd15 anni fa

I wonder why they went with many <div>'s, instead of a single <div> with JS controlling the background-position and clip?

makeramen15 anni fa

With many small divs they only need to redraw the part that changes. The sprite can also be smaller because every frame doesn't have to be the full size of the logo.

ja2ke15 anni fa

There's pausing and overlap in the animation

hammock15 anni fa

Select the logo as it animates to see more clearly how it's a bunch of divs being spawned. (To select it, either use your mouse or tab out of the search box and hit Ctrl-A)

link: www.google.com

mamp15 anni fa

The animation was cool the first time, then after that it just got annoying - like having a flash ad on the page. I changed my search to Bing for the first time ever because of this animation.

_debug_15 anni fa

Let me guess : by taking up 100% CPU? Irritated me the whole day.

defroost15 anni fa

I use igoogle start page, and I can't see any animation, just a static Martha Graham Google Logo. Does anyone have a the correct google URL in the States? I've seen the video of it, but it annoying me that I can't see the actual animation.

*edit: I found it http://www.google.ca/

makeramen15 anni fa

if you don't want to log out, just open up chrome in porn-mode (incognito) and go to google.com

or just use any other browser your'e not logged in to. or just log out.

defroost15 anni fa

I guess since google.com/ig stores a cookies on my browser, all of them actually, I couldn't get the normal google search page, even with logging out. Thanks for the private mode tip.

moserware15 anni fa

Try using an private/incognito window/tab

golgo1315 anni fa

The logo didn't work in Opera 11.10 :/ I had to fire up IE 9 to take a peek

noduerme15 anni fa

Ain't really brilliant. And they used the same 'doodle' method before. What would be nice is if they used the HTML5/canvas methods they've been hyping so hard. Unfortunately, animating this with that would take at least a QC Xeon.

What would be really, really awesome would be if they did it with Flash. Then it would work on droid, and iOS users would all go 'wtf?'

firefoxman115 anni fa

Yeah I wish they would use canvas for browsers that support it, and fall back to the million-div method

nostrademons15 anni fa

Bunsen was done with canvas:

http://www.google.com/logos/bunsen.html

It probably wouldn't have worked here, at least not without the gorgeous artwork that makes the doodle famous. It was already a huge PITA to get all the control points into Bunsen, and that was a mostly static animation with pretty much simple polygons in motion. Martha Graham has fluid motion and semi-realistic human figures; this is far too complex to draw with just code.