Great Big Story / RWD + iPhone App

Designing a new brand and mobile-first service to bring quality video storytelling back into people's social feeds.

Business Challenges

Our client had an idea for a new business opportunity and had done their homework to identify the market gap. They enlisted our help to take that seed of an idea and develop it into a storytelling service that would actually resonate with digital first consumers. For this service to prosper, people had to watch these stories from anywhere: facebook stream-to-native app, mobile-to-desktop and perhaps even TV.

The end result of several months of effort was a truly multi-channel experience with unexpected, seductive, editorial video shorts as the center peice and the interfaces as the support system. Bringing interesting and professional quality stories to the people (instead of having the people come to them).

Process

Value Proposition and Brand Development

We kicked off the project by brainstorming with the client team to understand current thoughts around this new brand's value, voice, tone, audience and offering.

I helped the team identify where they stood in relation to potential competition, as well as lead the effort to synthesize the new brand's value proposition. As we were synthesizing the various attributes, I found Aaron Walter's brand personality technique of "[x] but not [y]" very helpfull in creating clarity across the team.

valueProp_001
valueProp_002
valueProp_003
valueProp_005
gbs_CreativeBrief_20150304_Page_06
gbs_CreativeBrief_20150304_Page_08
gbs_CreativeBrief_20150304_Page_09
gbs_CreativeBrief_20150304_Page_10

Service Blueprint and Scenario Development

Next I identified the primary user scenarios to illuminate that discovery of this service would happen on a social network. We also used a service blueprint to help the team start to identify the technical foundation and user actions.

user-scenario-concepting
gbs_CreativeBrief_20150304_Page_22

Responsive Web Concepting

This project was a true collaboration between the design team and our partners. They participated in early sketch ideation and paper protoyping workshops.

rwd_Concepting_002
rwd_Concepting_004
rwd_Concepting_003

We focused on designing a mobile-first responsive framework because we knew to support access from any device, the service would have to start as web-based.

rwd_ContentStructure
I identified and mapped out how the content structure would change based on access method and content model type.
rwd_BreakpointFlow
I explored how the content could reflow across breakpoints using a whiteboard to quickly get feedback from my team.

Responsive Web Interaction Prototypes

To validate our hypothesis that the interface could be super straight forward and make the content the star of the show, I built interactive web prototypes using adobe edge and adobe animate for both mobile and desktop.

Video prototype of user scrolling up and down the stream of videos.
Video prototype of user accessing the menu of video collections.
Video prototype of user navigating from stream of videos to watching an individual story.

iPhone App Concepting and Prototyping

After we had the responsive web design near completion, we started on designing a native iPhone app. This would allow development of the responsive website to happen first and help the team could launch the iPhone app as a fast follower. This was intended to support early adopters and give them a destination to become advocates.

The critical benefit of a native app was the ability to auto-play videos as soon as the user had selected on from the stream. This isn't possible on iPhone mobile web, but is on Android.

I worked with my team to take the previously established design system and pushed it further to make the app feel truly native. Myself and another designer used Framer.js to build a fairly robust prototype that came close to feeling like a native app. He was even able to get the auto-play video working in the prototype.

Video prototype of user scrolling a stream of videos and revealing the main menu.
Video prototype of user navigating from the stream of videos to watching an individual story.

At a glance the app and website appear pretty simple, but it took alot of effort to make sure they were so simple.

gbs_iOSAppSpec_OrgModel
Organization model document I put together to help the client team understand the iPhone app

Result

We helped our partners take a new business concept from the seed of an idea to a functioning business with a user first perspective.

The service launched in October 2015 and is still going strong. The iPhone app has 4.5 star rating across 115 reviews since initial launch. The company and the day-to-day team has continued to update the product and app as they've found and developed their content voice and strategy.

If you have a spare minute, I highly recommend you go watch a story or two over at Great Big Story


More Projects