[WSG] Google Les Paul tribute

2011-06-09 Thread Grant Bailey

Hello,

Today's Google home page has an interactive guitar in honour of Les 
Paul. It makes sounds when you 'strum' the strings.


I was wondering what technologies Google used to create this incredible 
element. It does not appear to be Flash ... does anyone know.


Thank you and kind regards,

Grant Bailey



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Jason Grant
HTML, CSS and JavaScript of course.

On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey 
grant_malcolm_bai...@westnet.com.au wrote:

 Hello,

 Today's Google home page has an interactive guitar in honour of Les Paul.
 It makes sounds when you 'strum' the strings.

 I was wondering what technologies Google used to create this incredible
 element. It does not appear to be Flash ... does anyone know.

 Thank you and kind regards,

 Grant Bailey



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




-- 
Jason Grant BSc [Hons], MSc [Hons]
Customer Experience Architect
Flexewebs Ltd.

www.flexewebs.com
ja...@flexewebs.com
+44 (0)7748 591 770

www.flexewebs.com/semantix
www.twitter.com/flexewebs
www.linkedin.com/in/flexewebs


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread ben kahans
Yeah, I was blown away and can now play happy birthday and other 3 chord
songs without even picking up the guitar. Looked like flash but no, looks to
me like all dom programming

Strings must be hit areas toggling animated gifs and triggering mp3s -
framework? - no  - or something or something  -  I reckon it's a worthy
discussion for WSG

On Thu, Jun 9, 2011 at 9:11 PM, Jason Grant ja...@flexewebs.com wrote:

 HTML, CSS and JavaScript of course.


 On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey 
 grant_malcolm_bai...@westnet.com.au wrote:

 Hello,

 Today's Google home page has an interactive guitar in honour of Les Paul.
 It makes sounds when you 'strum' the strings.

 I was wondering what technologies Google used to create this incredible
 element. It does not appear to be Flash ... does anyone know.

 Thank you and kind regards,

 Grant Bailey



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




 --
 Jason Grant BSc [Hons], MSc [Hons]
 Customer Experience Architect
 Flexewebs Ltd.

 www.flexewebs.com
 ja...@flexewebs.com
 +44 (0)7748 591 770

 www.flexewebs.com/semantix
 www.twitter.com/flexewebs
 www.linkedin.com/in/flexewebs


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




-- 
Ben Kahans
Web Designer/Developer
Jumping Dog Design
www.jumpingdogdesign.com.au
0411980122


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread designer
It uses the html5 'canvas' tag as the basis.

http://en.wikipedia.org/wiki/Canvas_element  any many more . . .

Bob


  - Original Message - 
  From: Jason Grant 
  To: wsg@webstandardsgroup.org 
  Sent: Thursday, June 09, 2011 12:11 PM
  Subject: Re: [WSG] Google Les Paul tribute


  HTML, CSS and JavaScript of course. 


  On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey 
grant_malcolm_bai...@westnet.com.au wrote:

Hello,

Today's Google home page has an interactive guitar in honour of Les Paul. 
It makes sounds when you 'strum' the strings.

I was wondering what technologies Google used to create this incredible 
element. It does not appear to be Flash ... does anyone know.

Thank you and kind regards,

Grant Bailey



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***





  -- 
  Jason Grant BSc [Hons], MSc [Hons]
  Customer Experience Architect
  Flexewebs Ltd. 

  www.flexewebs.com 
  ja...@flexewebs.com 
  +44 (0)7748 591 770

  www.flexewebs.com/semantix
  www.twitter.com/flexewebs 
  www.linkedin.com/in/flexewebs


  ***
  List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
  Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
  Help: memberh...@webstandardsgroup.org
  *** 


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Chad Kelly

On 6/9/2011 9:23 PM, ben kahans wrote:
Yeah, I was blown away and can now play happy birthday and other 3 
chord songs without even picking up the guitar. Looked like flash but 
no, looks to me like all dom programming


Strings must be hit areas toggling animated gifs and triggering mp3s - 
framework? - no  - or something or something  -  I reckon it's a 
worthy discussion for WSG
I have heard a lot of these animated Google logo's are just animated 
gifs with javascript tohandle the mouse overs.

It does not work without JS enabled, it just shows a standard image.



O




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread ben kahans
Okay, I'm converted!

On Thu, Jun 9, 2011 at 9:25 PM, designer
desig...@gwelanmor-internet.co.ukwrote:

  It uses the html5 'canvas' tag as the basis.

 http://en.wikipedia.org/wiki/Canvas_element  any many more . . .

 Bob



 - Original Message -
 *From:* Jason Grant ja...@flexewebs.com
 *To:* wsg@webstandardsgroup.org
 *Sent:* Thursday, June 09, 2011 12:11 PM
 *Subject:* Re: [WSG] Google Les Paul tribute

 HTML, CSS and JavaScript of course.

 On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey 
 grant_malcolm_bai...@westnet.com.au wrote:

 Hello,

 Today's Google home page has an interactive guitar in honour of Les Paul.
 It makes sounds when you 'strum' the strings.

 I was wondering what technologies Google used to create this incredible
 element. It does not appear to be Flash ... does anyone know.

 Thank you and kind regards,

 Grant Bailey



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




 --
 Jason Grant BSc [Hons], MSc [Hons]
 Customer Experience Architect
 Flexewebs Ltd.

 www.flexewebs.com
 ja...@flexewebs.com
 +44 (0)7748 591 770

 www.flexewebs.com/semantix
 www.twitter.com/flexewebs
 www.linkedin.com/in/flexewebs


 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




-- 
Ben Kahans
Web Designer/Developer
Jumping Dog Design
www.jumpingdogdesign.com.au
0411980122


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Russ Weakley

 HTML, CSS and JavaScript of course. 

Remarkably detailed and insightful help there!  ;)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Grant Bailey
Saving the web page does not seem to reproduce the functionality ... is 
that to be expected?


The guitar does not make any sound in IE7 (at least on my machine) ... 
perhaps due to IE's lack of support for canvas ?  I would have thought 
that Google would apply a shim ...



On 9/06/2011 9:25 PM, designer wrote:

It uses the html5 'canvas' tag as the basis.
http://en.wikipedia.org/wiki/Canvas_element  any many more . . .
Bob

- Original Message -
*From:* Jason Grant mailto:ja...@flexewebs.com
*To:* wsg@webstandardsgroup.org mailto:wsg@webstandardsgroup.org
*Sent:* Thursday, June 09, 2011 12:11 PM
*Subject:* Re: [WSG] Google Les Paul tribute

HTML, CSS and JavaScript of course.

On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey
grant_malcolm_bai...@westnet.com.au
mailto:grant_malcolm_bai...@westnet.com.au wrote:

Hello,

Today's Google home page has an interactive guitar in honour
of Les Paul. It makes sounds when you 'strum' the strings.

I was wondering what technologies Google used to create this
incredible element. It does not appear to be Flash ... does
anyone know.

Thank you and kind regards,

Grant Bailey



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
mailto:memberh...@webstandardsgroup.org
***




-- 
Jason Grant BSc [Hons], MSc [Hons]

Customer Experience Architect
Flexewebs Ltd.

www.flexewebs.com http://www.flexewebs.com
ja...@flexewebs.com mailto:ja...@flexewebs.com
+44 (0)7748 591 770

www.flexewebs.com/semantix http://www.flexewebs.com/semantix
www.twitter.com/flexewebs http://www.twitter.com/flexewebs
www.linkedin.com/in/flexewebs http://www.linkedin.com/in/flexewebs


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
*** 



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Chris Harris
HTML5, easy to do

Kind Regards,

Chris Harris
CEO | Founder | Producer
juicemedia
ch...@juicemedia.com.au
T. 612 99044022
M. 61 413 108870

www.juicemedia.com.au


On Jun 9, 2011, at 9:16 PM, Jason Grant ja...@flexewebs.com wrote:

HTML, CSS and JavaScript of course.

On Thu, Jun 9, 2011 at 12:05 PM, Grant Bailey 
grant_malcolm_bai...@westnet.com.au wrote:

 Hello,

 Today's Google home page has an interactive guitar in honour of Les Paul.
 It makes sounds when you 'strum' the strings.

 I was wondering what technologies Google used to create this incredible
 element. It does not appear to be Flash ... does anyone know.

 Thank you and kind regards,

 Grant Bailey



 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***




-- 
Jason Grant BSc [Hons], MSc [Hons]
Customer Experience Architect
Flexewebs Ltd.

www.flexewebs.com
ja...@flexewebs.com
+44 (0)7748 591 770

www.flexewebs.com/semantix
www.twitter.com/flexewebs
www.linkedin.com/in/flexewebs


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Patrick H. Lauke

On 09/06/2011 12:05, Grant Bailey wrote:

Hello,

Today's Google home page has an interactive guitar in honour of Les
Paul. It makes sounds when you 'strum' the strings.

I was wondering what technologies Google used to create this incredible
element. It does not appear to be Flash ... does anyone know.


View Source...

And yes, it does use flash (rather than the audio element) for the 
actual sound playback...


P
--
Patrick H. Lauke
__
re∑dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]

www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com | http://flickr.com/photos/redux/
__
twitter: @patrick_h_lauke | skype: patrick_h_lauke
__


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] Google Les Paul tribute

2011-06-09 Thread Lesley Lutomski

On 09/06/11 12:37, Grant Bailey wrote:

The guitar does not make any sound in IE7 (at least on my machine) ...
perhaps due to IE's lack of support for canvas ?  I would have thought
that Google would apply a shim ...


Perhaps not, since they're apparently about to phase out support for it: 
http://www.bbc.co.uk/news/technology-13639875


Lesley

--
Life is not a malfunction (Short Circuit)


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] Google Les Paul tribute

2011-06-09 Thread tedd

At 12:55 PM +0100 6/9/11, Nick Brown wrote:

The sound is done using Flash (there's no audio tag).


That explains it.

If you got the notes and the triggers, it's pretty simple.

Cheers,

tedd


--
---
http://sperling.com/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



[WSG] mobile

2011-06-09 Thread David Laakso

Greetings from San Juan, Puerto Rico.

re: http://chelseacreekstudio.com/

Constructive comments are always welcome. Specifically we are interested 
to know if the images within the portfolio section fill the window 
horizontally in both portrait and landscape view in handsets smaller 
than 320 by 480.


This end:
mobile-- Samsung Galaxy Prevail for BoostMobile with Android/2.2.2.
desktop--Mac 0S X 10.4.11.

Thanks for your assistance.

Best,
Milagros Sanchez,
Creative Director,
Chelsea Creek Studio



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***

Re: [WSG] mobile

2011-06-09 Thread Joseph Taylor
I found the prev/next navigation in the portfolio confusing. 

I was expecting them to be side by side and at the bottom of the entry rather 
than bundled in the main nav. 

Sent via iPhone:

Joseph R. B. Taylor
Designer/Developer
---
Sites by Joe, LLC
Clean, Simple  Elegant Web Design
http://sitesbyjoe.com
Phone: (508) 840-9657


On Jun 9, 2011, at 5:11 PM, David Laakso da...@chelseacreekstudio.com wrote:

 Greetings from San Juan, Puerto Rico.
 
 re: http://chelseacreekstudio.com/
 
 Constructive comments are always welcome. Specifically we are interested to 
 know if the images within the portfolio section fill the window horizontally 
 in both portrait and landscape view in handsets smaller than 320 by 480.
 
 This end:
 mobile-- Samsung Galaxy Prevail for BoostMobile with Android/2.2.2.
 desktop--Mac 0S X 10.4.11.
 
 Thanks for your assistance.
 
 Best,
 Milagros Sanchez,
 Creative Director,
 Chelsea Creek Studio
 
 ***
 List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
 Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
 Help: memberh...@webstandardsgroup.org
 ***


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***


Re: [WSG] mobile

2011-06-09 Thread tedd

At 5:11 PM -0400 6/9/11, David Laakso wrote:

Greetings from San Juan, Puerto Rico.

re: http://chelseacreekstudio.com/http://chelseacreekstudio.com/

Constructive comments are always welcome. Specifically we are 
interested to know if the images within the portfolio section fill 
the window horizontally in both portrait and landscape view in 
handsets smaller than 320 by 480.


~d:

On an iPad using Safari the portrait mode looks good with the Home 
Portfolio Recourses navigation buttons falling at the bottom of the 
page landing over the middle of the square. However, if I scroll, the 
navigation buttons remain fixed to the middle of the square. They 
don't remain at the bottom of the page as they would with a normal 
browser.


In landscape mode, the page still looks good but the navigation 
buttons fall on top of the upper-third of the square showing only the 
light-gray and darker-gray borders. The buttons say fixed to the 
document when I scroll. In other words, they stay on top of the 
square and not at the bottom of the page.


When I activate the Want to know more link, the option works great 
and pushes the square down and out of the picture.


However if I scroll, the aforementioned buttons fall fixed to the 
page and cut the line Standards Group mailing list in half 
horizontally. In other words, I only see the bottom half of that 
line. If I scroll the half-shown line remains fixed to the page -- it 
looks odd.


I have JavaScript set to on, but apparently it doesn't work the same 
as Safari on the Mac.


HTH's

tedd

--
---
http://sperling.com/


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***