Roles and Responsibilities
As the product designer, I partnered with the project design lead to craft an end-to-end badging experience. Beginning with the product requirements, I mapped user flows and developed design solutions that supported both learner and admin needs. I also collaborated with the project manager and engineering lead to align cross-functional efforts and deliver a seamless, intuitive user journey—from course completion to badge sharing.
User Flows
I created multiple user flows based on the project requirements, each focused on different stages of the badging journey. These included:
Building badge awareness and guiding users toward earning a badge
Displaying course progression within the learning experience to show how much content remained before a badge could be earned
Defining the interactions required for a learner to “accept” and claim their badge
Some courses required passing a final exam to earn a badge, while others awarded badges at 80% completion. I designed for multiple badge claim entry points—whether users completed a course post-launch or retroactively claimed badges for courses finished within the previous six months.
By collaborating with cross-functional teams, I identified process gaps and deepened my understanding of the broader badging ecosystem. These efforts ensured a cohesive, accurate experience across all use cases.
The user flows helped identify which areas of the platform would need to surface badge awareness and at what point the badge could be claimed.
I determined that four key pages required updates:
Live Course Product Detail Page
On-Demand Course Product Detail Page
User Profile Page
Universal Content Viewer (UCV)
When users clicked a course title, they landed on the Product Detail Page (PDP) for either live or on-demand courses. These pages presented essential information to help users evaluate whether the content aligned with their goals. By integrating badge visibility here, it ensured users were aware of the credentialing opportunity before starting. Upon reaching 80% completion, they could also claim their badge directly from this page.
The User Profile Page, accessible via global navigation, served as a central hub for personal learning which displayed playlists, history, highlights, and notes. To introduce badge awareness here, I designed a new “Badging” section. In its empty state, users were prompted via a CTA to explore course offerings. Once they approached 80% completion, they could then claim their badge directly from the profile page.
The Universal Content Viewer (UCV)—the main interface for consuming courses, audiobooks, and books—combines a reader with a learning environment. Because users spend significant time in the UCV, I prioritized surfacing badge progression here to keep learners aware of their real-time progress.
After determining how badging would interact on those four key pages, I created a detailed document defining required UI states across four key pages, which guided the structure of low-fidelity wireframes and ensured coverage of all user scenarios—before, during, and after badge completion.