Pete

Pete

(10 comments, 270 posts)

This user hasn't shared any profile information

Home page: http://petelepage.com

Posts by Pete
player-full

Introducing Video Player Sample

0
January 6, 2012
by Pete in , , ,

Have you ever wanted a fun and beautiful way to publish videos on your own site like the new 60 Minutes or RedBull.tv apps from the Chrome Web Store? I’m excited to announce the release of The Video Player Sample! The Video Player Sample is an open source video player web app built using the same architecture as the 60 Minutes and RedBull.tv apps. It can be customized, extended, or just used out of the box and populated with your own content.

How it works

When a user opens the Video Player Sample web app, they can choose to watch a single video or create a playlist of videos/episodes from a list that they have uploaded and populated to the app. The Video Player Sample is configured and information about the videos is stored in JSON files (config.json and data.json respectively), both of which are located in the data directory.

Key features

  • A beautiful video watching experience, including a full screen view
  • Ability to subscribe to shows, watch episodes, create play lists
  • Support for multiple video formats depending on what the user’s browser supports (including WebM, Ogg, MP4, and even a Flash fallback)
  • A Categories page with an overview of the different shows/categories available in the app
  • Notifications of new episodes (when the app is installed via the Chrome Web Store)
  • Built in support for sharing to Google+, Twitter and Facebook
  • To ensure easy customization, all source files, including the Photoshop PSD’s, are included

How it’s built

The Google Video Application is written for the open web platform using HTML and JavaScript, broadly following the MVC (Model View Controller) pattern and structure.

Browser Support

In addition to working as an app that can be installed through the Chrome Web Store, the Video Player Web App has been tested and works in all of the modern browsers.

Try it out

You can see a demo of the video player in action in the demo app, or by Adding it to Chrome through the Chrome Web Store. To learn more about how the app works, check out the documentation.

You can grab the code from Google Code.

Enjoy!

Cross Posted at: http://google-opensource.blogspot.com/2012/01/introducing-video-player-sample.html

HTML5 Guy with Blue Beanie

Happy Blue Beanie Day

0
November 30, 2011
by Pete in ,

Happy Blue Beanie Day from the HTML5 Hipster

HTML5 Guy with Blue Beanie

Credits: Seth Ladd for the HTML5 Guy idea. Kevin Cornell (via) Zeldman for the Beanie.

Other Formats: SVG Adobe Illustrator PNG

webapp

Building A More App-y Web

0
November 17, 2011
by Pete in , , ,

Everyone wants “apps” these days, on their phone, their tablets, Apple, has the App Store to sell apps for the Mac.  The demand is coming from all over the place, including consumers who have no idea what apps are, to people who are seeing this as a new revenue opportunity (which, it is)!  I even heard from one developer who said that his boss came to him all panicked because he got a call from the company’s chairman of the board, wanting to know what their app strategy was.  So far, most of the focus has been on apps for mobile devices, tablets, but thankfully it’s really starting to take off on the web, and we’re seeing more web apps appearing.

One piece of the puzzle that hasn’t really solidified yet is what defines a web app, and how does it differ from a web site?  Are app like experiences on the web part of a website, or are they web apps?  What about web sites that provide the same functionality as an app, but looks like a web site?

Is it a web site, or a web app?

TripIt is a great example, it’s concept is absolutely an app, it helps me to coordinate my travel plans into a single place where I can easily organize my trips into a single online experience.  Here’s where it gets confusing, compare their web application to their tablet application.  I can do exactly the same sets of things, but one looks like an application, and one looks like a website.  They both let me do the same tasks, but they provide very different experiences to complete those tasks. So what is the TripIt web app, is it a site or an app?

Before I go too far though, I want to profess my love for TripIt, I use it for all my travel and have been a Pro user for over a year now, and will renew next time it’s up for renewal.  I love that it tells me where I can find my luggage, how to get to my next gate, and often, it knows my flight is going to be late before the airline tells me!  I love that I can carry it on my phone and quickly look up my flight confirmation code, or when I’m in a foreign country, pull up my hotel information hand my phone to the taxi driver and point to where I want to go.

How do we define a web app then?

Many people have suggested different ways to define web apps in a single test or definition.  I enjoy reading AppStorm, I think they do a great job of highlighting awesome web apps, but a while ago, they tried to define web apps, and provided one of my favorite non-answers:

A web application is an application utilizing web and [web] browser technologies to accomplish one or more tasks over a network, typically through a [web] browser.

That answer is almost as good as saying “because it’s not orange” to the question why is the sky blue.

It can’t be a single criteria

Single criteria definitions don’t work for me either.  Can we say something is an app because of a single property?  For example, creation vs. consumption, or architecture.  Add the diversity of web apps to the mix, and I think we hit a wall when it comes to defining web apps with a single criterion.

A web app checklist

The diversity of apps makes it impossible to have a single go/no-go checklist that we can use to define apps.  A criterion for one app may be completely inappropriate for another app.  Instead, I think we need to judge apps based on reaching a particular bar of ‘app-y-ness’.

  • Does the app have a tight focus around a single point or purpose?
  • Is the app self-contained, keeping me within the app to complete my task?
  • Does the app encourage interaction, engagement and completion of tasks?
  • Does the app look beaultiful and have a rich user experience?
  • Does the app have an action oriented interface that uses similar paradigms to native applications, for example dialogs, buttons instead of links and new pages?
  • Is there at least a functional offline experience?
  • Does the app take advantage of the capabilities of the device, like geolocation or device motion?
  • Are traditional websites elements and links are hidden from view?
  • Is the app architected to uses a primarily client side architecture model?

Now, let’s look at TripIt’s web “app” vs. their tablet app:

Web “app” Tablet app
Tight focus Yes Yes
Self-contained Yes Yes
Encourage interaction, engagement & task completion Yes Yes
Beautiful & rich user experience Maybe Yes
Action oriented with native design paradigms No Yes
Offline No Yes
Native capabilities No No
Traditional website elements hidden? No Yes
Client side architecture No Yes

By this criteria, even though their web site is super functional, I can get the things done that I want and has some of the qualities of an app, it clearly could be more app-y.  Could TripIt build the same experience as a web app?  Absolutely!  Heck, it might even be less work because then they could reuse a lot of their design and UI components across the web and tablet versions.

But who really cares?

I do!  With more and more people demanding apps, I think we’re missing a huge opportunity to provide our users with web applications that are better, faster, and more fun to use than their mobile or native counterparts.  People will pay for mobile and native applications, but we have given them very few web apps that are worth their money.  We need to step up and change that, let’s build a more app-y web.

HTML5-Guy

HTML5 Guy + Gelaskin

0
November 16, 2011
by Pete in

By popular request – a few little additions to the HTML5 Guy!

Now, with in SVG!  I also created a skin for my laptop with this guy and had it printed at GelaSkins:

HTML5-Guy

Happy Friday from the HTML5 Guy

2
November 4, 2011
by Pete in


flag_canada3

Canadian Chrome Web Store Incentives

0
October 31, 2011
by Pete in , ,

The last month has been really exciting for the Chrome Web Store. Not only did we launch the new (and very much improved user experience), we also launch internationally. The Chrome Web Store is available in lots more countries, but one in particular is close to my heart – Canada. In fact, I was up in Canada last week for a hack-a-thon and to meet with some great companies to talk about the Chrome Web Store.

With any newly launched product, there are lots of great opportunities for people to jump on board early, and if you’re a Web Developer in Canada, this is certainly one of them. On Thursday, we announced a special program for Canadian Web Developers. We want to see more Canadian Web Developers featured with apps that will resonate with Canadians. That’s why we’re offering a great incentive for submitting your apps! Our panel of experts will review the apps that you submit and for each app that meets the criteria, you will receive a $200 Amazon gift certificate – not to mention exposure to more than 200 million Chrome users around the world.

Chrome Web Store - Shopping Bag

You’ve got until December 31, 2011 at midnight (PST) to get your app submitted to the Chrome Web Store and fill out the submission form. You’ve got just about 2 months to get your app built and submitted.  Be sure to read the complete rules and regulations at here.

 

 

To learn more visit The Chrome Web Store Canadian Web Developer Incentive Program site, including full regulations, and how to submit your app!

If you’re looking for resources to get you started, check out some of these links:

Good luck!
PEte

Chrome Web Store - Shopping Bag

The Anatomy of a Great Chrome Web Store Listing (Updated)

0
September 29, 2011
by Pete in ,

Chrome Web Store - Shopping BagA couple of months ago, I blogged about the anatomy of a great Chrome Web Store listing – and it looks like it’s time to do an update. A couple of weeks ago, we changed the UI on the developer dashboard and started asking for new screen shots, and promotion images. Not only is the new UI a little easier to use and understand, but soon we’ll be launching a new user experience for consumers – which will require new assets from you. I’d strongly recommend updating your assets sooner than later to make sure that when we do roll out the new UI, you’re ready for it, and are looking great.

Since the consumer UI will change in the near future, I’ve listed my suggestions in the order that they appear within the Developer Dashboard and included screenshots from both the Developer Dashboard and the current consumer UI. I’ll update the screenshots when the new UI launches.

Let’s dive in

Your first chance to make a great impression with a new user is often on your application listing page in the Chrome Web Store. People will make a split second decision whether to install your application based on what you put on there, so it’s important to make a great first impression. Let’s take a look at what makes a great Chrome Web Store application listing. This updated guide highlights a couple key components of a great Chrome Web Store listing. I tried not to repeat content from the documentation, but instead tease out the important parts or best practices. Be sure to follow the links for additional resources or details.

A Couple Quick Examples

I think both TweetDeck and Google Maps do a great job of providing a compelling, and interesting listing, so we’ll use those as our primary examples.

Application Name and Short Description

The application manifest file (manifest.json) has a property for a short description of your application. Use this to tell users about what your application does and why they should get excited and care about it. It’s limited to 132 characters, and cannot include any HTML. For example, the description for Angry Birds is simply “Birds! Slingshots! Destruction! Feathers! Fun!” For Gmail, it’s “Fast, searchable email with less spam.”

You must also specify the application name within the manifest file – be sure to specify only the name and not any taglines or things that would be more appropriate for the short description.  In the current UI, the +1 button will also be displayed in this section, another reason to not include tag lines or other stuff in your application name.

One other good tip – try to use ‘simple’ characters in your application name, and don’t get too fancy including special unicode characters.  For example, if your app is named App2, use App2 instead of App2.  Currently search sees those two as different app names, and if you search for App2, you won’t find App2.

Detailed Description

Beyond the concise description set in the manifest file, a detailed description can be provided via the Chrome Web Store Developer Dashboard. This is your space to really excite your potential users about your application and convince them to install or buy it. If you’ve already built a landing page on your web site, you can likely leverage what you’ve already written here.

You should provide a detailed description of your application, including it’s features, quotes from great reviews, information about recent updates, and any other information that might be relevant to potential users. If your application has a freemium or free trial, be sure to tell users the differences between the paid and free experience so they’re not surprised or disappointed by functionality that they might not have access to.

Remember, this description will be searchable, so be sure to use any key words in your description that might help users to find your application if they try searching for it without knowing the name of it.

If your product is compatible with a Google product, make reference to that Google product by using the text “for”, “for use with”, or “compatible with”, and be sure to include the ™ symbol with the Google trademark. Example: “for Google Chrome™”. For other third party products, be sure to check any requirements that they may have when describing your application.

I also recommend including a short description of things that have changed since the last update, including any major bug fixes and such. This helps keep the user informed and tells them that you’re invested in the app and listening to their feedback.

Supplying Icons

When you package and upload your application to the Chrome Web Store, it needs to include at least the manifest file, and an application icon. The icon that you include in the ZIP file is the icon that is used on the new tab page in Chrome after the application has been installed. Your icon should be eye catching and representative of your application. You also need to supply a second icon that is uploaded via the Developer Dashboard. This icon is the one that is shown in the Chrome Web Store – through search, browse and currently on you application listing page.

Personally, I would use the same icon in both places because otherwise it I think it gets confusing for users, they see one icon when they install your application and then can’t find it in their new tab page because you’ve used a different icon!

Remember, the icons are pretty small, so you can’t be too complex or detailed. If your icon is not circular, we recommend you try to keep it within a 96×96 pixels box, with a 16 pixel per side transparent border. For circular icons, you can go up to 112×112 pixels. It’s generally a good idea to avoid words or text because it makes localization difficult and often becomes difficult to read. One exception to this is that if your app name or company name is part of your logo, then it’s probably okay to use.

Here are a couple of my favorite icons

Check out the Supplying Images of the Chrome Web Store docs for more info.

Screenshots & Promotional Images

We’ve done some work to increase the quality and provide you with more space to show off what your app does with the new screenshots and promotional images. The old images were simply too small to be able to really be useful or exciting for consumers. We’ve also done away with the customized header background.

Screenshots can be one of the most compelling factors in a user’s decision to install or buy an application, so it’s important to provide at least four or five screen shots that give a user a sense for how your application works, some of the features it offers and an idea of the different elements. You should always start with a beautiful screen shot that provides a detailed overview of the application experience first, and then drill into the additional elements. Make sure the screenshots show your application in use, so that users can see how the application works, and how they might use it. If you’re displaying any kind of data from the user, be sure to use safe or sample data in the screenshots instead of blurring things out or accidentally sharing personally identifiable information.

Screen shots should be full bleed images with square corners that are 1280×800 pixels. Since not every user has a 30” display, you can count on these images being scaled smaller to fit within the Chrome Web Store UI, and the user’s screen. With such large images, it’s important to show your app both at a high level, but also include images of your app in detail. Be sure to not over-compress or scale images so that you can’t see any of the detail. Further details about supplying screenshots are available in the Chrome Web Store documentation under Supplying Images. You can also provide locale specific screenshots if your app supports multiple locales.

YouTube Videos & Google Docs Presentations

A picture may be worth 1000 words, but video is worth many more. The Chrome Web Store allows you to add a YouTube video to the screen shot collection, allowing you to provide a richer way to show people your application, and convince them to install or buy it. Keep in mind that in many cases, people haven’t yet made the decision to install or buy your application, and likely won’t be willing to invest a lot of time, so optimize for a short, high quality overview that highlights the main features and will encourage people to try it.

Promotional Images

We’re always on the lookout for great web applications to feature throughout the Chrome Web Store. When we find them we use the promotional images, but if you don’t have promotional images, we can’t promote you! Also in the new UI, the small and large tiles will be featured more prominently across the site for all applications. Only the small marquee is required, but I’d strongly recommend providing all three.

All three promotional images should use the same branding and identity as the rest of the images that you supplied, and have a dark or medium background with light text and avoid any white or very light elements along the edges of the images. The small tile should be 440×280 pixels, the large tile 920×680 pixels, and a marquee tile that’s 1400×560 pixels. All of the tiles should have square corners and with no padding. It’s also a good idea to Additional details on promotional images can be found in the Chrome Web Store documentation.

Verified Domain

Verifying your domain via the Google Webmaster Tools is like adding a certificate of authenticity to something that you’re going to buy in the store. A verified application tells potential users they’re about the install a genuine, user experience from your site – and that they’re not getting a cheap, or potentially unsafe knock-off. Also, be sure the domain name that you’ve verified and are using makes sense, and isn’t a development or staging domain; which may scare away your users.

Additional Links

You can also provide your potential customers with additional resources that are on your site. Providing the URLs for description and support pages can improve your users’ experience and help make this item’s ratings and comments more meaningful. The “Link to website for your item” should point to the landing page of your website. You can also provide a link to the help or support section of your site via the “Link to support & FAQ for your item”

Categories

Putting your application into the most appropriate category will make it easy for users to find your application when they browse the store. You can choose up to two categories that are most appropriate for your application. You can find a list of the different categories as well as a description and examples for each in the Chrome Web Store developer documentation.

Even though you can choose up to two categories, and your application will be listed under both, it will only show one category on the navigation breadcrumb when you view it in the Chrome Web Store.

Other Helpful Components

Version Number & Last Updated

One of the great features of web applications is the ease at which we can add new features, fix bugs and enhance the overall user experience. It’s strongly recommended that you increment the version number in your manifest file and re-upload it to the Chrome Web Store any time you provide significant updates or bug fixes to your application. This ensures that the version number and last updated field on your application listing stay up to date, and users know that you’re application is fresh, and that you’re constantly working to make it better.

Also, when choosing a version number, it’s a good idea to start at 1.0, or as close to it as you can so that people know your application is ready for real world use and that you’re not something that’s still in beta or may not work as expected. If you’re not ready to be out of beta yet, that’s okay, but provide a realistic version number that indicates how close you are to being out of beta. And be sure to stay away from version numbers like 0.0.0.1.

Mature Content

If your application isn’t very child friendly, then marking it as Mature Content is probably a good idea. For example, some first person shooter games may not be appropriate for children. When considering whether your application should be marked as mature or not, evaluate your entire application, including any user generated content that may appear. There’s more info about ratings in the Ratings Guidelines section.

Analytics

While providing your Google analytics token won’t directly make the user experience any better, it will provide you with lots of data that you can use to understand who’s using your app, how many people are installing it and more detailed information than is available through the number of users or the number of weekly installs.

Using the Chrome Web Store Badge

On your application home page, you can let others know that your app is available in the Chrome Web Store by using the “Available in the Chrome Web Store” badge on your site and even going so far as to do browser sniffing to provide Chrome users with additional messaging.

Conclusion

There’s a lot you can do to make sure that you make a great first impression with your Chrome Web Store listing that encourages users to buy or install your application. Good luck, and let’s go build some cool web apps!  And of course, I’d be remiss if I didn’t include a link to @sethladd‘s blog post about 13 great tips!

HTML5_Logo_512_thumb.png

HTML5 Slide Decks & Presentation Timer

2
September 21, 2011
by Pete in ,

Countdown Timer For PresentationsA couple of folks at GDD and other events have asked what I use to create my slide decks, and I figured I’d share and add a link to a little plug in that I wrote for the slide decks.

My slide decks are based on HTML5Slides, the Google HTML5 Slide Template – it’s the same one that was used at Google IO, generally by the Chrome DevRel team and lots of other folks.  It’s freely available for anyone to use, modify, fork, whatever you want, and creating the content for it is pretty easy.  One of my favorite things about using the HTML5Slides as my presentation software is that I can embed my demos straight into the slides and when you want to understand what’s going on, you can simply view source!

There are a couple of things that I think this framework is missing though.  There isn’t a way to do a presenter view and an audience view (not always necessary, but sometimes helpful to make sure you don’t forget any of the important points you want to hit).  There wasn’t an easy way to add fades when doing builds, but most importantly for me, it doesn’t have any kind of timer.   I love to talk, and can easily lose track of time when on stage.

Creating a presentation timer

This weekend, while on the flight from Brazil to Argentina, I build a little timer plug in that would help better keep track of time.  I wanted it to do three things:

  1. Tell me how many minutes until the official start time of my presentation
  2. Tell me how many minutes left until I was supposed to be done
  3. Tell me when I was done, and how many minutes over I was

Inserting a canvas element

Let’s jump right into the code! When the timer starts, it inserts a <canvas> element at the beginning of the <body> element with insertAdjacentHTML. The canvas element is going to draw our clock face and display the number of minutes left.

var insertElement = function() {
  var body = document.getElementsByTagName("body")[0];
  body.insertAdjacentHTML("afterbegin",
    '<canvas id="cClock" width="30" height="30"></canvas>');
}

Make it look pretty, and subtle

Since I wanted things to be very subtle and configurable, I used CSS to set the position to the upper left corner, and set the opacity to 0.25 to it mostly invisible so that I’ll likely be the only one who notices it. I also created a hover pseudo element so that I can hover over the element if I need to. Finally, I added a hidden class so that the element is completely invisible if the presentation ended a long time ago.

#cClock {
  position: fixed;
  top: 0px;
  left: 0px;
  opacity: 0.25;
  z-index: 1000;
}

#cClock:hover { opacity: 1.0; }

#cClock.hidden { display: none; }

Refreshing the clock

When I start the clock, it uses a setTimeout to fire at a specific interval. I decided to use setTimeout instead of setInterval because I wanted to be able to dynamically change the amount of time between refreshes, depending on where in the presentation I was. If I was close to either the start time or end time, I want the clock to update more often, where as in the middle, it can fire every minute.

Drawing the clock
Getting the clock to draw in the way I wanted took a little bit of tinkering.

  var drawClock = function(min, color) {
    var canvas = document.getElementById("cClock");
    var ctx = canvas.getContext('2d');
    ctx.clearRect(0,0,30,30);
    ctx.lineWidth = 3;
    ctx.strokeStyle = color;
    ctx.beginPath();
    ctx.arc(15, 15, 10, toRadians(-90), toRadians((((min-60)/60)*360)-90), true);
    ctx.stroke();
    ctx.fillStyle = color;
    ctx.font="10px sans-serif"
    ctx.textAlign = "center";
    ctx.textBaseline = "middle";
    ctx.fillText(min, 15, 15);
  }

Math is hard, let’s go shopping!*

drawClock(min, color) grabs the <canvas> element, and uses clearRect() to erase everything in the box. I then set the line width and color and start the drawing the circle with beginPath() and arc(). Let’s quickly start at the end, the “true” tells arc to draw the circle counterclockwise. Then, the first three parameters tell the arc to put the center at 15, 15 with a radius of 10px. The next two parameters are the angles to start drawing the circle at in radians. If you remember high school algebra (which I don’t), 0 in radians on a circle would be equivalent of 3pm on a clock, so to figure out where the top is, we need to rotate -90 degrees and then convert to radians with toRadians(-90).

To calculate the second arc position, we need to convert everything to radians again, but we also need to figure out the angle in degrees. Since I wanted the circle to become more complete the closer the time gets to zero, I started by taking the minutes and subtracting 60. Next, I needed to figure out where (in degrees) the minutes would be, to do that, I divided by 60 to get a percentage and multiplied by 360 to get the degrees along the circle.

For example to figure out where the circle should end if the minutes were 15:
toRadians((((15 – 60) / 60) * 360) – 90)
-45 / 60 = -0.75 — The arc line should continue three quarters of the way around
-0.75 * 360 = -270 — The angle in degrees that the arc should draw to
-270 – 90 = -360 — The angle in radians, and remember my comment earlier that 0 (or 360) would be at the 3 o’clock position.

Phew! When coding this up, that was the hardest part for me. I’m not exactly the biggest math fan! :) Next I called .stroke() to draw the circle, and sure enough – the circle appears! Finally, I wanted to show the number of minutes left in the center of the circle. I did that by using fillText(). To get things to fit in the circle perfectly centered, I aligned everything middle and center, and with fillText, set the base point to 15, 15 – the center of the box.

Getting the countdown timer on screen

Finally – to create an instance of the clock in a presentation, I created a JSON config object that contained the start time, and a length and a warning time, and then created an instance of the timer.

<script type="text/javascript" src="js/timer.js"></script>
<script type="text/javascript">
  window.timerConfig = window.timerConfig || {
    settings : {
      date: new Date('Sept 19 2011 16:30'),
      minutes: 45,
      warnAt: 10
    }
  };
  var t = PresentationTimer();
  t.start()
</script>

In action

I’ve iframed the timer into the window below, or you can try it here. It creates a new instance of the timer, and sets the start time to be two minutes from now, with a length of 2 minutes and a warning at 1 minute. I also made a small change to the CSS so that it’s less transparent and you can see it better.

Summary

You can see the entire timer.js file in GitHub, or even grab the whole project.. I really want to integrate this into the HTML5Slides template at some point, because I think it’s pretty useful. Feel free to grab it, use it, fork it, what ever works for you!

*Math is hard, let’s go shopping is one of my favorite Simpsons quotes.

Google Developer Day 2011

Google Developer Days – South America

4
September 20, 2011
by Pete in ,

Google Developer Day 2011My leg of the Google Developer Day tour is almost over, and it’s been AWESOME!  Wow!  Not only have I now visited 6 out of 7 continents (anyone know of any conferences or events in Antartica – it’s the only one left I’ve not been to), but I was able to add Sao Paulo and Buenos Aires to the list of cities that I need to come back and visit while on vacation.  I’ve been thoroughly impressed with all of the developers here who showed me some of the really cool stuff that they’re working on.

I presented two sessions in at each of the Google Developer Days (videos are coming shortly and I’ll link to them as soon as they’re posted), and had a small part in the keynote demoing the Chrome stuff.  Our venue in Buenos Aires, a Catholic University, was pretty neat, though as I joked, the last time I was in a university classroom, I was probably at the back of the room trying to stay awake. When we got to the venue on Sunday night to do our rehearsals and tech checks, they hadn’t put the Google Developer Day decorations up yet, which was a little weird because there was a crucifix on one side, and a large photo of the previous Pope on the other side.  We also hit a little snag because they blocked a couple of the websites that we needed!  Thankfully they were really good and got them unblocked pretty quickly.

I think my favorite on stage oops was during the live speech recognition demo.  Any time you do a speech recognition demo on stage in a big venue, the acoustics work against you – but can sometimes lead to comical results.  In Brazil, I tried to say “Hola Brazil”, which Chrome thought was “Fort Lauderdale”.  I did the same demo in Buenos Aires, and got “Call Argentina”.

I’ve listed the demos and slide decks below, and as soon as the videos go online, I’ll get a post out about those!  The slide decks between the two countries are the same, the only thing that changed was the title slide.

Keynote Demos

Sao Paulo, Brazil

Buenos Aires, Argentina

Thanks for a great trip guys – and if you’re in Buenos Aires and want to grab a beer (or wine) and chat about web apps, I’d love to meet and see what you’re working on!  
JavaScript code on computer screen

HTML5 Hack-A-Thon Coming To A City Near You

1
July 20, 2011
by Pete in , ,

JavaScript code on computer screenWell, hopefully it’ll be near you – if not, let me know in the comments where you are so we can try to get some more of these events set up!

Google is holding a few developer focused hack-a-thons around the US and would like to invite you to attend. At these events, we will be covering some of the latest and greatest features of HTML5, Chrome Web Store and In-App Payments. You will learn about the end to end flow of building a web app, distributing the app and monetizing it using these APIs. You will also have the opportunity to work hands on with the APIs and ask our experts (including me) questions. I’ll be helping out in Chicago and Mountain View.

For more information on the events and to register, please check out the location specific links below:

New York – 8/1 – http://www.eventbrite.com/event/1892631913
Chicago – 8/3 – http://www.eventbrite.com/event/1910102167
Seattle – 8/8 – http://www.eventbrite.com/event/1910138275
Mountain View – 8/11 – http://www.eventbrite.com/event/1910202467


* Image http://www.flickr.com/photos/dmitry-baranovskiy/2378867408/

Pete's RSS Feed
Go to Top