Featured Project

Woman working on desktop photo - created with FreePik and Figma

This mock project develops the problem-solving skills teachers need to gain teacher clarity and double the average annual student growth.

Experience the Project

Overview

Icon - created with FreePik and Adobe Express

Audience

The 5th and 7th grade teachers of Eastern Washington Public Schools.

Icon - created in Adobe Express

Responsibilities

  • Instructional Design
  • eLearning Development
  • Visual Design
  • Prototype Development
Icon - sourced from Adobe Express

Tools Used

  • Articulate Storyline 360
  • JavaScript
  • Vyond
  • Figma
  • Artlist
  • ChatGPT
Magnifying glass on a stack of paper records - created with Gemini

The Problem

Since 2020, math performance in U.S. students has declined significantly. In response, Eastern Washington Public Schools, a fictitious district, implemented training based on the strategies in Clarity for Learning: Five Essential Practices That Empower Students and Teachers (Almarode and Vandas, 2019). However, the training fell short of its potential. Interviews and post-training surveys revealed that teachers didn’t feel the training connected to their day-to-day classroom needs. For them to fully engage with these powerful strategies, they needed training that directly applied to their classrooms and equipped them to immediately improve student growth.

The Solution

The solution needed to address two challenges: the wide scope of K-12 education and the breadth of research in Clarity for Learning. Eastern Washington Public Schools’ analysis identified 5th and 7th grades as priority areas for intervention. I proposed a scenario-based e-learning experience that gave 5th and 7th grade teachers grade-level-specific, hands-on practice applying best practices for creating learning intentions and success criteria. By developing their own learning intentions and success criteria, teachers would be better equipped to guide their students toward deeper understanding and growth. The practice with major cluster standards from their grade level was directly relevant to their classroom needs.

Young professional with a lightbulb - sourced from FreePik

My Process

Action MappingIntentional DesignStoryboardVisual MockUpsDevelopmentResults and Takeaways

Action Mapping

The district had the clear goal of using the research in Clarity for Learning to increase student growth in math among 5th and 7th grade students. Narrowing the scope of the research to building teacher clarity, we used an action map to identify the actions that teachers with teacher clarity do on a daily basis. We revealed that these teachers create and communicate effective learning intentions and success criteria, provide aligned practice, and give feedback that communicates where students are and what next steps they should take. Since teachers need deep familiarity and understanding of the standards to take actions of a teacher with clarity, the team decided to focus on giving teachers hands-on practice creating learning intentions and success criteria from the standards.

Screen=shot of action map in Mind Meister

Intentional Design

Continuing under the ADDIE framework, with the problem identified and a solid understanding of the audience, I used Gagne's Nine Events to create an outline for the training.

Screenshot of Gagne's 9 Events on a Figma Jam boardScreenshot of outline in Figma Jam

I designed the course to leverage key aspects of adult learning theory, so learners could feel in control and engaged throughout the learning experience.

Engaged adult learner photo - sourced from FreePik

To highlight the impact on teachers' classrooms, I kicked off the training with an animation that emphasized the effect of successful learning intentions and success criteria on student growth.

Experience The Project
Screenshot of Vyond animation

Movement to new slides throughout the course is determined by the learner. Learners are allowed to pause, return, and revisit the course as needed. A progress bar was added to support their ability to schedule the timing of their training.

Animations depicted experiences familiar to math teachers:

  • Students' positive/negative reactions to their learning growth/ lack of growth
  • Focused/distracted class
  • Positive/negative exam results

The UI interactions and course content were directly relevant to the audience:

  • Common Core State Standards were selected from major clusters in their grade level
  • The UI used to access the full text of the standards mimicked navigation from Achieve the Core's Coherence Map
  • Animations modeled familiar methods of communicating learning intentions and success criteria to students
Screenshot of Vyond animation

The course requires the learner analyze learning standards and apply best practices for building effective learning intentions and success criteria. They're given access to the standards and best practices, but how they use the resources to problem-solve is up to the learner. Throughout the module, they are presented with feedback to inform them on their progress toward the learning goal.

Storyboard

I built a storyboard to communicate the Storyline 360 development needs for the scenario based training module. The storyboard included:

  • On-Screen text
  • Voiceover text
  • Animation notes
  • Programming notes
  • Visual direction
  • Video, audio, and image files
Screenshot of storyboard in Google Slides
Screenshot of storyboard in Google Slides
Screenshot of storyboard in Google Slides

Visual Mockups

Development

Working Prototype

With the visual mockups and the storyboard slides, I built an interactive prototype in Articulate Storyline 360.  The prototype included Vyond animations, introduction and exit slides, as well as some scenario slides with full functionality of the mentor help and the information resource. I sent the prototype to real teachers for their feedback. The insights they provided had an impacted the final project.

Screenshot of Storyline 360 development

Telling a Story

Using the outline and visual mockups, I created the animations for each scene in Vyond.

Screenshot of Vyond files

Getting Technical

I added JavaScript to the Storyline project to validate the user input and include a progress bar in the player. I utilized variables, triggers to show layers that were grade specific for the learner. I used slides and scenes to ensure the navigation away and back to the questions was a seamless experience for the user.

Screenshot of Storyline 360 development

Gamification

The learner receives a "badge" after each successful completion of a scenario. A short animation plays with cheering sound effect.

Experience the project
Screenshot of badge animation

Results and Takeaways

Comments from the Audience

  • "I loved how representative it was of different students and staff, and the progression and connections you made really make it so teachers can see how their work impacts kids beyond the classroom."
  • " The updates went so well, it's so easy to navigate!!"

Lessons Learned

The following are considerations I would take in future projects:

  • Intentional design rooted in essential theories of adult and digital learning results in compelling training.
  • A progress bar helps learners schedule their training.
  • Collecting feedback early saves time and fosters learner engagement.
  • Consider accessibility from the start of design.

Next Steps

I need an assessment plan next. The following are suggestions to address the four levels in Kirkpatrick's Model.

  • Use a Google Form survey to collect data on to how relevant, engaging, and useful learners found the training.
  • Use a quiz that asks learners to evaluate the quality of several learning intentions and success criteria, as well as create an example of each from a given standard.
  • During routine observations, principals note what learning intentions and success criteria teachers used. They should also make note of whether they observe the other actions of teachers with clarity.
  • Examine the i-Ready assessment in the spring to determine if the measurable goal was achieved.

Need design fueled by learning theory?

Let's Connect