Klipie

American Eagle Outfitters

Podcast + Social = Better Experience

Tagline goes here about the project

Klipie is a podcast app above all else but is loaded with added features to easily share shows in unique ways.

Klipie is a podcast app above all else but is loaded with added features to easily share shows in unique ways.
Klipie is a podcast app above all else but is loaded with added features to easily share shows in unique ways.
klipie_subway

— Role Details

Date:
September | 2017

Role:
UX/UI Designer

Directing efforts and all aspects of design including creative direction, logo, branding, UX, UI & developing interactive prototypes as proof of concept in an effort aimed at creating a refined and simple to use security product for mobile devices.

— Introduction

The fastest growing medium in the world.

Podcasts are the fastest-growing media form in the world with millions of shows for listeners to choose from on every-topic imaginable. Each new show seems to raise the bar for the shows that come after with amazing production, original music, one-of-a-kind personalities & life-long learning from the worlds top schools. Although the content is progressing, the technology behind the medium haven't progressed very much.

Realizing this creates new opportunities for teams able to move the medium forwards. Challenges Klipie aims to improve will provide a variety of benefits for both content-providers and the audience. The effort intends to defragment sharing, move listeners closer together while offering shows access to new listeners with currently untapped touch-points resulting in better audience insights.

— Challenges

Directing efforts and all aspects of design including creative direction, logo, branding, UX, UI & developing interactive prototypes as proof of concept in an effort aimed at creating a refined and simple to use security product for mobile devices.

— Approach

2-Week-Sprint-Process

Based on a 2-week sprint plan with a possible few days extension if needed for week 3 – requiring frequent client involvement, at times leveraging virtual pair design sessions.

 

— Phase One: Understand

Stakeholder Interviews

As a team, we focused on the business objectives, product vision, budget, schedule & any other piece of information & assumptions. This included online-whiteboard sessions & scanned-sketches to flushout a variety of ideas to align our efforts & vision.

Key Areas of Interest:

  • Budget
  • Schedule
  • Product Vision
  • Technical Limitations
  • Business Objectives
  • Customers
  • Competitors
  • Goals & Success Criteria   

 

User Research

Investment early on in the project to refine user-research conducted pre-project. To keep things agile, quick-yet productive, we leveraged gorilla research techniques using online & in-person methods. Reaching out to friends, family, co-workers, friends of friends and a random, yet prospective users.  

Age Chart by Show Popularity

Results of current podcast audience data & listenership growth .  *Data provided by Wikipedia

User Research = Clarity

Although a very limited pool of users, we were able to see a trend shared among listeners.  We learned the following:

  • New show discovery is important to the experience
  • 100% of listeners have access to Netflix
  • 35% subscribe to streaming music products
  • Listeners tend to follow shows suggested by like-minded contacts (ie: friends, co-workers, social-media personalities)
  • Sharing shows online is confusing  Links are app-specific
  • Sharing specific shows is convoluted
  • Podcasts are appropriate with most everyday activities
  • Shows usually reflect a persons established personal views
  • No-trend was established for users favorite exsisting app

 

Building Competitive Partnerships

Given the rich nature of the  podcast-community, it’s not-accurate to consider the other podcast-apps as competitors.  It's the goal to build partnerships with other apps while allowing them to also profit both in increased user-growth and with additional revenue streams.

klipie_user_bnnr

— Phase 2: Define

User Cards

Nurturing a community requires laser-sharp user research, giving users the opportunity to drive the future features. Leveraging information collected from early user-interviews efforts, user-personas in the form user-card technique offering a solid starting point for further developing accurate user personas.

Laura
kimmy
brad
byron
mesha

Whiteboard Sessions

One of the most intense activities of any project & extremely fun. As a team, we met online as the team is co-located. We used the following sessions to generate ideas, explore the possible, refine the actual & plan for the next couple weeks.  

We focused a lot on developing an efficient flow from user on-boarding through sharing a post, which is the goal & differentiating feature. 

clipflow
whiteboard_1
whiteboard_2
whiteboard_3
whiteboard_4
whiteboard_5

Sketches

The teams creative juices were flowing after most of the early stakeholder sessions. To organize some of the new (post-meeting) ideas, sketches were produced before jumping into Balsomiq to create the wireframes.

klipie_sketches_photo_secondview
klipie_sketches_5
klipie_sketches_3
klipie_sketches_4
klipie_sketches_6
klipie_sketches_photo
klipie_sketches_2

Wireframes

To create the wireframes, we chose Balsomiq over Sketch & Adobe XD so the entire team could easily make edits & work together while co-located. 

klipie_v1_wireframe_banner_edgarfleming
klipie_loungn_tn

— Logo & Branding

Before jumping into hi-fi product designs, a bit of a attention was given to early-stage logo and branding design to drive UI design while setting goals to promoting cohesive aesthetics.  This effort can provide web, presentations & various other design assets. 

While working on the MVP, a few ideas began to form about the personality of Klipie would develop. A few adjectives became constant: Community, Together, Social, Waves, Colorful, People, Interests & Audio Forms.

Klipie_Logo_white
klipie_abstract_idea
klipie_pattern_idea_shapes_color
klipie_pattern_idea_green_lines
Klipie v2 Branding Idea Banner
klipie_pattern_idea_green_rain

— Product Design

Working through the wireframes with the team, refining based on feedback & intergrating best-practices for Android & iOS.

DISCOVERY – Following Example 2
PODCASTS
PODCASTS – Alternative
SHARE CLIP Copy
DISCOVERY – Trending
PODCAST HOME
TRANSCRIPT
DESIGN CLIP
DISCOVERY – LIKES
PLAYER – Show Details
TRANSCRIPT – Search
CLIP – Playing
NOTIFICATIONS
PLAYER – Show Details – Menu
TRANSCRIPT – Hilight
CLIP – Edit Timeline

— Moving Forwards

Testing, Iterating, Testing & More Iterating

Initial plans to get interactive-prototypes in-front of users to continue refining the app into version 2.0.

Our first version will be used help engineering get started — especially with some of the more unique aspects of the product, that will require new & clever engineering challenges to bring the app to fruition.

PRIVTMobile Application

Javiera Da FonsecaWeb Design

KlipieProduct Design

Tinder JSDesktop App

Dunk or PassMobile App