Athlify | Social sports & team challenge app

Athlify is a mobile sports platform that connects individual athletes and teams through social discovery, team challenges, match coordination, activity tracking, and connected devices. Better, shorter meta-description version A social sports app designed to help athletes discover players, build teams, organize challenges, and track their activity.

Product design • Mobile App

Product designer

20-01-2026

Homepage mockup_Thumbnail

What is it?

Athlify is a social sports ecosystem designed for athletes aged 16–60.

It combines:

  • Player discovery

  • Sports profiles

  • Team management

  • Team challenges

  • Match coordination

  • Social interaction

  • Chat

  • Location-based discovery

  • Activity tracking

  • Smartwatch connectivity

The key product principle was to keep the individual player identity separate from the team identity, allowing one player to participate in multiple teams with different roles.

Splash, Auth, and Home screens mockup

What were the challenges

Separating player and team identities

A team is not another login account. It is a shared entity managed by players with different permissions.

Designing the challenge workflow

The challenge system connects team discovery, invitations, acceptance, match setup, venue selection, and payment.

Making team payments understandable

The total match cost is divided between two teams and then distributed across their players, creating a potentially complex payment experience.

Combining social and sports features

Players need to manage profiles, friends, chat, teams, challenges, and activity without feeling like they are using multiple products.

Introducing smartwatch tracking

Bluetooth pairing, device management, permissions, and activity tracking needed to be understandable for both technical and non-technical users.

The methods I followed

I followed a product-design process focused on understanding the system before designing the interface.

Research & discovery

  • Requirement analysis

  • User problem identification

  • Feature mapping

  • User scenario analysis

  • Competitive pattern analysis

UX architecture

  • Information architecture

  • User flows

  • Navigation structure

  • Role and permission mapping

  • State mapping

Interaction design

  • Authentication flow

  • Onboarding

  • Player discovery

  • Team creation

  • Team management

  • Challenge creation

  • Match coordination

  • Payment flow

  • Device connection

  • Activity tracking

UI design

  • Mobile-first design

  • Component-based design

  • Consistent interaction patterns

  • Accessible touch targets

  • Clear visual hierarchy

  • Responsive design principles

Validation

  • Scenario-based usability review

  • Flow consistency review

  • Edge-case analysis

  • Error and empty-state design

  • Confirmation and recovery states

Final design

The final product brings the major Athlify experiences into one connected mobile ecosystem.

Player experience

Profile → Discover → Connect → Challenge → Play

Team experience

Create team → Invite players → Manage roles → Challenge teams → Organize matches

Match experience

Challenge → Accept → Secure match → Complete payment → Play

Activity experience

Connect device → Select tracking → Sync activity → View performance

The interface uses a clean, social-first mobile design language with familiar patterns, clear hierarchy, and progressive disclosure.

Splash screen, Onboarding, Authentication. and home
Event, Profile and Followers
Complete overview
Project Overview

Create a free website with Framer, the website builder loved by startups, designers and agencies.