header3header3

BroadwayHD

Cross Platform Streaming

BroadwayHD is an online streaming service founded by the Palace Theatre owners Stewart F. Lane and Bonnie Comley. Their vision was to extend performances out of the theatre and into digital streaming devices. With 10-camera angles and live streaming, viewers could have a front-row-couch experience for a fraction of the cost. 

TEAM
Lance Porigow
+ Business Strategy
Brandon Levin
+ Creative Direction
Tiffany Young
+ Visual Designer
Jake Phillips
+ Account Management
Adam Tilson
+ Web Development

ROLE
UX / UI & Visual Design

devicesdevices

THE ASK
BroadwayHD was too dependent on Broadway's classic brand and needed a new, fresh-faced look to contrast the theatre experience and activate the digital one. The digital experience was designed in tandem to the rebrand in order to launch as one cohesive campaign.

MY ROLE
I was involved in the entire problem solving process. I chatted with Broadway fanatics and realized BroadwayHD could never be Broadway, but rather the quick-fix experience. Based on our users' priorities, I created the skeleton (i.e. wireframes). Once approved, my design co-pilot and I filled the experience with the new brand elements.

THE NEW BRAND

MOBILE WIREFRAMES

Logged In & Anonymous

Wireframing for BroadwayHD was all about the user intent—what is BDWAYHD? How much does it cost? What's available? How do I sign up? All of our users' major questions needed to bubble to the surface for both registered and non-registered potential members. Anyone can register because of the varying payment methods, so we had to adjust accordingly.

LOGGED IN

Members want to get to their content and get to it quickly. We made sure this was true no matter where they're streaming from. We designed this MDP to be highly searchable, highly relevant, and loaded with both free and paid content.

ANONYMOUS

Non-members have different needs—they've heard of BroadwayHD from multiple sources and were curious enough to show up. It was our job to tell them why they should come back. We felt that price was important, as well as informational content around the brand. We had multiple other snippets of (not displayed) info: broadway news, popular shows, ways to watch, etc. Quantitiy was king as we started to learn what non-members were reacting to through data analytics.

COMPONENTS

Collection Widgets

Because I was in charge of the minimum delightful product, we knew we needed to design with flexibility. After I created the wireframes, I organized each page's components to better understand what we had and what we still needed. By creating a library of components we strenghtened our design foundation as it  evolved with user testing. Collection widgets—elements related to each other and allowing browsing and detail functionalities—were one of the categories of components and are displayed as an example.

COLLECTION WIDGET EXAMPLES:

1 Featured Show Header was designed at 16:9, the cinematic ratio. All functionality relates to the featured show, and helps the user decide if they would like to watch it, what time, and who else should know about it.

2 Content accordians were created for added information about a given piece of content.

 

tv_watch_2tv_watch_2

THE REDESIGN
Once the wireframes were created, it was time to breathe life via the new brand into all streaming services. Starting with the web app experience, we used the invision app to communicate our vision with our corresponding teams. After designing seven templates, we booted up Zepplin to get our developer the production files he needed and continued with quality assurance during the development process.

show-pageshow-page
News-PageNews-Page
mobile-screens-blackmobile-screens-black
[unex_ce_button id="content_q5l4hkxp3" button_text_color="#ffffff" button_font="bold" button_font_size="16px" button_width="full_width" button_alignment="center" button_text_spacing="5" button_bg_color="#353535" button_padding="20px 0px 20px 0px" button_border_width="0px" button_border_color="transparent" button_border_radius="0px" button_text_hover_color="#ffffff" button_text_spacing_hover="15" button_bg_hover_color="#8d8c8a" button_border_hover_color="transparent" button_link="https://www.broadwayhd.com/index.php" button_link_type="url" button_link_target="_blank" has_container="" in_column=""]VIEW WEBSITE [/ce_button]