Available in the App Store
Broadway.com tapped Fi to produce an iPad application that puts the best of Broadway right at your fingertips. Our mission was to create a
one-stop-shop for the latest buzz, information, pictures, and a seamless interface for snagging seats to any live performance.
The concept revolved around taking the best of Broadway.com, refining it for the iPad platform, and presenting an effortless touchscreen experience that puts users in the driver's seat.
The first sketch of the app's landing page
How a list of all shows might look
How a show would appear, once selected
Modal on single-tap for sub-menu
A gallery of Broadway.com videos
Before jumping into design, we carefully map out all of the content, and define two critical components: Wireframes and Site Map. The driving principles for this project revolved around a smooth browsing and purchase experience, so we focused tightly on the artful meshing of content and commerce.
The site map is critical, ensuring the path to what users want is simple and well-organized.
On a touch device, we design around a consistent set of touch gestures.
The initial experience with the required loading page
The show page with details, articles with "Buzz", and article views
Broadway.com produces a lot of great content, both photos and videos.
Simple is always better, so the designs for the Broadway.com iPad app absorbed the look and feel of the Broadway.com brand, then refined and extended it to carry through a clean, sophisticated visual experience. Within the iPad environment, the design allows the rich content offering to really shine through and create a visual personality all its own.
The menu slides over content when needed and hides nicely to get out of the way when viewing content.
Your current location is always highlighted so you know where you are.
All the content easily viewed in the main area with vertical and horizontal sliding.
While viewing news and articles you can always quickly jump to show pages with a simple tap.
All the latest from Broadway, you'll find an assortment of news.
Photo galleries from events and shows.
Videos and interviews viewed fullscreen on your iPad.
All the latest news related to the shows and stars at a glance
Magazine-style article design for easy reading in both portrait and landscape
A wall of iconic scenes offers a feast of shows to explore.
Photo galleries with access to trailers and more information below the fold
Incorporating a stage into the icon was our initial concept. Ultimately, it was just too much.
Our second round kept the curtains and lost the fluff. We were almost there...
Further simplification achieved the clean solution we were looking for.
We've become so well known for our HTML5, it's worth mentioning our strong and growing mobile development teams, with developers fluent in several mobile platforms. Written for iOS in native Objective-C this application makes use of the very latest features in iOS 5. The Broadway.com app leverages the latest in iOS memory management techniques, and relies on intuitive natural gesture-and-tap navigation. It's also worth noting that Broadway.com and Fi share a love of the Django web framework, and this app neatly ties into Broadway.com's robust CMS that provides freshly-flowing content across multiple platforms.
The content looks great whichever way you happen to be holding your iPad, no need to fumble around.
Building an app like this takes teamwork, especially when we have people collaborating in three offices, New York, Stockholm, and Salt Lake City. At Fi we use video chat, screen sharing, daily meetings,
and Basecamp to stay on the same page and work together. Having an 8 hour difference can be advantageous, it means we can work 17 hour days without anyone having to stay late!
Here at Fi we're very excited about this recent addition to our mobile portfolio. We’ve offered up a fun and informational
digital experience that allows for smooth content browsing and simple ticket purchase...
Now on with the show!
Working with CBS Interactive, we created an elegant online news and entertainment experience for Chrome users.
We teamed up with Google to create a mobile web app that allows users to map their location to the hottest social gatherings, events and parties at Cannes.
Using colorful info graphics, Civil War 150 informs, educates and entertains users about the American Civil War.