INTRODUCTION
The Product, Design, and Business teams at Adobe Education wanted to integrate a point product, Adobe Spark, into a Learning Management System (LMS).
Project Overview
TOP-LINE RESULTS
DESIGN
Comparing our implementation with the platform’s industry leader, YouTube.
CONTEXT
WHAT
A “Learning Management System”, or LMS, is where students receive and complete assignments, hold discussions, and get their grades.
Google Classroom is commonly-known example of an LMS.
After a change in partners, we ended up partnering with Canvas-Instructure LMS.
WHY
Organizationally, Adobe seeks to gain more familiarity and usage among students and young creators.
The LMS is a critical piece of this strategy because teachers rely heavily on LMSs to connect with students, and if we can unlock the teachers we get access to many students.
Adobe Spark as a point-product is critical to the strategy because they had some use in general education classrooms already, unlike most Adobe products.
PROCESS, ROLE & TIMELINE
I was the solo & lead designer on this project.
I also partnered with a Director of Product on this work: due to lean team resourcing, she and I collaborated directly.
CONSTRAINTS
The engineering team was not formed until design process made significant headway.
To mitigate impacts, once Engineering formed, I partnered with them frequently — from desk drop-bys to whiteboard sessions.The Learning Management System partner we planned to work with bailed unexpectedly.
We had to shift to a new partner, with completely different UX, discovery patterns, and user audience (we shifted from K12 to university).We had to work with a different API than originally planned.
Technically in Edu this is an “LTI”, but it serves in a way very similar to an API — and required Engineering to rethink ways they had originally planned to implement.
DISCOVER & DEFINE
COMPETITIVE LANDSCAPE
The competitive landscaping provided preliminary information about users’ expectations. We rallied around YouTube (shown below) as a primary competitor because of its clarity, though we saw opportunity to differentiate in the richness of the experience.
Experiences were constrained to a very small iframe (modal).
This was intentional by the third-party LMS. Our envisioned flows from our previously-planned partner would need significant UX adaptations.Competitors focused on presenting consumable content to students.
We saw opportunity for a new approach: our integration would allow students to create content — not just consume.Competitors were utility-forward.
We saw opportunity for a rich, end-to-end experience.
RESULTS
We identified an early opportunity to provide a richer end-to-end experience than competitors.
The experience was defined in the task flow below.
DEFINING THE EXPERIENCE
TASK FLOW
We allowed for a little more nuance and complexity on the educator steps, because students require simpler flows to be successful. The 2-click student turn-in flow was one of our core pieces of execution.
WHITEBOARDING
DEVELOP
WIREFRAMES
DEMO
Designs and editable templates in this walkthrough are not final.
This demo was used to communicate technical asks during the wireframe phase.
TECHNICAL CHALLENGES
The following constraints were discovered in the wireframe stage
CONCEPT TESTING
I had to work quickly and with limited resources to recruit participants — our most reliable source turned out to be our partners at Canvas! Customer Success was happy to connect us with some educators.
LEARNINGS
IMPLEMENTATION & QA
I worked with three SCRUM teams at Adobe to implement this design
We ran into some complexities with authorization and account mapping, which required knee-deep partnership with Engineering: some artifacts from that are included below.
I also worked with the Adobe Spark design team, and had light interaction with the Product and Engineering folks at Canvas.
FINAL DESIGN
KEY SCREENS
CONSTRAINT REMINDER
Our third-party partner agreement required that we work in a small iframe.
The point-product, Adobe Spark, had influence in visual design choices.
USER FEEDBACK
LEARNINGS
One more thing:
CONTENT STRATEGY AND instructional design
In addition to leading the UX efforts, I took the lead on content direction and building because of my passion for solving this for educators.
I am most proud of this part of the process: it took a lot of persistence, grit, and creativity to pull it off.
I partnered with my Product Manager and one former educator, the latter of whom functioned in more of a light advisory capacity as her schedule permitted. I had to rely heavily on my empathy with users, as we had few resources to spare from a content strategy expertise.
