Authentic: a Connected Media Experience Player

  • Article

For the past year I have been working with the record labels (Sony Music, Warner Music Group, Universal Music Group) on building a new way of creating digital connected albums, called Connected Media Experience, or CME.    It is based on a zip package with an XML manifest and HTML, JavaScript, CSS, and media content within it.  Throughout the process of developing the specification I have served as Microsoft’s voice on the technical working group and steering committee and helped drive the specification towards completion of a version 1.0 document – which you can download for free here.  As you look at the specification, you will notice that it is based on industry standards like zip archives, HTML5, CSS, JavaScript, WOFF Fonts, h.264 video, MP3 audio, JSON, RSS, ATOM, JPEG, PNG, and GIF – nothing proprietary or device-specific.

As I was working on the technical working committee, I found it necessary to start prototyping a CME player and experimenting with building packages.  Building technology while writing the spec helped us write a more complete and usable specification – and helped us find inconsistencies and problem areas early on – when they were easy to fix.  The prototype evolved and I finally released it yesterday as a free Windows 8 App, Authentic.

Screen shot 2

The first version of this app plays back the CME Packages and shows packages in your My Music and SkyDrive as well as an Azure service.  I am working on enabling authoring tools in the app to make it possible to create CME packages as well as Windows 8 apps that wrap those packages in future versions – so CME Packages could be sold as apps in the Windows Store.

Though the CME format was conceived of for music experiences, there is really nothing in it that precludes it from being used for any other type of publishing.

Technical Details

  • The App is built in HTML, CSS, and JavaScript with some parts built in C# and exposed as Windows Runtime Components. 
  • The package is a Zip archive with a .CME extension – with an XML manifest, HTML, CSS, JavaScript, MP3, and h.264 video – and WOFF Fonts
  • Download the spec here https://connectedmediaexperience.org.
  • This works by unpacking the Zip archive into local storage and then setting up an iframe which points to a https://localhost:xxxx service.  I setup a StreamSocketListener in the app to get all HTTP get traffic to that port and then just serve up the files that are requested.
  • When .html files are requested, I inject additional CSS and JS to make it feel like a native app on Windows 8.

The first CME Package available for testing and demonstrations is based on content from John Common which includes video, images, music, liner notes, and biographical information.  It uses jQuery and Knockout JavaScript libraries for UI and data templating capabilities.  Download it here.  If you want to see the simplest package possible, download this.

How You Can Participate

  • Create CME Packages using the HTML skills that you already have learned for building websites.
  • Build players for other platforms like Windows Phone, Android, and iOS.
  • Build authoring tools and workflows to ease the creation of CME packages.
  • Join the Connected Media Experience consortium to join the discussion and drive the evolution of this exciting format.
  • 5/31/2013 – MSS: Added a link to a simple .CME package.