SEptember 2025

Designing a more human Playo

Designing a more human Playo

Designing a more human Playo

As an intern at Playo, I analyzed early user insights, explored Rive for interactive elements, reimagined onboarding to improve retention, and contributed to 3D badges, typography, color systems, and low- to high-fidelity UI for the V5 app revamp.

As an intern at Playo, I analyzed early user insights, explored Rive for interactive elements, reimagined onboarding to improve retention, and contributed to 3D badges, typography, color systems, and low- to high-fidelity UI for the V5 app revamp.

As an intern at Playo, I analyzed early user insights, explored Rive for interactive elements, reimagined onboarding to improve retention, and contributed to 3D badges, typography, color systems, and low- to high-fidelity UI for the V5 app revamp.

Year

2024

company

Playo

Category

UI/UX, 3D, MOTION

Duration

8 Weeks
THE WHY
THE WHY
  • To position Playo as a networking platform instead of only a booking app.

  • Improve onboarding by showcasing features clearly to reduce churn.

  • Support upcoming paid subscriptions through a refreshed design language.

  • Build a consistent typography system for efficient cross-platform implementation.

  • Introduce gamification through 3D achievement badges to drive user motivation.

OUTCOME
OUTCOME
  • Home screen redesign drove a 20% increase in weekly interactions with the "games" card. (10.1K clicks —> 12k clicks)

  • Multiple users reported the app "felt more lively" and "more exciting".

APPROACH
APPROACH
ANALYSIS

Analyzed competitor apps (Strava, Cult Fit, Hudle) to identify gaps and opportunities in Playo.

CONCEPTUALIZATION

Conceptualized animations and interactivity using insights from Duolingo and Uber case studies.

DESIGN

Designed a video & interactive UI elements like loaders, buttons & badges using Rive & Spline.

EXECUTION

Collaborated with developers to test and implement designs and interactive elements.

Original onboarding
Original onboarding
  • The onboarding had minimal motion and storytelling.

  • Isolated avatars on a map rather than real moments of people playing, having fun, product feels like a tool.

  • Answers the "WHAT is Playo?" question but not the "WHY is Playo" question.

New ONBOARDING VIDEO
New ONBOARDING VIDEO

I used DaVinci Resolve to edit videos sourced from the marketing team and relevant stock footage, curating visuals that highlighted:


  • key features while weaving a community-first narrative

  • emphasizing genuine connections and the spirit of building meaningful engagement

  • Answer "WHY is Playo" = "Make play a habit."

LOADERS
LOADERS

I created multiple loaders in Rive inspired by the Playo logo. Since the loaders were built in Rive, they are extremely lightweight in file size, making implementation smoother while ensuring the overall app size remains optimized; this efficiency allows Playo to integrate engaging, high-quality animations without compromising performance or storage constraints.

BUTTON EXPLORATION
BUTTON EXPLORATION

I explored Rive and its state machine to design a couple of interactive button concepts, experimenting with state-based and trigger-based animations rather than linear ones, ensuring more dynamic and responsive interactions; throughout, I aligned the designs with Playo’s playful, sporty aesthetic to maintain brand consistency.

Content

3D BADGES
3D BADGES

I leveraged Spline to design a set of 3D interactive badges that serve as achievement markers within Playo, enhancing the sense of reward and playfulness. These badges were envisioned not just as digital tokens, but as elements that could be extended into the physical world, by producing them as real badges and distributing them to users, Playo could create a deeper, more tangible bond with its community.

Content

typography
typography

The typography, inspired by the Uber Base Design System, uses Gabarito for a clean, modern, and legible style. It defines a hierarchy from bold Display to Headline, Body, and Label styles, ensuring consistency and flexibility across Playo’s screens while balancing playful brand expression with readability.

COLOR
COLOR
Screens
Screens

New low fidelity and high fidelity screens with a more delightful experience were designed.

  • discover More discover more