jessica peng


On-Demand Learning

A hands-on learning solution for Adobe Experience Platform.


hero

Overview
Adobe Experience Platform customers and partners are trained through the Developer Enablement Program, which involves deploying learning content across multiple sandboxes and conducting in-person sessions to facilitate the training.

On-Demand Learning provides this training in a virtual and scalable manner. Equipped with their own learning environment (an Experience Platform sandbox), customers can go through hands-on exercises and lectures at their own pace.
Goals
  • Provide Experience Platform training from the Developer Enablement Program in a virtual and scalable manner to reduce cost and time to value
  • Deliver a user-friendly, interactive learning experience that improves customers' understanding of Experience Platform features and functionality
Role
UX Designer and Developer | Wireframes, Prototyping, UI/UX Research, Front-End Development and API Optimization
Scope
August 2024 - Current
Tools
React, TypeScript, React Spectrum (React implementation of Adobe’s design system), Unified Shell (Adobe’s UI framework for internal apps), HTML/CSS


Exploration

Personas
  • Author (Course) - creates lecture content
  • Author (Lab pack) - creates assets that will be deployed to the learning environment
  • Learner - consumes on-demand course
    • Data Architect
    • Data Engineer
    • Business Practitioner
    • Administrator
    • Web/Mobile Developer

* The Learner experience will be the focus since it's farther along in development and customer adoption.
Software Dependencies
software-dependencies
Competitive Analysis
We explored similar learning experiences within Adobe such as Adobe Learning Manager, Experience League, and Adobe Digital University. On-Demand Learning is differentiated from these other offerings as it provides hands-on learning environments that are unique to each individual developer/architect.

However, we drew inspiration from these learnings tools for our experience. Ultimately, we decided to take a mixed approach of using ALM APIs to manage both learner and author functionalities and building a headless UI to support learning environments.

platform-comp
Image 0
Image 1
Image 2
Image 3
Adobe Learning Manager experience
Image 0
Image 1
Image 2
Image 3
Image 4
Adobe Digital University experience
learning-gaps
learning-gaps


Design Process

user-flow
User flow from logging into the application to requesting/terminating a lab environment
Image 0
Image 1
Image 2
Image 3


Version 1

Image 0
Image 1
Image 2
Image 3
Image 4
Image 5
Image 6
Image 7
ImprovementBeforeAfter
Problem
Not enough course material to divide across course categories.
Solution
Remove course categories, add tags to courses instead.
Thought Process
Our initial idea was to divide courses into categories, modeled after learning paths in Adobe Learning Manager. In a learning path, learners do not have to complete all courses to achieve a skill. However, to achieve this on the ALM backend, we needed to create a catalog for each category and we lacked sufficient course material/authors to create the content. We ultimately decided to get rid of categories and just add relevant skills and tags to each course.		BeforeAfter


Version 2

Image 0
Image 1
Image 2
Image 3
Image 4
Image 5
Image 6
Image 7
ImprovementBeforeAfter
Problem
User has no indication that modules must be taken in order for some courses.
Solution
Disable user from selecting a module until they have completed the previous one.
Thought Process
In some courses, module order is enforced. Previously, users would encounter a warning dialog if they attempted to select a module without completing the prior ones. To create a clearer and more proactive experience, I decided to enable and disable module selection accordingly. Instead, users are now informed upfront that modules must be completed in sequence, based on what modules are available to select.		BeforeAfter
Problem
The Home page is redundant and uninformative.
Solution
Condense information across the Home and My Learning page.
Thought Process
Since learners are limited to one assigned learning environment at a time, I felt it would be helpful to display its activity and key details directly on the Home page. To support first-time learners, I also added a discovery module to introduce the concept of a learning environment. Additionally, a calendar provides learners with a clear overview of their environment timeline at a glance.		BeforeAfter
Problem
Concept of a learning environment's duration is confusing.
Solution
Change the duration field to estimated wait time.
Thought Process
The concept of a learning environment’s duration was unclear—did it refer to the time needed to complete the lab exercise or how long the environment would be available? To avoid confusion, I revised it to represent the estimated wait time after requesting a new learning environment, which provides clearer and more relevant information for learners.		BeforeAfter


Current Design

Image 0
Image 1
Image 2
Image 3
Image 4


Development Process


Once we finalized the general design, I started mapping out React components and API calls needed for the UI. Our approach was to develop a custom headless experience and use Adobe Learning Manager as our content management system to house and serve the course and learner info.

row-example
A major challenge we faced was integrating Unified Shell with Adobe Learning Manager (ALM), which had never been done before. Early obstacles included retrieving the access token required for ALM APIs, embedding the Fluidic Player for video and PDF content, and making sense of the APIs themselves. Initially, our API usage was inefficient, but through experimentation and working with our ALM resource, we discovered that certain calls could return more information by leveraging multiple parameters, significantly reducing the number of requests needed. Overall, we were able to solve a lot of issues by consulting our ALM resource, clarifying best practices with the Unified Shell team, and sifting through public documentation.


Impact & Next Steps


On-Demand Learning has been successfully adopted by three pilot customers, all of whom shared positive feedback on its ability to deliver learning content in a self-served, and organized format, with one user asking how we can further condense the content to provide "bite-sized" courses. Beyond its immediate value, the application has become a critical building block for the team's current initiative: an in-product experience where environments are managed externally. Looking ahead, On-Demand Learning will serve as the delivery hub for courses and lab guides that enable hands-on exercises in these environments, with ongoing UI refinements to align with new business requirements.