SportsYapper: Various Projects
SportsYapper was a sports, social network start-up driven by in-the-moment conversation and real-time statistics. Marketed in both the US and UK, SportsYapper's international platform presented many unique design challenges. My role as Lead Product Designer allowed me the opportunity to establish research and testing processes while also collaborating with developers and product owners to solve for these unique challenges. SportsYapper was available on the web and as native iOS and Android apps.
Roles & Responsibilities
Created high-quality prototypes and engaging designs within a fast-paced environment
Established user testing research practices
Worked hand-in-hand with product owners and engineering
Led visual design for branding and marketing materials
Challenges
Sports are driven by real-time data and in-the-moment highlights, our users demanded a fast and exciting experience to match
An international platform provided us with many research opportunities to explore product-market fit
App Interfaces
As a sports fan myself, I felt an obligation to design an experience that allowed our users to easily follow their teams, discover new friends, and most of all share their excitement.
Conversation streams with in-game data and without
Conversation threads and Yapp composer
Following teams UI and empty state screen
Updating User Onboarding
Onboarding became an essential way to gather information about our fans and allowed us to cater more targeted content to them. I led a redesign of 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 execution, helping to create clear goals for the project.
Outlining the steps and screens of user onboarding.
Social sign on flow
Final Onboarding Designs
Log in and sign up screens
Add phone number and permission priming screens
Animation in the UI
For more complex gestures and feature enhancements, I would generate animated prototypes for the team. Interacting with these prototypes can help developers understand the timing, effort, and resources required to build the feature. It also provides an asset to quickly usability test.
Example of the shrinking scoreboard to allow for more content while scrolling
Proposed concept for recording video and playback UI
Adding A Native Web App
In late 2014 we were expanding our native app platform to desktop and mobile web clients. With that came changes to our visual language, informed through market research and user testing.
Web user interface with dynamic scoreboard footer
Robust search functionality UI
Visual Updates Translated Into The Mobile Apps
New brighter and wider UI in the native apps
Updated games and profile screens
Marketing Website
Within sports media, there is always an opportunity to better cater content to your audience. Targeting the daily ESPN or Bleacher Report user allowed me to experiment in designing a media-friendly, front-facing website that tied directly to SportsYapper for easier consumption of trending topics and sports news.
Wireframe for the eventual marketing landing page.
Final design.
