Page Comparison

...

The ‘Done’ screen in the “Create Check-In, Check-Out Tool” notifies the user that the setup process is complete. The user is shown a success message indicating that the tool is ready to use, along with options for entering or printing data.

Figma

https://www.figma.com/design/6tpmUIqjsH6mk6mQ7ifeEG/Checkin-Checkout?node-id=6131192-310325863&t=P5idHtBeXVasdM9xVAOkjK77OOKaZY8k-1

Feature

Project 223101: MTSS Feature 224933: Create/Edit | Check In / Check Out

User Story

As a user, I want a clear confirmation screen after setting up the Check-In/Check-Out tool so that I can immediately start tracking student progress and access relevant data tools.

...

1. Page Heading: "Create Check-In, Check-Out Tool"

2. Status Chip: Display Status of the tool as a Status Chip next to the page heading

   • Active

   • Archived

   Student Name Display: The student's

   • Mastered

3. Goal(s) and Student Summary:

   • Display container divided into two sections: Goal(s), Student

   • Goal(s): Display ‘Goal(s)’ header and the goal(s) added to the Check-In/Check-Out tool, the list separated by commas when more than one goal is added

   • Student: Display student’s first and last name

   is shown below the heading

   • to ensure the user knows which student they are configuring the tool for

   .

   Step Indicator:

   • Current Step displays as dark grey in the indicator. The indicator displays the other step as light grey.

   • Behaviors pill container

   • Data Settings pill container (current step)

4. Step Tracker: The step tracker displays the user’s progress across three steps: Collection, Goals & Mastery, Done. This guides the user through the data settings process.

   • ‘Collection’, ‘Goals & Mastery’, and ‘Done’ display in RethinkEd primary blue with a checkmark in the step circle

5. Success Message: ‘Success! You are ready to start tracking Check-In, Check-Out.'

6. Description body text:

   • Line 1: If you have data to enter now, you can ‘Record Data’.

     • ‘Record Data’ is a link that navigates the user to the Data Express CICO page to record data for the CICO tool.

   • Line 2: If you need a physical sheet for your student, you can Print a Data Sheet.

     • ‘Print a Data Sheet’ is a link that opens a the ‘Create Data Sheet’ modal for the user to print a data sheet – a blank template or pre-filled template from the created CICO tool.

       • ‘Create Data Sheet’ modal defaults to open with ‘Select’ radio button selected and the specific CICO tool selected in the list of CICO tools

7. Navigation Buttons:

   • Back Button: Navigates back to the Goals & Mastery page.

   • Close Button: Navigates the user to the Student Dashboard > Behavior Support > Check In Check Out screen.

8. Action Buttons:

   • Print Data Sheets: Opens a modal to print either blank or pre-filled data sheets.

   • Record Data: Takes the user to the Data Express CICO page to enter student data.

   • View Data: Navigates user to Data Express > View Data and displays the recorded data for the student.

   • Change Status: Allows the user to change the status of the CICO tool

     • Archive

     • Delete

     • Make Active (Only if tool is in Mastered or Archived Status)

9. Discussion Panel:

   • EDU Platform screen they were viewing. The new Check-In/Check-Out tool will be added to the tables for Check-In/Check-Out across the platform for the student.

10. Close ( X ) Button:

    • Saves the Check-In/Check-Out Tool in the current status and closes the create modal screens, returning the user to the main screen they are viewing on the EDU Platform.

    • Close Hover State: Display ‘Save & Close’ badge upon hover over the close modal button.

11. Discussion Panel:

    • Discussion Icon:

      • Default: Discussion icon is deselected and discussion panel is closed (collapsed)

      • Discussion Icon Enabled State: Display icon as primary blue with light blue circle background

    • The modal width responsively expands and the discussion panel displays to the right side of the modal, allowing users to type messages and communicate with added team members.

    • The discussion panel should include a text area input field that expands as the user types and a 'Send' button for messaging.

      • Team members added to the discussion will receive a ‘Discussion’ inbox notification.

    • User will be able to add team members or admin to the discussion and send discussion messages. (Utilize Existing Discussion Panel functionality)

...

1. Record Data Link: The ‘Record Data’ link in the description body text should be clickable and must navigate the user to Data Express > CICO tab with the specific CICO tool selected and displayed on the screen.

2. Print Data Sheet Link https://rethinkautism.atlassian.net/l/cp/0nJ01cSJ : The ‘Print Data Sheet’ link in the description body text should open the Print Data Sheet modal when selected, allowing the user to print either a blank template or pre-filled template for the CICO data sheet.

   • Verify that the default selection is ‘Select’ with the specific Check-In/Check-Out tool pre-selected when the user selects ‘Print Data Sheet’ button link.

3. Navigation Buttons:

   • The "Back" button takes the user to the previous screen. If the user has not yet recorded data for the ‘Active’ CICO Tool, they should be able to make changes/edits to the input fields.

   • The "Close" button will exit to the student dashboardthe screen the user is viewing.

4. Action ButtonsModal Closure:

   • Print Data Sheets:

     Verify that the

     The user can

     open

     close the modal using the '

     Create Data Sheets' modal to print either blank or pre-filled data sheets and the number of pages to print. Verify that the 'Print Data Sheets' button is active for a

     X' icon in the top right corner.

   • The Check-In/Check-Out tool

     in Active, Mastered, or Archived statuses. Verify that the 'Print Data Sheets' button is inactive for a

     will be saved in the current status and all progress will be saved. Upon opening the Check-In/Check-Out tool

     in Draft Status. 

     Record Data:

   • Verify that the 'Record Data' button is active for a Check-In/Check-Out Tool that is in Active Status

   • Verify that the 'Record Data' button on an Active status Check-In/Check-Out tool navigates the user to Data Express on the Check-In/Check-Out tab with the specific Check-In/Check-Out tool displayed on the screen. 

   Verify that the 'Record Data' button is inactive for a

   again, the user will view all details they had previously input.

   • Verify that the Close Hover State displays ‘Save & Close’ badge upon hover over the close modal button.

5. Discussion Panel:

   • Verify that the Discussion Icon and Discussion Panel display on the Setting, Goals & Mastery, Done modal screens for Check-In/Check-Out tool

     in the

     statuses

     :

     of Draft,

     Mastered

     Active, Archived

     View Data:, and Mastered. 

     • Default: Discussion icon is deselected and discussion panel is closed (collapsed)

     • Discussion Icon Enabled State: Display icon as primary blue with light blue circle background

   • Verify that

     the 'View Data' button is inactive until at least one data entry is recorded for the Check-In/Check-Out tool 

     • This logic applies to all statuses: Draft, Active, Mastered, Archived

   • Verify that the 'View Data' button is active when at least one data entry has been recorded for the Check-In/Check-Out tool

     • This logic applies to statuses: Active, Mastered, Archived

   Change Status:

   • Change Status button options when Check-In/Check-Out tool is Active or Draft Status:

     • Header: 'Status Change'

     • Description: 'Please select status'

     • Radio button options:

       • Archive (Labels tool as Archived status)

       • Delete (Permanently removes the Check-In/Check-Out tool from the platform)

   Change Status button options when

   upon selecting the Discussion Icon, the modal width responsively expands and the discussion panel displays to the right side of the modal.

   • Verify that deselecting the discussion icon, closes (hides) the discussion panel.

   • Discussion Panel Layout:

     • Header: 'Discussion' 

     • Default: Display 'Me' for the team member who is viewing the Check-In/Check-Out tool is Archived Status:

       • Header: 'Status Change'

       • Description: 'Please select status'

       • Radio button options:

         • Delete (Permanently removes the Check-In/Check-Out tool from the platform)

         • Make Active (Labels the tool as 'Active' and user is able to record data and view data)

       Change Status button options when Check-In/Check-Out tool is Mastered Status:

     • Header: 'Status Change'

     • Description: 'Please select status'

     Radio button options:

     • Archive (Labels tool as Archived status)

     • Delete (Permanently removes the Check-In/Check-Out tool from the platform)

     Make Active (Labels the tool as 'Active' and user is able to record data and view data)

     • User selects 'Add' button to:

       • Search for a team member by first or last name to add to the discussion 

       • Select team members from the dropdown menu of team member names to add to the discussion 

     • Verify that when a user selects a team member to add to the discussion, the team member first and last name displays to the right of 'Me'. 

     • Verify that an 'X' icon displays next to an added team member name so that the user can remove them from the discussion. 

     • Verify that the discussion panel includes a text area input field that expands as the user types

     • Verify that upon selecting 'Send' button, the team members added to the discussion receive a 'Discussion' inbox notification. 

Workflow Description

1. Step 1 (Behaviors ScreenBehavior Goals): The user begins setting up a Check-In, Check-Out tool by defining the student’s behaviors behavior goal(s) for CICO tracking. Once behaviors behavior goal(s) are set, the user clicks “Continue” “Next” to proceed to the Collection Settings modal screen (Step 2).

2. Step 2 (Collection Settings Screen):

   • The user selects a score range (e.g., 0–2 or 1–3).

   • The user selects the number of time periods (1–15) they wish to track.

   • For each time period, the user enters a label (e.g., Math, Lunch, etc.).

   • The user can go back to the previous screen by selecting “Back.”

   • The user can save their progress and exit by selecting “Save & Exit,” which stores the tool as a draft and navigates back to the student dashboard.

   • After inputting all required settings, the user clicks “Continue” to move to the next screen, where they will set "Goals & Mastery" (Step 3).

3. Step 3 (Goals & Mastery Screen): The user continues to configure the tool by setting a daily goal, weekly goal, and mastery criteria for the CICO tool.

4. Step 4 (Done): The user navigates to the ‘Done’ screen and views the success message that confirms the CICO setup is complete. The screen allows users to Record Data or Print Data Sheets.