Rob Scoble's Keynote from the Razorfish Technology Summit

Rob Scoble was the Keynote at the Fourth annual Razorfish Technology Summit. He gave us an outstanding overview of what’s going on with Cloud Computing and how it’s impacting the digital work we do with our clients. He also challenged us to think of new ways we can leverage cloud services and cloud infrastructure for the daily work we do with clients.Thanks for a great keynote Rob. Here’s his Prezi Presentation.

Copy of Scobles’s Razorfish Technology Summit Keynote on Prezi

How do we define cloud computing?

It’s comes up again. Folks are asking us to define cloud computing and every time we do, we refine it a little more. At times it’s seemed like Cloud Computing became the new web 2.0 as a blanket term for everything:). I actually think we define it similarly to the Wikipedia definition. For us it breaks down into two categories: cloud services and cloud infrastructure.

Cloud services are defined as technologies that provide a virtual service either through and Open API or through a user interface. Examples range from the classic Salesforce.com to cloud email like Gmail or Twitter and the Twitter Open API, and Facebook Connect. There are lots others, and it’s growing at a frantic pace. Open API’s like Facebook Connect and the Twitter API are incredibly powerful for driving traffic and getting your product, brand, and service out there. In the past we would build a social network from scratch for a web site, that would mean custom application development and maintenance, now we use Javascript and REST to interface with Facebook Connect and we are up and running in a fraction of the time it used to take in the past.

Cloud infrastructure is defined as the virtual and physical infrastructure powering web and digital applications. Cloud infrastructure was strongly enabled through technologies like VMWare that made it possible to make one physical server into 10 or more virtual servers. This coupled with low cast storage created an elastic scalable platform to enable us to do things that weren’t feasible using the old cost models. These services are metered and you only pay as you go, which is a drastic departure from the buy a server, manage and drive it all the time whether you use it or not. While it used to take weeks to get a server up and ready now takes minutes and all you need is a credit card. Companies paving the way include Amazon, Microsoft, and Google, with traditional hosting companies like Rackspace, Savvis, Terremark and others also making these infrastructure services available.

We believe the cloud and it’s ability to scale at a lower cost point will enable more innovation like never before.

Launch of the Razorfish 5:Five Technologies That Will Change Your Business

We launched the Razorfish 5 report today. We put a lot into the report and are excited to share it more broadly. In this report, we discuss the 5 technologies that are transforming businesses, including multi-touch and cloud computing. The findings are based on Razorfish’s experience designing and integrating complex technologies for clients around the world.The report explores the recent advances and upcoming developments of five significant technologies. Key findings include:

  • Cloud services and open APIs will become essential for social brands, making it easier for businesses to tap into the consumer’s social graph.

  • Reliance on the cloud’s infrastructure will continue to grow as the need for real-time scalability becomes increasingly critical for survival.

  • Multi-touch technology, which has already become mainstream in consumer devices, will infiltrate retail and business environments so extensively that it will become expected.

  • Improved hardware and connectivity will help mobile make the final transition into cloud-based data that allows the user to learn the world around her in real time.

  • Agile and iterative Web development will open new doors for innovation by allowing developers to innovate and adjust products based on immediate customer feedback.

Thanks to everyone who contributed to the report:

Writers/Contributors Shiv Singh Tobias Klauder John Cunningham Steve Dawson Luke Hamilton Paul Gelb Mike Scafidi John Ewen

Marketing & PR David Deal Lauren Nguyen Katie Lamkin Crystal Higgins-Peterson Heather Gately Jennifer Li

Detecting CSS transitions support using JavaScript

Progressive enhancement is one of the cornerstones of good web design: You build a solid foundation that supports a broad range of different browsers, and then add features either as you detect support for them or in a way that doesn’t interfere with less capable browsers.

One of the awesome new features that’s in recent versions of Safari, Safari Mobile (iPhone browser), Chrome, the Android browser, and in Palm’s webOS is CSS transitions. Transitions work by smoothly interpolating between two states of a CSS property over time. For example, using the simple style rules below, you could have a link gradually change from yellow to red when the user moves the mouse over it:

a {color: yellow; -webkit-transition: color 1s linear;}
a:hover {color: red;}

In a more complicated example, you could use CSS transitions to slide an element off-screen when a replacement element is introduced, like the way that the “pages” slide off-screen when you click through an iPhone’s contacts.

This introduces a problem: What if you’re using JavaScript to add the new element, and you want to remove the old element after it’s off screen, and you need to support multiple browsers?

You need to be able to detect that the browser supports CSS transitions so that you know not to remove the element until it’s done animating, and so that you know that it’s OK to remove the element right away for browsers that don’t support CSS transitions. Here’s how you can detect support using JavaScript:

var cssTransitionsSupported = false;
(function() {
    var div = document.createElement('div');
    div.innerHTML = '<div style="-webkit-transition:color 1s linear;-moz-transition:color 1s linear;"></div>';
    cssTransitionsSupported = (div.firstChild.style.webkitTransition !== undefined) || (div.firstChild.style.MozTransition !== undefined);
    delete div;
})();

The variable cssTransitionsSupported will be set to true when transitions are supported, or to false when transitions are not supported.

You can then either use the webkitTransitionEnd (or mozTransitionEnd) events to detect when the transition is finished, or else immediately perform the action when transitions aren’t supported.