Odopod – Four Internet of Things trends.

Odopod has several clients involved in the Internet of Things space and we’ve worked with them in a variety of ways including brand and marketing work, product and service development and connected object prototyping.

We recently lead a workshop with one of these clients, exploring ways that their household products could benefit from being connected to the Internet. Several of their products are already connected to each other and the Internet, we helped them uncover new opportunities to push these products beyond pure utility and to find ways to do and say something new.

To get things started we reviewed four themes that come up most often in Odopod’s work around the Internet of Things.

via Odopod – Four Internet of Things trends.

New post over on the Odopod Blog

Connected Personal Objects: Getting Intimate with the Internet of Things

Last week, Guthrie Dolin and I presented at the Planning-ness 2012 conference. The conference was great, and I love it’s theme, “Get Excited and Make Things.”

The standard format for a session is present on a topic and then run a workshop in which conference participants make something to present back to the group.

In our session we provide an overview of the Internet of Things before going into detail about the potential of connected objects to encourage specific behaviors. We break down the components of an IoT ecosystem and discuss how they can be used to collect data and drive insights and change.

Following the presentation, the assignment was to use the framework and design a physical product and service around a personal object or situation. We provided a few catalysts and blank worksheets to help get people going. The results were great and we’ve posted each group’s worksheets on slideshare as well.

All-in-all, a great expreience and a ton of fun. Thanks to everyone who turned out to learn about the Internet of Things.

Odopod – A Multi-Device Web Strategy

To address this shift away from desktop dominance, a contemporary web strategy must:

  1. provide universal access for each piece of content
  2. optimize layouts for a variety of screen sizes
  3. support touch gestures in addition to mouse and keyboard interactions
  4. deliver optimized content for devices with limited resources
  5. fully optimize key experiences for the specific contexts of use

via Odopod – A Multi-Device Web Strategy.

New post by me over on the Odopod blog.

Mobile Strategies: Untangling Device Contexts and Use Context

Most conversations about mobile strategies include the following two perspectives: limited resources of devices require new technical approaches, and mobile use cases are different and demand unique content and application features.

As we’ve settled into our new multi-device lifestyles, a new perspective has entered into these conversations: finding different content at the same place on different devices is a problem and flies in the face of web accessibility and common sense.

via Odopod – Mobile Strategies: Untangling Device Contexts and Use Context.

A post I wrote on the Odopod blog.

Think Quarterly nails multi-screen content delivery

Google’s new online magazine, Think Quarterly has done a really nice job delivering a reading experience tailored to personal preferences and readable on a variety of screens.

Each story is accessible in three layouts: faux print magazine, large screen web and small screen web. I personally am not a fan of the magazine approach. For me, it comes across as a gimmick and while I like what they are doing with information visualization and layout, I wish they would have just invested that time into their web page layouts and graphics. Luckily, aside from the opening image of florescent neurons and the sudoku puzzel, all content is available in the other layouts.

Those other layouts are well done and are a good example of the One Web concept at play — each story and URL is rendered in a layout optimized for the device you are using, regardless of how you might find the URL. Technically speaking, the servers are redirecting between different URLs based on browser agents. Google is notoriously obsessed with speed and efficiency so it makes sense that they would accept the risks and additional upkeep that come with browser detection in exchange for the leanest possible files.

Following are some galleries of screen shots taken on my laptop, iPad and iPhone. In each I show the table of contents and a story page from the site. 

Building IWC.com

IWC.com and the publishing system powering it are a new cornerstone for IWC’s digital strategy. Given the goal that this system remain relevant for a minimum of 10 years (and what can happen on the internet in 10 years) technology choices were particularly important.

How do you future-proof a development like this?

For us, the logical place to start is with technologies that are familiar, flexible and open.

The standards-based front end delivers a variety of beautiful content to the widest range of site visitors. The content itself is managed by IWC’s internal team, using a sophisticated and easy to use CMS built with the tremendously flexible Django framework.

via Odopod – Building IWC.com.

Web applications evolved

Google’s new Web Store offers themes, extensions and apps for Google’s web browser, Chrome.

Themes and extensions are not new to Chrome; the store simply brings them together with apps to provide improved discoverability.

Outwardly, the applications might not seem all that different, but for those using the Chrome browser, Google has added a layer of functionality that app developers can take advantage of.

A different sort of web app.

Unlike standard web applications, apps in the web store are installed rather than simply linked to. This is more than just a semantic difference. Apps installed from the web store appear on the browser’s ‘New Tab’ page, have special security permissions and can be monetized.

Launching apps.

Once installed, an app appears at the top of each new tab opened in Chrome.

Web applications evolved 2
New tab screen with installed applications 

Functionality here is pretty minimal (you can’t yet reorder your applications), but it makes these applications more visible and easier to return to than others.

Special permissions.

App creators can seek special permission for their applications. These permissions appear (a bit too discreetly) on the applications details page.

Web applications evolved
Information panel for an application that will ave access to your location.

Chrome allows applications registering for particular features to make API calls without prompting the users for permission. For example, when a web application normally tries to access the user’s location, the browser will first prompt the user and ask for permission. For an application that has registered for the right to access your location, Chrome will allow it make those calls without any additional permission. Applications can register for access to geolocation, notifications and unlimited storage space.

People pay for Apps, right?

Certainly the most compelling feature of the store’s installation model is the integration with Google Checkout allowing developers to charge for their applications through a centralized payment channel.

Apps in the web store can be sold for a one-time price or through a subscription. Developers can also opt to charge for extended functionality or content within their applications with in-app purchases. Google even provides a try before buying option for developers to easily allow free use of their application for a limited period of time.

To limit application to paying customers, Google provides an API that verifies that a visitor is authorized to access your content.

Two types of apps.

Apps is that they come in two flavors: hosted and packaged.

Hosted applications are web apps hosted on a web server. They include metadata that provides the information necessary for the store to list the App and for Chrome to manage it.

Hosted applications have access to all the features I mention above, but packaged applications are more interesting for a few more reasons.

Files for packaged applications are bundled into a compressed file that is downloaded by Chrome when the application is installed. This greatly simplifies the process of providing an application that will work when the user is not online. Furthermore, developers can upload the package to the web store to host, eliminating the need to manage their own servers (unless they are directly providing dynamic data for the app).

Packaged Apps also have access to Chrome’s extension APIs. These APIs allows developers to add UI elements to Chrome’s UI. Packaged Apps are actually hybrids between web applications (pages with in the browsers window) and conventional extensions (UI within the browser’s chrome)

For more information about the store, see Google’s Documentation.

Treesaver Public Beta

I first heard about Treesaver on The Big Web Show #18. It is a HTML, CSS, JavaScript framework that automatically transforms content to fit any screen size. It is designed to display content as individual pages like most eReaders (e.g. Kindle, iBooks, etc). 

The team behind the library includes Roger Black who has apparently “designed more magazines than you’ll ever read.” Roger also worked on the Times Reader and the influence that project had on Treesaver is clear.  

The platform itself will be open sourced and available for anyone to use. The makers of Treesaver will be using it to publish Nomad Editions — their own online magazines — as well as being available to design publications for others. 

Public Beta

A few days ago, Treesaver launched a public beta entitled Looting the Seas.

The video on the Nomads Editions home page shows some more inspired design ideas than their public beta, but being able to interact with the beta is very cool.

All in all, I like the paginated reader model and treesaver does a nice job adjusting to different screen sizes and resolutions. Animations on devices is choppy, and I wish that the contents tab was retained within the menu at smaller screen sizes.

Below are some screen grabs from three different screens.

The Flash platform evolves quickly

One of the distniguishing characteristics between Flash and Web Standards is the rate at which Adobe advances the Flash Platform. Every 18 months or so a new version of the Player and authoring tools is released with additional features, performance enhancements and general improvements. This pace can be maddening (and expensive) for developers to keep up with, but it also really drives innovation.

In the grand tradition of Max, Adobe launched, announced, or otherwise went public with a flood of new things for the industry to wrap its head around. Here is a cheat sheet to help keep some of the Flash related advancements straight.

Adobe Air

Adobe Air 2.5 is now publically available (previously available in public prerelease). Air is Adobe’s runtime used to build applications using Flash, HTML and PDF content. These applications are installed and managed on computers and devices in the same way that native apps are.

This version of Air brings wider support for devices including: Android (v2.2+), BlackBerry Tablet OS, and Samsung’s SmartTV line.

Improvements to Air include: geolocation and accelerometer support, access to camera and video applications, multi-touch and gesture support, and a 50% faster JavaScript engine. Also, the new StageWebView provides the ability to display native browser controls within the application for the integration of HTML and .SWF content and SQLite support.

When used with the Blackberry Tablet OS SDK, Air 2.5 can build Playbook apps from ActionScript only SWF files.

Adobe is working to roll out support for Windows Phone 7 as well.

There is no clear word yet about Air being available for Google TV, which will definitely support the Flash Player within its browser; but the educated hunch is that when Google opens that platform for third party apps, Air 2.5 will be supported as it is on Android mobile devices.

The iPhone packager is lagging behind AIR due to time off during the blockade by Apple. Adobe is now working to update APIs, but currently iOS is still on Air 2.0. It lacks access to camera, microphone and StageWebView.

With regards to Air on TV’s. While Samsung will have blueray players and TVs running Air 2.5 next year, Flash Lite for Digital Home is likely to be the most prevalent version of Flash on TVs for a while. Not only are current Flash enabled TVs shipping with Flash Lite, but I expect that given the hardware requirements for Air 2.5, several TVs will continue to ship with Flash Lite for the foreseeable future.

Flash Builder

A new version of Flash Builder, codename “Burrito,” is available in public prerelease. Key improvements include:

  • Developing mobile and multi-screen applications
  • Accelerated coding for Flex and ActionScript projects
  • Improved designer/developer workflow (in conjunction with the latest prerelease of Catalyst)
  • Updated platform support and improved performance


The next version of Flex, codename “Hero,” is also available in public prerelease. It includes support for Android applications that was teased at last years Max. It includes components tuned for mobile and built-in navigation models (pushing pages left to right with and consistent back stepping) as well as support for saving and reloading states. The goal is to simplify the creation of behaviors common in most mobile (phone-sized) applications.

Flex can’t be used on the BlackBerry Tablet yet, but I read that it the BlackBerry workflow will eventually be supported.

Additionally, Hero has not yet been optimized for use in the iOS environment.


Adobe is working on a new API for hardware accelerated 3D rendering. The demo game (starting at 2:30) in this video is really, really impressive.

Flash -> Web Standards export

This early “sneak” (no promises that it will ever make it into a product) of a tool that is able to convert an FLA (animation only) to Web Standards technologies. If spits out a bunch of PNGs, SVG and other elements. While the practical uses may be limited, it is a great indication that Adobe is considering a wide range of possibilities for merging Flash and HTML5.