Archive for the ‘APIs’ Category

Mozilla Reinvents Web Video With Popcorn 1.0

Video on the web has always been a bit disappointing. After all, it’s pretty much just like television, only smaller. Unlike the rest of the web, video is just as much a passive experience in your browser as it is anywhere else.

Mozilla would like to change that. The company’s effort to bring a more interactive video experience to the web is known as Popcorn.js and it recently reached 1.0 status. If you’d like to play around with Popcorn, head on over to the Mozilla site and download a copy. Popcorn uses HTML5 video features and at the moment works best in Firefox and Chrome.

At its core, Popcorn is about making HTML5 web video into something more than just another television.

While it’s nice to have a way to embed videos without Flash, HTML5 video is capable of much more than just, well, video. It’s HTML, after all. That means it can tap into things like WebGL, or use JavaScript to augment video in real time — annotating videos with information like location, details about the people and topics in the video, subtitles, Twitter feeds, current weather information, links and much more.

Popcorn is simply a JavaScript library that aims to simplify the process of adding external data culled from around the web to your video. To give an idea of what’s possible with Popcorn, Mozilla is showcasing the movie One Millionth Tower, a documentary film about an apartment building and how residents imagine the future. One Millionth Tower premiered online last weekend at Wired.com. If you haven’t seen it yet, head over to the Underwire blog.

One Millionth Tower uses some tricks beyond Popcorn (like WebGL for some 3-D elements), but most of its coolest effects — like the way the environment in the film changes based on the real-time weather conditions and time of day at the Toronto high-rises where the documentary was filmed — are all courtesy of Popcorn.

If it happens to be snowing in Toronto when you watch the film, it will begin snowing in the virtual world of One Millionth Tower. At other points in the film Popcorn pulls outside information from Flickr, Wikipedia, Google Maps and, of course, Yahoo Weather. Pretty much any web service with an API can be plugged into an HTML5 video in real time with Popcorn.

A more mundane but potentially more widespread use for Popcorn is subtitles. Using Popcorn, a set of subtitles attached to a video could be sent on to an online translation tool and converted to whatever language you wanted on the fly. Popcorn could then pipe the translation back into the video. In other words, subtitle your movie once and anyone will be able to understand it.

So how does Popcorn work? Well, Popcorn.js takes the native HTMLMediaElement properties, methods and events — collectively known as HTML5 video — and normalizes them into an API. The API has a plug-in system so developers can contribute and reuse code for common tasks. In fact, Popcorn already has dozens of plugins for most popular web services like Twitter, various maps, Facebook, Processing.js and, of course, all the services mentioned above in conjunction with One Millionth Tower.

In addition to the Popcorn.js framework, there’s also Popcorn Maker, a web-based graphical user interface for creating Popcorn-based videos. Popcorn Maker is the newest member of the Popcorn family and is not yet a 1.0 release. Its goal is to offer the familiar timeline controls you’d expect in video editing software, but at the moment it’s an alpha release and can be a little buggy. Popcorn Maker is powered by another bit of JavaScript, dubbed butter.js, which could be used to add Popcorn editing features to any desktop video editing software, though as of this writing we aren’t away of any popular video editing apps that use it.

To get started making Popcorn movies head on over to MozillaPopcorn.org, grab the source code, read the documentation, check out the plug-ins and try Popcorn Maker. Also note that, if you prefer, Popcorn can be checked out through GitHub.

Homepage photo: jennie-o/Flickr

See Also:

File Under: APIs, Web Services

Automate and Sync Your Web With ‘If This, Then That’

A few of the many tasks Ifttt can automate for you

The awkwardly named, but fantastically useful, Ifttt.com (short for “if this then that”), has come out of private beta and is now open to everyone. Ifttt is a service that hooks together other web services so that you can automate common tasks like sharing links, saving Instagram photos or responding to Twitter posts. Think of Ifttt as Yahoo Pipes, but simplified, and better looking.

If you’d like to try out the site, head on over to ifttt.com. For some background on how the site came to be, check out the Ifttt blog.

At its most basic level Ifttt is what its founders call “digital duct tape… allowing you to connect any two services together.” On a perfect web Ifttt wouldn’t be necessary, every service would talk to every other service and everything would just work. Obviously that web doesn’t exist, so there’s Ifttt.

The best way to understand how Ifttt works is by example. Let’s say you want to share links with other people on the web. You might store links in Delicious or Pinboard for yourself and then post them to services like Twitter or Facebook for your friends to see. That’s all well and good, but what if you could automate the process? That’s where Ifttt comes in.

The usefulness is in the name — if this, then that. Sticking with the link example, we might create a task that works like this: IF a new link is posted to Delicious, THEN grab the link and post it to Twitter and Facebook.

The basic workflow is to choose a service from the list (which include popular web services like Instagram, Tumblr and WordPress, or more general tasks like phone calls, SMS or time-based actions). Once you have the “this,” the next step is choosing a trigger. Triggers vary according to the “this” you’ve selected. For example the Delicious triggers include things like “any new public bookmark” or “new bookmark tagged,” while the time option has triggers like “Every day at” or “Every year on.” Once you have your trigger set, you add the “that” portion of Ifttt’s name, which consists of a list of services like the “this” portion.

Maybe links aren’t a particularly interesting use case these days, here’s a better one for the kids: every time you post an image to your Instagram account, have Ifttt.com grab a copy and sync it over to your dropbox folder for instant backups. Or send starred items in Google Reader to Read it Later or Instapaper. Or send yourself an email every time an Orange Bass Cabinet pops up on Craigslist. Or create daily reminders with the time triggers. Or trigger a fake phone call to escape awkward situations.

Because the possibilities of Ifttt can be overwhelming, along with the public launch, Ifttt introduced a new feature called recipes, which are simply a way of sharing your tasks (not the data in the tasks, just the tasks). The site has only been public for a few days and already there are hundreds of recipes.

If you’d like to automate your web, head on over to Ifttt.com and sign up for a free account.

Speed Up Your WordPress Site With Google’s New Page Speed API

Google’s Page Speed testing tool, which recently went from a browser add-on to a web-based tool, now sports a new API. The Page Speed Online API allows outside applications to send URLs to Page Speed and get back a list of things the site developer can do to speed up the page in question.

If you’d like to try it, head over to the new documentation page and request an API key. Sample apps include using the Page Speed Online API to display suggestions for speeding up sites or even combining the API with the Google Charts API to show a visual breakdown of the page’s resources.

For a more practical example of how the Page Speed Online API can help out your site, check out the latest version of the W3 Total Cache plugin for WordPress. If you’re not already using W3 Total Cache in your WordPress installation, we highly recommend you install it, especially now that the plugin taps into the Page Speed API. W3 Total Cache now sends your pages to the Page Speed Online API and then offers Page Speed suggestions, right in the WordPress dashboard.

See Also:

File Under: APIs, Programming, Web Services

Where 2.0: Bing Maps Partners With FourSquare, Fwix Builds Open Places Database

Map nerds unite, this year’s Where 2.0 conference is in full swing and there are already several notable announcements, including a partnership between FourSquare and Bing Maps to create Foursquare Everywhere, and a much improved API from local news site Fwix.

The Bing Foursquare partnership pulls Foursquare data into Bing Maps to visualize check-ins, tips, badges and mayorships. Bing announced the new Foursquare feature earlier this year, but it was not available until today. Even now the rollout of the new features appears to be staggered so if you don’t see it yet, be patient.

The more interesting announcement for developers is the revamped Fwix API which now allows third-party developers to pull in names, locations and web content about places. There’s also an ad layer you can include in your app, pulling in ads from Fwix’s partners (like AT&T and Comcast).

Part of Fwix’s goal is to create an open database of places. To do that the company has partnered with Factual, a large-scale geodata aggregator founded by Gil Elbaz, the man behind Google’s AdSense technology. Factual provides the geodata backend and Fwix builds on that with its aggregated info about each place.

Fwix’s new Places API allows developers to request business listings, cities, and neighborhoods. Combine that with Fwix’s Content API and developers can request reviews, news, check-ins, photos, video, and tweets about any particular place ID in Fwix’s database.

For more information on the Fwix API, head on over to the site and read through the documentation. The Fwix API is free, just sign up for a developer key to get started.

See Also:

Thousand of APIs Paint a Bright Future for the Web

ProgrammableWeb's stat for API protocols and data formats

Once a novel idea that seemed limited to Flickr, the web-based API is now everywhere you turn — Twitter, Foursquare, Google Maps and thousands of other sites offer up their data in the form of an API.

APIs mean that third-party developers can build their own tools and mashups, which in turn helps to fuel the popularity of the web service. It’s hard to imagine where sites like Flickr and Twitter would be today without APIs.

In fact, these days some web services don’t even bother launching websites to go with their APIs — the API is the service. The SimpleGeo API, for example, doesn’t really have a corresponding website, it’s just an API that can be used anywhere, including inside mobile apps.

And APIs aren’t just something for external developers anymore. Increasingly web services are building their own sites and tools around their APIs — after all, why bother with an API if you aren’t going to use it yourself? Twitter is a good example of the “eat your own dog food” approach to APIs; Twitter’s website and its mobile clients are both developed off the same Twitter API that outside developers can tap into.

Former Webmonkey writer Adam DuVander, now Executive Editor at ProgrammableWeb, recently announced that ProgrammableWeb, an API tracking site, now lists some 3000 web-based APIs. To go along with that milestone DuVander breaks down some of the trends in today’s APIs.

It will come as no surprise to those actively developing or using APIs, but the overwhelming trend in APIs is moving toward serving JSON data over a REST interface. As DuVander notes in his post, how many “REST APIs” are truly RESTful is debatable, but certainly SOAP is on its way out and HTTP coupled with OAuth is the future.

When it comes to the data APIs serve up, XML is still the most used format, but JSON is hot on its heels and growing much faster. Even though there are still more XML APIs, the more recent the API, the more likely it’s serving JSON. In many cases — like Twitter’s streaming API and Foursquare’s updated API — companies are rapidly moving from XML to JSON.

The biggest thing that sticks out from ProgrammableWeb’s API trends is that the API, once a sort of “hey, that’s cool” option for progressive websites, is now a first class citizen of the web. Perhaps eventually something better than the REST/OAuth/JSON combo will come along, but the the API and the idea behind it — making data available to the entire web — isn’t going anywhere.

See Also: