Sean Dillingham

KPCC for iPhone

Designing new ways for Angelinos to listen to the public radio they love
My Role
Product Design
Motion Design
Prototyping

KPCC, the second largest public radio station in the U.S., has earned a loyal audience of 700,000 weekly radio listeners. In 2014, KPCC set out to build a new iOS app with the goal of garnering an equally devoted smartphone audience. With so many options for listening on smartphones, making an iPhone app that felt indispensable was a high bar to reach for.

Working with KPCC’s editorial and business leadership, the product team set out to create compelling listening options beyond live broadcast.

Discovery

Finding key moments where KPCC’s app supports and enhances users’ daily routines

The first UX sprint focused on key customer journeys where KPCC's app could fit into people's busy lives. Creating customer journey maps helped us to think beyond simple activities and user stories, exploring the emotional and psychological dimensions of their daily lives and interactions with our app.

While there were many potential touchpoints worth exploring, we focused our journey map on the casual listening experience.

User Journey Map - Casual listening

Design

Establishing the app’s features, structure, flows, and high fidelity polished UI

Early design phases were spent sketching concepts to support distinct modes of listening beyond the live stream. Once we had established a structure for the app that would support our desired outcomes, I began exhaustively wireframing the app's screens. I created flows around user sign-in and personalization; smarter, more personalized membership appeals; and voice activation.

In the process of revising the design, we converged on two marquee features for the app:

Live Rewind, which gave users the ability to time shift their listening back seconds or even hours (thanks to some cool streaming server tech developed at KPCC).

Recommendations, a daily curated listening experience that gave users the best of public radio in short, easy-to-consume segments.

Flow: Adding Favorites
Wireframe flow: adding favorites
Flow: Membership Appeals
Wireframe flow: membership appeals
Live Stream UI
KPCC iPhone app home view
KPCC iPhone app live stream view
Notifications and Recommendations
KPCC iPhone app notifications view
KPCC iPhone app recommendatons view
Programs and Episodes
KPCC iPhone app program view
KPCC iPhone app segment view
Swiping and Scrubbing States
KPCC iPhone app swipe UI
KPCC iPhone app scrubber UI

Prototyping

Designing microinteractions to make KPCC’s iPhone app feel polished and delightful

Once visual design was complete, I identified areas where comps needed to be prototyped to document detailed animations and transitions. I used Framer.js as my prototyping tool of choice. Its javascript-driven workflow allowed me to iterate quickly, and also allowed me to hack real audio into the prototypes.

I built prototypes to communicate flows in the app where a complex set of transitions and animations needed to occur in order for the microinteractions to feel polished and delightful. I focused on the most important moments in the app: initiating and rewinding the live stream, moving between on-demand episodes, and a carefully sequenced app onboarding experience.

Live Stream and Preroll Ad
App Onboarding
Live Rewind Interaction
Seeking Through Episodes
Swipe To Next Episode

More Work

Experience

Places I've worked
2016 - Present

Signal Sciences

I'm currently Head of Product Design at Signal Sciences. We help companies defend their applications and data against hackers and attacks, protecting over 1.5 trillion requests each month.
As Director of UX for American Public Media and KPCC, I led design and engineering. I helped define product strategy, designed all our platform products, and shipped award winning editorial projects.

Case Studies

Selected work
Mobile App

KPCC for iPhone

KPCC, the second largest public radio station in the U.S., earned a loyal audience of 700,000 weekly radio listeners. In 2014, I designed their new iOS app to help them garner an equally devoted smartphone audience.
I designed KPCC’s publishing platform to bring structure and clarity to the content authoring experience. Clear, powerful authoring flows allow reporters to move quickly from blank canvas to published article.
HomeWorkWritingContactFeed

© 2020