Off Canvas UI/UX Example [VIDEO]

Here is an app I wrote as part of a mobile strategy for ShiftAlertz.com.  This began as an experiment with Titanium Mobile to create a unique user experience based on navigation. Although this app is a prototype, it is nearly complete and may become a key part of the company’s strategy going forward.

Off Canvas UI/UX Example from Terry Martin on Vimeo.

The conventional design pattern for navigation typically consists of a back button or a navigation button that serves as a breadcrumb. Let’s break the mold and invent a new design pattern based on a collection of views that are off-set on the canvas and stacked on the view hierarchy.

The “back button” in this pattern doesn’t exist. Neither does a navigation bar. Instead, the previous view is seemly peeking from the right, stacked on top of the child view. As you navigate, the views slide from left to right and have a slight bounce effect to serve as a visual cue.

This design pattern is surprisingly fun to watch / interact and could add intrinsic entertainment value to an app, while retaining utility.