Home - adith-suresh95/Test-Project GitHub Wiki

Welcome to the Test-Project wiki! SRS Doc - MVP: Part1 Document Version History: Doc Version Date Updated by Description Status Doc 1.0 05 Apr 2021 Adith Suresh, Business Analyst Scope & use cases defined by creating mockup screens with the explanations for MVP Part 1 IN PROGRESS • 1. Overview • 2. User types for MVP o 2.1 Individual Teachers o 2.3 Students • 3. Scope & Features for MVP Part:1 o 3.1 Landing Website o 3.2 Individual Teacher Portal  3.2.1 Teacher Sign Up  Step 1 - Basic Info  Step2 - Email Verification  3.2.2 Teacher Login  3.2.2.1 Forgot Password - Reset Password  3.2.3 Menu: Courses (Landing Page)  3.2.3.1 Courses: Empty Grid (First time landing page)  3.2.3.2 Courses: Grid with Data  3.2.4 Create New Course  3.2.4.1 Courses › Create New (Vacant fields)  3.2.4.2 Courses › Create New › Add Students › Popup Tab: Invite new students  3.2.4.3 Courses › Create New › Add Students › Tab: Add from 'My Students'  3.2.4.4 Courses › Create New (when Fields are filled)  3.2.5 Course Detail Pages  3.2.5.1 Courses › Tab: Course Details  3.2.5.2 Course Roaster  3.2.5.2.1 Courses › Tab: Course Roster (◉ Enrolled)  3.2.5.2.2 Courses › Tab: Course Roster (◉ Invited & Not Accepted)  3.2.5.2.3 Courses › Tab: Course Roster (◉ Suspended)  3.2.5.3 Courses › Tab: Student Requests for Enrollment (Default view)  3.2.5.3.1 Courses › Tab: Student Requests for Enrollment (When ☑ Approved & Declined)  3.2.6 Account Settings  3.2.7 Change Password o 3.3 Student Portal  3.3.1 Student Sign Up  3.3.1.1 Signup from Landing Website, Step1: Basic Details  Signup from Landing Website, Step2: Email Verification  3.3.1.2 Signup by clicking received Mail  3.3.1.3 Login by clicking received Mail  3.3.2 Menu: My Courses (Landing Page)  3.3.2.1 My Courses: Empty Grid (First time landing page)  3.3.2.2 My Courses › Tab: Request Received (Default)  3.3.2.3 Popup for Request sent  3.3.2.4 Courses › Tab: Request Sent  3.3.3 Account Settings  3.3.4 Change Password o 3.4 General Popup screens  3.4.1 Confirmation Popup  3.4.2 Discard Popup  3.4.3 Logout Popup • 4. Conclusion 1. Overview This document will explain the feature that is considered for the MVP Part 1 version of the Student Peer Review Application. The full-fledged version of this application will work in a SaaS model, but in the current MVP version, we will restrict the user permissions from the back-end only. That is, there will not be any SaaS Admin panel to handle the Subscription Packages for the MVP version. The MVP version of this application will be not responsive for mobile and tablets, as of now, we have only considered the PC web resolutions. 2. User types for MVP The MVP version of this application mainly consists of 2 user types, they are Individual Teachers and Students. The properties of each user type are explained below. 2.1 Individual Teachers The Individual teachers are the users who signup and purchase this application from our website and they can perform many activities like course creation, enrolling students, assessment creation and assigning peer review, etc. The teacher user needs to opt for a subscription pack to use this application, therefore the total number of courses, students, assessments will be based on that subscription pack that the teacher has opted for. In the MVP version, the teachers can take a free trial with limited features which will be defined later. 2.3 Students Student users are the users who take assessments and perform peer reviews in this application. This application is completely free for Student users. The student users can access this application directly from our website by clicking the button “I’m a Student“ and they can also access this application by clicking the invitation mail that is sent by the teacher (only if the teacher has invited this student). 3. Scope & Features for MVP Part:1 The features of this MVP version have been split into 4 sections they are the Landing website, Teacher portal, Student portal, and the General popup screens which are explained below. 3.1 Landing Website This is the landing/official website of this application (say: www.studentspeerreview.com) in which the teacher and students can signup for our application. This would be a single-page website for the MVP version and the website will not be having any scrolling down option. The functionalities of this website as follows: Button “I’m a Teacher“: To signup as a Teacher. Button “I’m a Student“: To signup as a Student. Button “Login”: To login as a student or a teacher. Connect with Us: Just a view-only email ID for any inquiries.

3.2 Individual Teacher Portal This is a portal exclusively for individual teachers. Individual teacher portal is made for the Individual teachers and the School version will be handled separately in the School portal in the future. In the MVP version, there won't be any subscription packages, the application would be completely free for the beta testing purpose. 3.2.1 Teacher Sign Up The Individual teacher can signup for this application by clicking the button “I’m a teacher“, the teacher will get a page to enter basic details as shown below. Step 1 - Basic Info This is Step 1 of the Signup procedure and on this page, the teacher can enter the Basic Information as shown in the below mockup screen.

Step2 - Email Verification This is step 2 of the Signup procedure, where the teacher user will receive an email verification and that can be entered here. Other functionalities of this page are: Resend Verification code: The system will resend a mail with a code and the previous code will get abandoned. Change email: The system will get redirected to Step 1 of Signup.

3.2.2 Teacher Login This is the login screen for the teacher as well as students, any users can access this screen from the landing website by clicking the button “Login“. After login, the user gets redirected to the Menu: Courses (landing page). Don’t have an Account: The system will redirect to the Signup page. Forgot Password: Option to reset password

3.2.2.1 Forgot Password - Reset Password The system will redirect to this page if the user clicks on the button ‘Forgot Password?'. Here the user can reset the password by entering the registered email ID and clicking the button ‘Send Reset Link’. So that, the system will send a link to reset the password to that email ID. The user can click on the received link so that a Popup will appear to enter the New Password & Confirm New Password. This way the user can reset the password in our application. Also, the system will show an ‘Invalid toaster message’ if the entered email ID is not registered with our system.

3.2.3 Menu: Courses (Landing Page) Once the Signup procedure is done, the system will redirect the teacher user to the landing page of this application that is Courses. More details about the Menu “Courses” have been explained below. 3.2.3.1 Courses: Empty Grid (First time landing page) This is the initial look of the Courses menu, here the grid is empty because of no data.

3.2.3.2 Courses: Grid with Data This is the view of Grid when the data is loaded after creating courses. The major functionalities of this page are: Button 'Create New Course': To create a new course. Dropdown 'Active/Inactive': To toggle the grid with Active and Inactive courses. According to the selection, Corresponding data will be shown. Search bar: To search and find a course by inputting any course details. Data Grid functionalities: Option to Copy Course ID: To copy the course and share it with anyone. Sort Columns▴▾: To sort the columns alphabetically ascending and descending or sort the Date. Info buttons ⓘ : A tooltip will display the information regarding that column. Action Buttons: The action buttons included in this grid are: View/Edit Course: System will redirects to Courses > Detail Page > Tab: Course Details View/Modify Student Roster: System will redirects to Courses > Detail Page > Tab: Course Roster View/Process Student requests: System will redirects to Courses > Detail Page > Tab: Student Requests for Enrollment Manage Assessments: The system will redirect to the Assessment menu. Delete Course: A popup will ask the confirmation to delete the course.

3.2.4 Create New Course The teacher can create a new course by clicking the button “Create New Course“ from the Menu: Courses. 3.2.4.1 Courses › Create New (Vacant fields) Once the button “Create a new course“ has been clicked, the system will redirect to a screen as shown in the below mockup and here the teacher user can enter the course details.

Major attributes of this screen are: System generated Course ID: It is a system-generated Course ID (Unique ID). Copy Button: Option to copy the unique Course ID. By clicking the button 'Copy' the system will copy the Course ID to the clipboard in a text format as shown below. ________________________________________ Course ID: C10181 Logon to www.studentpeerreview.com and enter the above Course ID to access the Course: Grade:9 Chemistry that is created by Alana Abraham. ________________________________________ Button 'Add Students to the Course': A popup will appear to invite students to this course. Mandatory Fields: Only 'Course title' is mandatory here. 3.2.4.2 Courses › Create New › Add Students › Popup Tab: Invite new students The user will get this popup by clicking the button ‘Add Students to the Course'. Here the tab ‘Invite New students' will be selected as default, and the user can enter/copy-paste email IDs to this field. Button 'Import': To import email IDs from CSV, Excel, Word, and Text files. Button 'Add to list': To add the inputted email IDs to the previous screen.

3.2.4.3 Courses › Create New › Add Students › Tab: Add from 'My Students' This is another tab so that the teachers can invite students from other courses as well. Initially, this grid will be empty because of no course and students.

3.2.4.4 Courses › Create New (when Fields are filled) Once the students are selected or email IDs are added for inviting, the system will get back to the same page as shown in the below mockup screen.

All the selected students and the inputted email IDs will be displayed over here as shown in the above screen. Duplicate students will be highlighted here in 'Red Border' with a tooltip as shown above. Button 'Create': The new course will be created by clicking the 'Create' button. If the students are added for enrolling, the system will send an Invitation request as well as a mail to each student mentioned in the list. So that the students can accept/decline this request from the student portal. The students who do not have an account in our application can create an account by clicking on the Invitation mail that is sent by the teacher. 3.2.5 Course Detail Pages This is the single page where we can handle many functions regarding a Course. This page can be accessed by clicking the Actions buttons from the ‘Menu: Course’ which is already explained above. 3.2.5.1 Courses › Tab: Course Details This is the Detail page where the Tab: Course Details will be displayed when the button 'View/edit course' has been selected from the Action button. Here the user can perform many functionalities such as: Copy button: Button to copy Course Code Edit button: To enable edit mode, so that all fields become editable. The 'Save Changes' button will get enabled on this mode in order to save the edited data. Delete button: To delete the course. A confirmation popup will also appear before deleting. Active toggle button: To make the course inactive and to activate it again. Assessments button: This button will pop up into 2 other buttons, they are ‘View Assesments' & 'Create -New Assessments. These buttons will get redirect to the Menu: Assessments (it will be explained in MVP Part2). Save Changes button: This button will get enabled only when the Edit mode is activated. This button will save the edited data to the database. By default, this button will be disabled if not in the edit mode.

3.2.5.2 Course Roaster This is another tab of this page, which is Couse Roaster. Here the user can view all the enrolled students, invited and not accepted students, and the suspended students. 3.2.5.2.1 Courses › Tab: Course Roster (◉ Enrolled) In this tab, the radio button 'Enrolled' will be selected by default. This page will display all the enrolled students of that particular course. There are other options here they are: The field that displays Course: This field will display which course’s roster is showing now.

Button Icon 'Invite more students': To invite more students to this Course.

Selected students: Displayed the total number of students enrolled and the total number of selected students by checking the checkboxes as shown in the below screen.

Search bar: To search a student by entering first name or last name Dropdown filter in the grid: To filter the grid by the status Enrolled via: ‘Course ID', ‘Invitation’ & 'Both’.

Action buttons: Suspend Students: To suspend a student from the enrolled course. Remove Students: To remove a student permanently from the course. So that, this student will get removed from all the assessments and peer reviews that are assigned. Also, that particular course and everything associated with that course will get removed in the Student Portal as well.

3.2.5.2.2 Courses › Tab: Course Roster (◉ Invited & Not Accepted) Here in the same tab, the radio button ‘Invited & Not Accepted' is selected. Therefore, this page will display all the invited students that are not accepted the request yet. There can be chances like the student does not have an account in this application, those students will be highlighted in the list with 'Red’ as shown in the below mockup screen. The first name, last name, and student ID will empty for the students who do not have the account in our application.

Other attributes of this screen are: Filed to display Course: This field will display which course’s roster is showing now. Button Icon 'Invite more students': To invite more students to this Course. Selected students (2/12): Displayed the total number of students enrolled and the total number of selected students by checking the checkboxes as shown in the below screen. Search bar: To search a student by entering first name or last name Dropdown filter in the grid: To filter the grid by Invitation status: ‘No Account', ‘Not Accepted’ & 'Both’. Action buttons: Resend Invitation Mail: To resend the invitation mail to students who do not have the account in our application. This button will only get enabled for the students who do not have an account in our application. 3.2.5.2.3 Courses › Tab: Course Roster (◉ Suspended) Here in the same tab, the radio button ‘Suspended' is selected. Therefore, this page will display all the suspended students here.

Other attributes of this screen are: Filed to display Course: This field will display which course’s roster is showing now. Button Icon 'Invite more students': To invite more students to this Course. Selected students (2/12): Displayed the total number of students enrolled and the total number of selected students by checking the checkboxes as shown in the below screen. Search bar: To search a student by entering first name or last name Dropdown filter in the grid: To filter the grid by Invitation status: ‘No Account', ‘Not Accepted’ & 'Both’. Action buttons: Re-enroll Students: To re-enroll the suspended students back to the enrolled list. Remove Students: To remove a student permanently from the course. 3.2.5.3 Courses › Tab: Student Requests for Enrollment (Default view) This is the Tab: Student Request for Enrollment, in which the teacher can view all the requests sent by the students for joining different courses. Here the teacher can Approve/Decline the requests by selecting the students by checking the checkboxes as shown in the below mockup screen.

Other attributes of this screen are: Button ‘Approve' & 'Decline’: To approve or decline the student requests. Search Bar: To search a student by entering the first name and last name. 3.2.5.3.1 Courses › Tab: Student Requests for Enrollment (When ☑ Approved & Declined) This screen will show the result when the checkboxes for ‘Display students whose requests were: ☑ Approved & Declined' are ticked. By checking this option, the teacher can view which all students are Approved and Decline with the Approved/Declined date. The approved request will be highlighted in ‘Green’ and the Declined requests will be highlighted in 'Red’ as shown in the below mockup screen.

3.2.6 Account Settings This page can be accessed from the dropdown that appears at the top-right corner as shown in the below mockup screen. Other attributes of this field are: Edit First name & Last name: This is the option to Edit the Teacher’s first name and the last name. Teacher ID: System will display the unique teacher ID. Delete Account: This is the option to permanently delete the account from this application.

3.2.7 Change Password This is the option to change the existing password by creating a new password.

3.3 Student Portal This is an exclusive portal for the students and it is completely free for them. Student users can signup to this application by two methods, they are: Signing up directly from the official/landing website and Signing up by clicking the Invitation mail that is sent by the teacher. 3.3.1 Student Sign Up 3.3.1.1 Signup from Landing Website, Step1: Basic Details The student can signup to this application by clicking the button “I’m a Student“, then it will get redirected to the Signup page. This is Step 1 of the Signup procedure and on this page, the student can enter the Basic Information as shown in the below mockup screen.

Signup from Landing Website, Step2: Email Verification This is step 2 of the Signup procedure, where the student user will receive an email verification code and that can be entered here. Other functionalities of this page are: Resend Verification code: The system will resend a mail with a new verification code and the previous code will get abandoned. Change email: The system will get redirected to Step 1 of Signup.

3.3.1.2 Signup by clicking received Mail The student can also signup for this application by clicking the invitation mail that is sent by the teacher. Mail format: This is the Invitation mail format. The user can click on the button 'Click here to join' to Signup/login into this application as shown below.

By clicking the mail, the system will redirect to the Signup page if the invited user’s email ID does not exist in our system, or else the system will redirect to the Login page by pre-populating the Email ID as shown in the below mockup screens.

3.3.1.3 Login by clicking received Mail If the user’s email ID already exists in our application, the system will redirect to the login page by prepopulating the Email ID as shown in the below mockup screen.

3.3.2 Menu: My Courses (Landing Page) My courses are the landing page for the student users for the MVP version. 3.3.2.1 My Courses: Empty Grid (First time landing page) This is the initial look of the My Courses menu, here the grid is empty because of no data.

3.3.2.2 My Courses › Tab: Request Received (Default) This is the data-rich view of the Menu: My courses, here there are many requests that are pending to accept/decline by the student. Here, by default the Tab: Request received will be selected.

The major attributes of this screen are: Join a new course with Course ID: This is the option for the students to enter the Course ID and send the request to the respective teacher. Request Received Tab: Tab that displays all the request which was sent by different teachers. Button Accept/Decline: The Student can enroll in the invited courses by clicking the ‘Accept' button and also they can decline the request by clicking the 'Decline’ button. Enrolled Courses: Courses in which the student enrolled. Course Creation filtering: Option to filter the courses on the basis of teachers. Search Course: Search a course by entering course details like Course name or Course creator name. Cards listing enrolled courses: The cards that show the details of the enrolled courses. 3.3.2.3 Popup for Request sent This popup will appear once the request is been sent to joining a course.

3.3.2.4 Courses › Tab: Request Sent This is the user interface when the user clicks on the Tab: Request Sent.

The major attributes of this screen are: Request Sent Tab: Tab that displays all the request which was sent by the student user for joining different courses. Button ‘Cancel Request’: This is the option to cancel a request that is sent by the student. 3.3.3 Account Settings This page can be accessed from the dropdown that appears at the top-right corner as shown in the below mockup screen. Other attributes of this field are: Edit First name & Last name: This is the option to Edit the Student’s first name and the last name. Student ID: System will display the unique Student ID. Delete Account: This is the option to permanently delete the account from this application.

3.3.4 Change Password This is the option to change the existing password by creating a new password.

3.4 General Popup screens 3.4.1 Confirmation Popup This is the confirmation popup user interface that can be used in many scenarios like removing a student, Suspending students, Deleting a course, etc.

3.4.2 Discard Popup This is the Discard popup user interface that can be used in many scenarios like exiting the page without saving, switching the menu tab before saving, etc.

3.4.3 Logout Popup This is the Logout popup user interface. The user can log out from this application by clicking the top-right dropdown and by clicking the button 'Logout'. Once that is done, this confirmation popup will appear.

4. Conclusion This document has covered the MVP features for Part 1 of the Student Peer Review application. The later parts of the MVP will be discussed soon and we could either accommodate those features in this document itself or else we can create a separate document for the MVP Part 2, Part 3, etc.

⚠️ **GitHub.com Fallback** ⚠️