Lessons | SEL and Mental Health

Overview

The new design of the Lesson Library is aimed at providing users with an intuitive, efficient, and flexible way to access Social Emotional Learning (SEL) and Mental Health lessons and activities (modules). The library will feature advanced search capabilities, tagging, filtering, and bulk action tools to enhance user experience.

Figma:

https://www.figma.com/file/O0FDJoUbCHKQGlk3Wqq9ND/Teacher-UI?type=design&node-id=1%3A19485&mode=design&t=JPhiIb9fGojtlxuO-1

Epic:

Feature 194000: Lessons

UI Description

  1. Lesson Library Layout:

    • The library interface will prominently feature a toggle to switch between viewing lessons and activities (modules).

    • Content Library Selection:

      • Labels for SEL-SEL product: SEL

      • Labels for SEL-Wellness product: Wellness

      • Labels for SEL-Life Skills and Wellness: Life Skills and Wellness

      • Mental Health

    • Each Lesson will display as a Lesson card in the Lesson Library list

      • Lesson cards display thumbnail, title, tags, Details button, Assign button, kabob menu

    • Lessons will display tags as chips, offering quick insights into their content at a glance.

      • Grade

      • Domain

      • Main Topic (SEL only)

      • Tier

      • Duration

  2. Filtering Options:

    • Filters for SEL and Mental Health content are accessible in both the Lesson and Activities (Modules) view.

    • A tier dropdown menu allows users to filter content by "All Tiers," "Tier 1," "Tier 2," and "Tier 3."

  3. Navigation and Action Buttons:

    • A "Details" button on each lesson card navigates to the Lesson Overview page, with a "Back to Lesson Library" option for easy return.

    • An "Assign" button triggers a modal for selecting materials and students for the assignment.

    • A three-dot kabob menu provides options to Print, Download, and Add to Playlist for individual lessons.

  4. Bulk Action Toolbar:

    • Upon selecting more than one lesson, a blue bulk action toolbar appears and remains sticky as the user scrolls.

    • The toolbar offers a dropdown menu for bulk actions: Assign Selection, Print Selection, Download Selection, and Add Selection to My Playlist, with a "Go" button to execute the selected action.

  5. Search Bar Functionality:

    • The search bar supports text queries to find lessons based on titles, descriptions, keywords, and Standard Codes, with autocomplete suggestions.

    • Search results are optimized to appear within 2 seconds under normal load conditions.

Workflow Description

  1. Toggling Between Content Types:

    • Users begin by selecting their desired view (Lessons or Activities-modules) via the toggle, adjusting their library view accordingly.

    • Users select which Content Library to view

      • Default selection will be the first in the list. Users will only view content that is allocated to their account.

      • Labels for SEL-SEL product: SEL

      • Labels for SEL-Wellness product: Wellness

      • Labels for SEL-Life Skills and Wellness: Life Skills and Wellness

      • Mental Health

  2. Utilizing Filters and Tags:

    • To refine their search, users apply filters, dynamically updating the library to display relevant content.

  3. Accessing Lesson Details:

    • Clicking on a lesson's "Details" button, users are taken to an in-depth overview, with an option to navigate back to the library.

    • Upon returning to the Lesson Library, all previously selected filters should remain selected.

    • Upon returning to the Lesson Library, user should land on the Content Library they had been viewing and the Lesson/Activities toggle that was previously selected

  4. Assigning Content:

    • The "Assign" action opens a modal where users select specific materials and assign them to students, streamlining the distribution process.

  5. Performing Bulk Actions:

    • By selecting multiple lessons, users activate the bulk action toolbar, choosing from Assign Selection, Print Selection, Download Selection, and Add Selection to My Playlist options for efficiency.

  6. Searching for Content:

    • Users enter search queries to find lessons based on titles, descriptions, keywords, and Standard Codes, with autocomplete suggestions.

    • Search results are optimized to appear within 2 seconds under normal load conditions.

Conclusion

These requirements outline the vision for the new Lesson Library design, emphasizing user-friendly navigation, advanced search and filtering capabilities, and efficient tools. The Lesson Library will provide accessible resources for educators to manage and access SEL and Mental Health content effectively.