SY

SportsYapper

A mobile and web app driven by global sports conversation.

Overview

SportsYapper was a start-up focused on giving fans a way to communicate about their favorite sports and teams. Marketed in both the US and UK, SportsYapper's global platform presented many unique design challenges. My role as Senior Product Designer allowed me the opportunity to collaborate with developers and product owners to solve for these design challenges on both our mobile and web products.

Challenges

Sports are a global story that anyone can fall in love with. As a sports fan myself, I felt an obligation to design an app that allowed our users to share their excitement easily while leaving a strong impact on them visually. Because we had both an active UK and Northeast US user base, we needed ways for users to discover new content but not be overwhelmed by sports talk they found irrelevant to their interests. Utilizing our core metrics, UI experimentation, and sound development principles allowed us to consistently craft our product to their demands.

SY SY SY

Android

While iOS was our flagship app in the US, our data showed a much higher percentage of UK users running SportsYapper on Android devices. We took careful consideration into changes we made to the product so that we could integrate them easily cross platform.

SY

Onboarding

For product growth, onboarding became an essential way to gather information on our users and allow us to cater content to them. One of the more extensive projects I lead was redesigning our onboarding process to include phone verification, social sign on, and feature education. Based on in-app onboarding drop off rates and market research we mocked up several user flows before design, helping to create clear goals for the project.

SportsYapper Onboarding 1 SportsYapper Onboarding 2 SportsYapper Phone 7 SportsYapper Phone 8

Animation in UI

For more complex gestures, animations, and feature enhancements I'll commonly generate animated prototypes for the team. Interacting with these prototypes can help developers understand timing, animation, and dev resources for a new feature. It also allows product owners the chance to process the impact of said feature for both the user and the development team.

Resizing Scoreboard

An example of the shrinking scoreboard header to allow for more content while scrolling.

SportsYapper Scoreboard
Invite Friends

A popover modal with custom animation.

SY
Video Camera UI

Proposed concept for recording video and playback UI.

SY

Web

Translating our interface and aesthetic to a web application was an exciting challenge. With greater visual real estate that the web offered we were able to highlight more data and allow for a better exploration of content creation and discovery.

SY SY

New Directions

Having a group of core users test the app consistently helped us track data we found important. It also allowed us the ability to see how users responded to updated designs and UI improvements. We never shied away from trying out new visual directions for any platform.

SY SY SY SY

Marketing

Within sports media there is always opportunity to innovate and pivot messaging and branding. Targeting the daily ESPN or Bleacher Report user allowed me to experiment in building a media friendly, front-facing website tied directly to SportsYapper for easier consumption on trending topics and sports news.

SY SY

Next Project