Release 5.04 – Commerce Panels

Released Tuesday, April 2nd, 2013. This release sees the introduction of the Ceros Commerce SDK – the shopping feature.

Admin Commerce Settings

Within the Admin Section, there is now a ‘Commerce’ tab. This is used to adjust the Commerce settings of the brand new Ceros SDK for an app. In here users can:

  • Set the ‘Shopping Cart URL’ for an app
  • Set the ‘Product Panel URL’ for an app
  • Set the width/height of the Shopping Cart & Product Panel, when changing this refresh the preview browserto see the change, (sorry this feature isn’t real-time, yet).

Studio Cart Action

Designers can apply an ‘Open Shopping Cart’ action to an object in the Studio – (Inspector Panel / Actions / Open Shopping Cart), which will navigate users to the configured Shopping Cart url, which was set up in the  Admin Section.

Recording Of Interactions With Commerce Panels

The following metrics are currently being recorded, although not currently reported.

  • Shopping Cart – player.shopping_cart.click
  • Product Panel – player.product.click

Product Panel Size

Product Panel sizes in the native app comply to their configured fixed sizes on tablets and desktop and use responsive design on smartphones. The main features of the Product Panel are listed below:

  • Default size is set at 620 wide and 372 high, though configurable in the admin tool.
  • The size remains fixed regardless of orientation, with the exception of mobile phones, where this is ignored and the Product Panel goes full screen
  • Tap outside the panel to close on native app.

Product Panel Parameters

The following data is now passed and preserved into the Product Panel: App, Issue and Account slugs and Device type.

  1. Query String Passthrough – The Ceros Player will automatically pass all query string arguments supplied on the URL to the Product Panel and Shopping Cart URLs when loading on web and mobile browsers. This functionality can be used to adjust the panel content accordingly. It’s important to note this is also effective when embedding the Ceros Player in another website.
  2. Additional Arguments – The Ceros Player will provide the following parameters as query string arguments to the Product Panel and Shopping Cart URLs when loaded on web browsers, mobile browsers, and native iOS applications.
    • ceros_device_pixel_ratio – The device’s pixel ratio as an integer
    • ceros_account_slug – The account URI
    • ceros_app_slug – The application URI
    • ceros_issue_slug – The issue URI
    • ceros_device_type – The type of device, can be: desktop, tablet, smartphone, other
    • ceros_player_type – The player type, can be: html5, native
    • ceros_page_num – The current page number

Product Panel Templates

Created HTML responsive design templates in order to more quickly implement Product Panel commerce integrations.

New iOS Previewer App in the App Store

New iOS Previewer to App Store, with Commerce enabled, submitted into the App Store.

Resolved Issues:

  • Users now see new features of a release automatically, without having to empty Cache.
  • A fix was implemented for a bug which would disallow actions on items which had objects containing animations applied on top, if a page was navigated into via a Go To Page action.
  • Fixed a bug where uploading a poster frame for a video would often not complete.
  • Video play button will no longer show up on top of all other layers, instead of just on top of the video itself.
  • A fix was implemented for a bug in which keylines (light borders) would appear around objects when the default browser zoom was changed in Firefox.
  • Objects in hidden layers no longer steal the focus if they are placed above a visible layer. Instead focus is given to the topmost visible layer.