← Back

OnScreen

Project at Vibes
Screenshot of the OnScreen slide deck editor

OnScreen let you create, manage and display dynamic slide decks all within a browser. Decks could display content sent into the OnScreen platform via text message or over Twitter, or display the results of a voting campaign. It was mainly used in venues during sporting and music events as well as during some cable TV broadcasts.

When I joined Vibes, OnScreen was an existing product that was cumbersome to create content for and required specific hardware to run on-site. I played a key role in the design and creation of the web-based version which enabled us and our customers to more easily customize the decks and to run them from run-of-the-mill laptops.

Accomplishments

  • Led the visual and UX design of all aspects of the OnScreen platform
  • Created a suite of configurable components for use in deck creation
  • Introduced the concept of dynamic CSS properties to make decks more visually engaging
  • Made many performance improvements to the browser-based OnScreen deck player to ensure maximum quality even at larger screen sizes
  • Created multiple custom OnScreen decks used by Vibes' customers

My Role

  • UX, Visual & Product Design
  • Front-end coding in HTML, CSS & JS

Sample Vote Deck

Here's the deck seen in the editor above in action. It was used during a fan vote at a football game.

Additional Screens

Remote Controller

The Remote Controller could be invoked on a separate computer than the one that was used to display a deck. Usually this would mean a laptop somewhere in a control room at a large venue. This allowed the operator to see if a feed was live, change which slide was being displayed and adjust the sizing and alignment of the feed, which often needed a lot of tweaking.

Screenshot of the OnScreen platform's Remote Controller page.

Campaign Setup

This was the basic setup of every OnScreen campaign and allowed you to set up the core components of the system like where your user data was coming from and your vote options.

Screenshot of the OnScreen platform's campaign setup page.
← Back