Keytt Webapp Revamp

A phase-1 UX and UI redesign of Keytt’s onboarding flow, focused on clarity, trust, and reducing early user friction for artists and teams

Client:

Keytt

Date:

January 30, 2026

Type:

SAAS Website

Role:

UI/UX Designer

Overview

Keytt is a Paris-based SaaS platform that helps artists, teams, and labels understand their music performance across platforms and make better growth decisions using analytics and scoring.

This project focused on Phase 1: Onboarding, with the goal of improving user understanding, reducing friction, and increasing onboarding completion rates.
Phase 2 (Dashboard and Artist Profile) is currently in progress.

The Problem

Keytt was driving traffic through ads, but a large percentage of users were dropping off during onboarding.

Key issues in the existing flow:

  • Users were asked to commit too early by entering artist details before understanding the product.

  • The value of the product was not clearly explained upfront, especially for first-time visitors from ads.

  • There was no clear distinction between individual artists and teams or labels.

  • The flow felt forced, which increased abandonment during setup.

This resulted in low onboarding completion and poor activation.

Project Scope

Phase 1: Onboarding Redesign

What I worked on:

  • Complete onboarding UX flow

  • Mobile-first and desktop layouts

  • Authentication and verification screens

  • Artist setup flow

  • Individual vs team decision flow

  • Visual direction and UI system

  • Consistent typography and spacing naming for future scalability

My Design Approach

1. Reduce Commitment Anxiety

Users coming from ads are still evaluating trust.
The new flow focuses on:

  • Explaining what Keytt does before asking for input

  • Moving artist setup after authentication

  • Using progressive disclosure instead of forcing decisions

2. Educate Before Asking

Instead of jumping straight into setup, the onboarding now:

  • Introduces Keytt’s core value in three short explanation screens

  • Clearly communicates:

    • Real-time performance tracking

    • Smarter growth decisions

    • Keytt Score as a single success metric

This helps users understand why the product is worth committing to.

3. Progressive Onboarding for Artists and Teams

A key UX decision was separating intent early:

  • Individual Artist

    • Copy adapts to feel personal and lightweight

    • “Add your artist profile”

  • Team or Label

    • Copy shifts to “Add your first artist”

    • Clear reassurance: “You can add more later”

This avoids making teams feel forced while keeping onboarding flexible.

4. Clear, Premium Visual Direction

The visual system was designed to feel:

  • Premium but not cluttered

  • Confident and trustworthy

  • Consistent across mobile and desktop

Key choices:

  • Dark mode-first UI to match the product’s analytical nature

  • Warm accent color for CTAs to balance contrast

  • Subtle gradients for depth, not decoration

  • Scalable typography and spacing naming for handoff

Final Flow Summary

  1. Ad traffic lands on onboarding explanation screens

  2. Users understand the product value

  3. Authentication (Sign up or Log in)

  4. Email verification

  5. Choose Individual or Team usage

  6. Add artist with optional social links

  7. Dashboard entry

The flow prioritizes clarity, trust, and reduced friction at every step.

Outcome

  • Founders approved the Phase 1 onboarding direction

  • Minor UX refinements were addressed collaboratively

  • Designs are currently being integrated

  • Artist interviews are planned to validate performance before scaling Phase 2

Contact by Phone on WhatsApp: +91 (IND) 877-85-31392

Contact by Phone on WhatsApp: +91 (IND) 877-85-31392

Contact by Phone on WhatsApp: +91 (IND) 877-85-31392

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