Musora is a leading music education platform designed to help people learn drums, piano, guitar, and singing through structured lessons, play-along tools, and guidance from real teachers. With a growing subscriber base and an ambitious product roadmap, Musora needed to evolve from a content delivery platform into an engaging and goal-oriented learning experience.

‍

As a Senior Product Designer, I led the end-to-end design process for core experiences on both web and native mobile platforms. My role involved more than just visual upgrades; I was significantly engaged in feature development, product strategy, and enhancing user interaction across various devices, from desktop setups to iPads used with drum kits.

‍

My responsibilities included creating motivational learning paths, overhauling visual systems, and developing modular UI components. My focus was on ensuring that every interaction contributed to learning, delight, and long-term user engagement.

‍

Harmonizing the Visual Language

‍

When I joined the Musora design team, one of my first priorities was to modernize and unify the visual language of the platform across its four brands, Drumeo, Pianote, Singeo, and Guitareo, while still respecting each brand’s unique identity. The product encompassed web, tablet, and native mobile apps, and many legacy components had been used beyond their original purpose. This led to visual inconsistencies, redundant layouts, and a reduced focus on content.

‍

‍

Breaking Free from Static Headers

‍

One of the most outdated elements was the oversized static header, a long image block that was reused across multiple sections, often pushing essential learning content below the fold. These headers were visually heavy, repetitive, and provided little value beyond branding. I took the lead on the initiative to eliminate this outdated design and replaced it with a modular, compact, and content-aware layout that kept users focused on learning instead of decorative elements.

‍

Redesigning the Header System
‍

I created a flexible header system designed to adapt to various content types, including methods, coaches, packs, courses, quick tips, and community features. The key features of these headers are as follows:

‍

- They prioritize functional content such as lesson progress, breadcrumbs, and call-to-action elements.

- They scale seamlessly across different devices, including desktop, tablet, and mobile.

- They maintain brand consistency through subtle variations in color and typography tailored to each brand.

- They include proper spacing and development-ready guides to ensure pixel-perfect precision during implementation.

‍

The new system employs a unified layout logic that allows components like titles, metadata, calls to action, and progress bars to stack consistently, whether displayed on a 13" laptop or an iPad mounted at a drum kit.

‍

‍

Collaboration with Development

‍

Designing these updates was only part of the work; I also collaborated closely with front-end engineers to ensure proper componentization and implementation. This involved:

‍

- Creating developer-ready spacing guides

- Annotating edge cases for tablet breakpoints and smaller mobile screens

- Auditing the rollout implementation across all brands to maintain consistency

‍

By the end of the process, we had developed a modular header system and UI component library that significantly improved brand clarity, content prioritization, and implementation speed across Musora’s entire platform ecosystem.

‍

‍

‍

Challenges: Designing a New Way to Learn, Practice, and Stay Motivated

‍

One of the most impactful features I developed at Musora was the creation and rollout of the Challenges module. This new section of the platform aimed to enhance student engagement, motivation, and consistency. The concept was to change how students practiced by introducing structured, time-based challenges that they could complete individually or alongside the wider community.

The initiative had several key objectives:

‍

1. Introduce a habit-forming practice loop.

2. Promote social accountability through community participation.

3. Unlock progress tracking, rewards, and milestones to encourage students to return.

4. Highlight and promote more content in a purposeful, goal-oriented manner.

‍

‍

Discovery and Concept Exploration

‍

Since this was a brand-new feature area, I started with foundational research. I collaborated with stakeholders, product leads, and educators to better understand the behavioral psychology behind habit-building and identify which motivational factors resonate with music learners.

We explored questions such as:

‍

- Should challenges be daily or self-paced?

- Can students enroll in more than one challenge at a time?

- What occurs if a student falls behind or skips a day?

- How can we track and reward progress in a meaningful way without making it feel like a game?

‍

User Stories and Feature Definition

‍

To clarify the experience, I created a set of user stories that cover the core use cases:

‍

- As a student, I can view, enroll in, and participate in both individual and community challenges.

- I can track my lesson streak, see upcoming challenge schedules, and view the packs I am enrolled in.

- I receive notifications when new challenges are launched or when enrollment opens.

- I have the option to opt out if life gets in the way.

‍

These user stories helped guide our initial decisions and kept the team focused on delivering genuine value for learners, rather than simply creating another content library.

‍

‍

Low-Fidelity Prototyping and Internal Buy-In

‍

Given the size of the feature and its impact across multiple teams, I began by creating low-fidelity wireframes and developed fully interactive flows to explore aspects such as enrollment, lesson progression, and challenge notifications.

‍

This approach allowed me to:

‍

- Rapidly test interaction ideas with internal teams

- Gather feedback from instructors and stakeholders

- Iterate quickly before committing to visual design

‍

During this phase, I also collaborated closely with the product and engineering teams to identify technical constraints, particularly regarding progress tracking logic, streak management, and the differences between shared and solo experiences.

‍

‍

High-Fidelity Design, Progress Tracking, and Rewarding Consistency

‍

After validating the foundation for the Challenges module with interactive wireframes and user stories, I moved on to high-fidelity design. This phase focused on enhancing the visual experience, ensuring accessibility and responsiveness, and prominently featuring real-time motivation throughout the learner's journey.

‍

Designing for Every Screen: Web, Tablet, and Mobile

‍

Given Musora’s diverse audience, which includes many students using the platform on iPads beside their drum kits and others accessing it on desktops or phones, I developed a fully responsive design system for the Challenges module that:

‍

- Adapts fluidly from mobile portrait to tablet landscape to desktop widescreen

- Maintains a clear hierarchy with consistent spacing, visual anchors, and card-based content blocks

- Optimizes key user actions such as enrollment, streak tracking, lesson continuation, and certificate viewing for both touch and mouse interactions

‍

‍

Throughout all formats, I prioritized clarity, quick access, and minimizing distractions from the learning content.

‍

Progress Tracking That Motivates

‍

A key aspect of the Challenges experience was providing students with real-time feedback on their progress. I developed a system that tracked:

‍

- Daily streaks, including rest day buffers to prevent burnout

- Completed lessons and time spent practicing

- A visual progress ring to encourage routine building

- Weekly and monthly summaries to give students a broader sense of achievement

‍

These trackers were deeply embedded into the home experience, creating a frictionless loop of returning, continuing, and completing.

‍

‍

Rewarding Consistency With Badges & Certificates

‍

To celebrate commitment and provide tangible motivation, I implemented a reward system for students that allowed them to:

‍

- Unlock digital awards by completing challenges

- View and share certificates after reaching significant streak milestone

- Access personalized recognition screens after challenges that feel celebrator

‍

This reward system was not just visual; it was designed to reinforce positive behavior while providing emotional rewards. The experience was subtly gamified, always focusing on the learner's growth.

‍

‍

Designing for Musora was more than just a visual upgrade; it was about reimagining the way students engage with music education at every touchpoint. My role as Senior Product Designer involved building scalable design systems and unifying the experience across different brands and devices. I also contributed to the launch of entirely new features like Challenges, progress tracking, and reward systems, which impacted nearly every aspect of the platform.

‍

This work required a balance of creativity, systems thinking, and a deep understanding of learner behavior. The outcome was a more motivating, intuitive, and scalable product experience, designed not only for students to consume content but also to grow, remain consistent, and feel rewarded for their progress.

‍