Note:

If you want to create a new page for developers, you should create it on the Moodle Developer Resource site.

Advanced Forums Accessible Display Specification

From MoodleDocs
Revision as of 07:18, 25 July 2013 by Rex Lorenzo (talk | contribs) (Fixed incorrect (I assume) wording.)

Visioning

Overview

The Moodle forums is not as accessible as it could be. In order to improve usability of forums for those with disabilities Moodlerooms will enhance advanced forums to display discussions based on EASI: Equal Access to Software & Information’s accessible forum design.

Business Goals

  1. Progress towards NFB Certification
  2. Keep strategic clients
  3. Improve sales for prospects with high accessibility requirements.

Product Goals

  1. Increase the accessibility of forum discussion display
  2. Increase usability of forums

Business References

  • University of Montana (UofM)
  • National Federation of the Blind (NFB)
  • Department of Education

Scenarios

Administrator Sets Advanced Forums as the Forums for All Forums on a Site

The administrator needs to force all forums to be created as advanced forums to meet the institutions accessibility policy. To do this the administrator sets all news forums to be created as advanced forums and disabled each roles capabilities to create forums.

Teacher Restricts Number of Replies

In order to keep forum conversations on topic the teacher wants to keep the depth of replies to a minimal. After a number of replies a user will not be able to create a reply to a reply.

A Visually Impaired Student Listens to Posts in a Course Forum

A student needs to review the new posts that students and students have posted to their course forums. Using a screen reader the student accesses the forum and listens to the replies that have been made in the forum.

A Visually Impaired Student Replies to a Post in a Course Forum

A student wants to reply to a discussion made by the student. Using a screen reader the student navigates to the discussion and hits return when they find the reply link. The student is then placed in a text editor to create their reply. The student then saves the reply by navigating to the post button.

A Visually Impaired Student Sorts Forum Discussions

A student wants to sort the discussions by which have the newest posts in order to understand what the latest changes are to the forum. The student navigates to the sort using a screen reader and hits enter when they have found the sort by newest post.

References

Jira

Technical

Feature Information

Advanced Forums Site Settings

Description

Advanced forums will allow administrators to set the default forum display (renamed from discussion display) for all users. Advanced forums will also allow a site administrator to set the default maximum reply depth.

Requirements
  1. Rename Discussion display to Forum display in advanced forums display types.
  2. A new checkbox administrative settings called Create news forums as advanced forums will be added to the activity’s administrative settings page. See Mockup: Advanced Forum Administrative Settings
  3. The default value for the Create news forums as advanced forums is unchecked aka no.
  4. A new select box administrative settings called Default forum display will be added to the activity’s administrative settings page. See Mockup: Advanced Forum Administrative Settings
  5. The default value for the Default forum display is default
  6. The possible values for the Default forum display will be:
    1. Accessible
    2. Default
    3. Nested
    4. Tree
  7. A new administrative settings called Maximum reply depth will be added to the activity’s administrative settings page. See Mockup: Advanced Forum Administrative Settings
  8. The default value for the Maximum reply depth will be 3. See Mockup: Advanced Forum Administrative Settings
Mockups
Advanced Forum Administrative Settings

afAdminSettings.png

Use Cases
Administrator Sets Default Forum Display

Description

The administrator sets the default forum display to accessible.

Preconditions

  1. The user is logged in
  2. The user is assigned as a site administrator
  3. The user is at the site level

Steps

  1. The administrator clicks on the Plugins link group under the Settings block
  2. The administrator clicks on the Activity modules link group
  3. The administrator clicks on the Advanced forums link
  4. The administrator selects Accessible from the Default forum display select box
  5. The administrator clicks the Save changes button

Postconditions

  1. the settings are saved
Administrator Sets the Site to Create all News Forums as Advanced Forums

Description

The administrator sets the site to use advanced forums for all newly created news forums.

Preconditions

  1. The user is logged in
  2. The user is assigned as a site administrator
  3. The user is at the site level

Steps

  1. The administrator clicks on the Plugins link group under the Settings block
  2. The administrator clicks on the Activity modules link group
  3. The administrator clicks on the Advanced forums link
  4. The administrator clicks the checkbox to the left of Create all new forums as advanced forums
  5. The administrator clicks the Save changes button

Postconditions

  1. The settings are saved
Administrator Sets the Default Maximum Reply Depth

Description

The administrator sets the default maximum reply depth for all newly created forums to be 1.

Preconditions

  1. The user is logged in
  2. The user is assigned as a site administrator
  3. The user is at the site level

Steps

  1. The administrator clicks on the Plugins link group under the Settings block
  2. The administrator clicks on the Activity modules link group
  3. The administrator clicks on the Advanced forums link
  4. The administrator enters 1 in the text box to the right of the Maximum reply depth setting.
  5. The administrator clicks the Save changes button

Postconditions

  1. The settings are saved.
Administrator Creates a Course With an Advanced Forums News Forum

Description

The administrator creates a course with a news forum. The news forum is created as an advanced forum.

Preconditions

  1. The user is logged in
  2. The user is assigned as a site administrator
  3. The advanced forum setting create news forums as advanced forums is checked.
  4. The user is at the site level

Steps

  1. The administrator clicks the Courses link group
  2. The administrator clicks the Add/edit courses link
  3. The administrator clicks the Add a new course button
  4. The administrator fills out the course information
  5. The administrator clicks the Save changes button

Postconditions

  1. The news forum created for the course is an advanced forum.

Advanced Forum Accessible Settings

Description

A new setting will be added to the create a forum screen that will allow the student to restrict the maximum depth of replies for a discussion.

Requirements
  1. A new setting will be added to the create a forum screen under the general group called maximum reply depth. See Mockup: Advanced Forum Depth Setting
  2. The default value for the maximum reply depth will be 3
  3. The maximum reply depth will be 7
  4. Once the reply depth in a discussion reaches maximum reply depth the a student will not be able to reply to the reply. See Mockup: Maximum Reply Depth Display
  5. When a teacher creates a reply to the maximum depth reply the reply will be marked automatically as a private reply.
  6. A teacher will be unable to uncheck the private reply checkbox for a reply to a reply at the maximum reply depth. See Mockup: Teacher Reply to a Maximum Depth Reply
Mockups
Advanced Forum Depth Setting

afMaxDepthSetting.png

Maximum Reply Depth Display

afMaxReplyDepthDisplay.png

Teacher Reply to a Maximum Depth Reply

afMaxReplyPrivateReply.png

Use Cases
Teacher Creates a Forum with a Maximum Reply Depth of 2

Description

The student wants to limit the reply depth to 2 to keep the students on track with the forum discussion.

Preconditions

  1. The user is logged in
  2. The users is assigned the student role in the course
  3. The user has navigated to the course
  4. The course is set to weeks or topics format

Steps

  1. The student clicks on the add activity link
  2. The student selects Advanced forum
  3. The student fills out the forum information
  4. The student selects one from the select box for maximum reply depth

Postconditions

  1. Users cannot reply to a reply or a reply
  2. The student can still create a private reply to a reply of a reply
A Student Views a Reply at the Maximum Reply Depth

Description

A student views a reply that is at the maximum reply depth.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course with a maximum reply depth
  4. The forum has multiple replies with one at the maximum reply depth
  5. The student has navigated to the course

Steps

  1. The student clicks on the forum
  2. The student scrolls to the reply at the maximum reply depth

Postconditions

  1. The student doesn’t see the reply link.
A Teacher Replies to a Maximum Reply Depth Reply

Description

The student wants to create a private reply to the student’s reply even though it is at the maximum reply depth.

Preconditions

  1. The user is logged in
  2. The user is assigned to the student role in a course
  3. An advanced forum has been created in the course with a maximum reply depth
  4. The forum has multiple replies with one at the maximum reply depth
  5. The student has navigated to the course

Steps

  1. The student clicks on the forum
  2. The student scrolls to the reply at the maximum reply depth
  3. The student clicks on the reply link
  4. The student fills out the reply form
  5. The student clicks the Post to forum button

Postconditions

  1. The Private reply checkbox is checked and disabled
  2. The student can’t change the reply to a non private reply.

Private Reply Display

Description

To improve the accessibility of private replies Moodlerooms will add a string to the front of private replies to identify them to the user.

Requirements
  1. Private replies will have the string Private reply: added to the front of the title for the reply. See Mockup: Private Reply Display
  2. The string Private reply will be translatable.
Mockups
Private Reply Display

afPrivateReply.png

Use Cases
Student Views a Private Reply

Description

A student views a private reply from a student in a forum.

Preconditions

  1. The user is logged in
  2. The user is assigned to the student role in a course
  3. The student has created a reply in a forum
  4. A student has created a private reply to the student’s reply
  5. The user has navigated to a course with a private reply in it

Steps

  1. The student clicks on the forum
  2. The student scrolls to view the private reply

Postconditions

  1. The string Private reply shows in front of the title for the reply.

Accessible Discussion Display

Description

The current display options in advanced forums do not maximize the view for those with disabilities. The accessible discussion display will work to implement the prototype of an accessible forum by ESAI. Users will be able to switch between this discussion display and any other discussion display types.

Requirements
  1. A new discussion display mode will be added to the forum display drop down called accessible.
  2. The accessible forum display will be separated into 5 areas (See Mockup: Accessible Display Structure)
    1. Moodle breadcrumb at the top
    2. Filter pane at the top
    3. Forum description (Only shown if set)
    4. Forum and Discussion selection pane on the left
    5. Discussion display pane on the right
  3. Forum management will still be maintained within Moodle’s navigation and settings blocks and accessed via the themes block display.
  4. The breadcrumb will initially display the full moodle path to the forum the user selected within the course. See Mockup: No Discussion Selected
  5. The user will be able to use skip navigation to jump to the forum/discussion pane. See Mockup: Accessible Display Structure
  6. Navigation from the Discussion display pane to the Forum and Discussion selection pane
  7. The access key 1 will be used to move to the focus to the Forum select box
  8. The access key 2 will be used to move the focus to the discussion selection tree view
  9. The F6 key will be used to to switch focus to the next pane of the filter, forum and discussion and the discussion display panes. See Mockup: Accessible Display Structure
  10. The Shift+F6 keys will be used to switch focus to the previous pane of the filter, forum and discussion and the discussion display panes. See Mockup: Accessible Display Structure
  11. When navigating between panes a screen reader will be informed of the region the user has navigated to.
Accessible Display Structure

afAccessibleDisplayStructure.png

No Discussion Selected

afNoDiscussionSelected.png

Use Cases
Student Selects Accessible Forum Display

Description

A student will a visual disability wants to maximize their usability of advanced forums and selects the accessible forum display type.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course with a maximum reply depth
  4. The student has navigated to the course
  5. The student is using a screen reader

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to skip to the main content of the page
  5. The student tabs to the forum display select drop down
  6. The student uses the space button to open the the select drop down
  7. The student uses the arrow keys to highlight the accessible select option
  8. The student hits the enter key

Postconditions

  1. The page reloads
  2. The accessible forum display appears
Student Uses F6 to Navigate Between Panes

Description

A visually impaired user wants to quickly change between the panes in the accessible forum view using the F6 key.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student hits the F6 key

Postconditions

  1. The student is taken to the filter pane
  2. The student is informed they are in the filter region
Student Uses Shift+F6 to Navigate Between Panes

Description

A student wants to navigate back through the panes of the accessible forum display using the shift+F6 key combination.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student hits the Shift+F6 key combination

Postconditions

  1. The student is taken to the discussion display pane
  2. The student is informed they are in the discussion display region
Student Uses Access key 1 to Navigate to the Forum Selection box

Description

A student wants to jump directory to the forum selector to change the forum they are viewing.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student clicks the screen reader’s key combination for the access 1 key

Postconditions

  1. The keyboard focus is set of the forum selector box box
Student Uses Access key 2 to Navigate to the Discussion Selection Tree view

Description

A student wants to jump to the discussion tree selector to quickly select a new reply to listen to.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student clicks the screen reader’s key combination for the access 2 key

Postconditions

  1. The keyboard focus is set of the discussion selector tree view box

Accessible Forum Display Filter Pane

Description

In order to quickly access the information users need from the forums they will need to be able to sort and filter the discussions in the forum. Users will also need to be able to change the forum display to their preferred display from the default or current display.

Requirements

{note}See original [Specs 2.4 Advanced Forums] for how discussions are sorted using each sort by type{note}

  1. The filter pane will display the following menus based on the forum configuration for the teacher: (See Mockup: Filter Pane Expanded Teacher)
    1. Group menu (only displayed if visible or separate groups is set for the forum)
      1. All participants
      2. List of all groups in the grouping assigned to the forum.
    2. Sort by (each menu item will have a sub menu for changing the sort to ascending or descending)
      1. Last post date
      2. Creation date
      3. Last name
      4. First name
      5. Number of replies
    3. Forum display
      1. Accessible
      2. Default
      3. Nested
      4. Tree
  2. The filter pane will display the following menus based on the forum configuration for the student: (See Mockup: Filter Pane Expanded Student)
    1. Sort by (each menu item will have a sub menu for changing the sort to ascending or descending)
      1. Last post date
      2. Creation date
      3. Last name
      4. First name
      5. Number of replies
    2. Forum display
      1. Accessible
      2. Default
      3. Nested
      4. Tree
  3. The filter pane will display the simple forum search form for all users. See Mockup: Filter Pane
  4. The user will be able to tab to the first menu and the search field
  5. The user will use the left and right arrows to switch between menus and to open sub menus
  6. The user will use the up and down arrows to navigate between menu items
  7. The user will use the spacebar to open the menu
  8. Selecting a sort by option will open up the ascending or descending sub menu. See Mockup: Filter Pane Expanded Student
  9. Selecting ascending or descending in a sort by submenu will rest the discussion display pane to its default state. See Mockup: No Discussion Selected
  10. Selecting ascending or descending in a sort by submenu will rest the page’s Moodle breadcrumb to the path to the current forum. See Mockup: No Discussion Selected
  11. Selecting ascending or descending will sort the discussion list based on the sort by and ascending or descending selection.
  12. Selecting ascending or descending will set the student’s focus to the Discussion tree view.
  13. If the forum is not set to use groups in the forum settings then the view group menu in the top navigation will not display. See Mockup: Filter Pane Expanded Student
  14. Selecting a group in the view group selector will change the discussion pane to display only discussions for that group and all participants.
  15. Selecting a group in the view group selector will focus the user on the Discussion tree view
  16. Selecting a group will reset the discussion view pane to its default state of no discussion or reply being displayed. See Mockup: No Discussion Selected
  17. Selecting a group will reset the Moodle breadcrumb to the path to the current forum. See Mockup: No Discussion Selected
  18. Selecting a display type in the forum display menu will cause the page to reload and the new forum display to display the forum. See Mockup: No Discussion Selected
  19. Clicking the Search button will bring up the search results in the discussion display pane. See Mockup: Search Results
  20. The search one the filter pane will search only the current forum.
  21. Clicking the Advanced search button will display the Advanced search modal. See Mockup: Advanced Search Modal
  22. The advanced search modal will lock the user’s keyboard in the modal until the user click the Close, Cancel, or Search forums button.
  23. Clicking the Search button on the filter pane or the Search forums button in the advanced search modal will display the search results in the discussion display pane. See Mockup: Search Results
  24. The user’s browser focus will be placed on the discussion display pane after a search has finished.
  25. The search results will display the same as described in the Section: Accessible Forum Discussion Display Pane with a header titled Search results with a count of the number of posts found.
  26. The action menu for each post in the search results will consist of the following links: (See Mockup: Search Results)
    1. Show post in full discussion
    2. Show post and its replies
  27. Selecting Show post in full discussion in the action menu will cause the following to happen:
    1. The discussion display pane will display all posts in the discussion the post is in.
    2. The user’s browser focus will be placed on the post in the discussion display pane
  28. Selecting Show post and its replies in the action menu will cause the following to happen:
    1. The discussion display pane display the post and all replies to the post in the discussion hierarchy.
    2. The user’s browser focus will be placed on the post in the discussion display pane
Mockups
Filter Pane

afFilterPane.png

Filter Pane Expanded Teacher

afFilterPaneExpandedTeacher.png

Filter Pane Expanded Student

afFilterPaneExpandedStudent.png

Search Results

afSearchResults.png

Advanced Search Modal

afAdvancedSearchModal.png

Use Cases
Student Accesses the Sort by Menu Using a Keyboard

Description

A student accesses the sort by menu drop down using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu

Postconditions

  1. Using the tab key the student is able to find the sort by menu
  2. The student is able to identify using the screen reader which menu they are on.
Student Accesses the Search Field Using a Keyboard

Description

A student accesses the search input field using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the search input field

Postconditions

  1. The student is able to identify that entering text in the field will search to forum for posts with that information in it.
  2. The student is able to identify they are in a form and need to tab to the Search forum button
Student Opens Sort By Menu Using a Keyboard

Description

A student opens the sort by menu using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu
  6. The student uses the spacebar to open the sort by menu

Postconditions

  1. The sort by menu opens for the student
  2. The screen reader reads all of the sort by menu items.
Student Selects Sort By Number of Replies Descending Using a Keyboard

Description

A student selects sort by number or replies in a descending order using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. The advanced forum has more than 1 discussion and reply

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu
  6. The student uses the spacebar to open the sort by menu
  7. The student uses the down arrow key to locate the Number of replies menu item
  8. The student uses the right arrow key to open the Number of replies sub menu
  9. The student uses the down arrow key to select the Descending menu item

Postconditions

  1. The discussion list is resorted by number of replies in a descending order
  2. The student’s browser focus is set to the discussion tree view
  3. The student is able to understand via the screen reader that they are not accessing the discussion tree view.
Student Navigates Between Menus Using a Keyboard

Description

A student accesses each menu using a keyboard and screen reader.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu
  6. The student uses the left arrow key to navigate to the forum display menu

Postconditions

  1. The student is able to navigate to the forum display using the keyboard
Student Selects a Display Type Using a Keyboard

Description

A student changes the display type from accessible to default using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu
  6. The student uses the left arrow key to navigate to the forum display menu
  7. The student uses the spacebar to open the forum display menu
  8. The student uses the down arrow key to select a new forum display type

Postconditions

  1. The student is able to navigate to the forum display using the keyboard
  2. The page is reloaded and the forum is displayed using the new forum display type
Teacher Selects a Group Using a Keyboard

Description

A student filters the lists of discussions by group using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. The advanced forum is setup to have separate groups
  8. Students are assigned to groups
  9. The forum has posts to each group as well as all participants.

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the screen reader to jump to the main content
  5. The student uses the tab key to tab to the sort by menu
  6. The student uses the left arrow key to navigate to the view group menu
  7. The student uses the spacebar to open the view group menu
  8. The student uses the down arrow key to select a group to view

Postconditions

  1. The discussion tree view is updated with the discussions available to the selected group and all participants
  2. The student’s browser focus is set to the discussion tree view.
Student Searches the Forum Using a Keyboard

Description

A student uses a screen reader and keyboard to access the search input field in the filter pane and search the forum.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. There are discussion in the forum
  8. There are replies in the forum
  9. There are replies or discussions that match the search criteria in the forum.

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to navigate to the filter pane
  5. The student tabs to the search input field
  6. The student enters their search text in the search input field
  7. The student tabs to the search button
  8. The student hits the enter key to search the forums

Postconditions

  1. The posts that are found matching the search criteria display in the discussion display pane
  2. The user’s browser focus is set to the discussion display pane.
Student Uses the Advanced Search to Search the Forum Using a Keyboard

Description

A student search the forum using the advanced search modal, a screen reader and a keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. There are discussion in the forum
  8. There are replies in the forum
  9. There are replies or discussions that match the search criteria in the forum.

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to navigate to the filter pane
  5. The student tabs to the advanced search button
  6. The student hits the enter key
  7. The student uses the tab key to fill out the search criteria
  8. The student tabs to the search forum button
  9. The student hits enter to search the forum

Postconditions

  1. The posts that are found matching the search criteria display in the discussion display pane
  2. The user’s browser focus is set to the discussion display pane.
Student Displays the Discussion the Search Result is a Part of Using a Keyboard

Description

A student selects the to view the discussion that a search result post is a part of using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. There are discussion in the forum
  8. There are replies in the forum
  9. There are replies or discussions that match the search criteria in the forum.
  10. The user has finished searching via advanced search or simple search.

Steps

  1. The student uses the screen readers next header keyboard commands to locate the reply they want to edit.
  2. The student hits the tab key to tab to the action menu for the discussion
  3. The student uses the spacebar to open the action menu
  4. The student uses the down arrow to select the Show post in full discussion menu item
  5. The student uses the enter key to select the Show post in full discussion menu item

Postconditions

  1. The discussion pane displays the discussion that the post is in
  2. The user’s bowser focus is set to the post that Show post in full discussion was selected for.
Student Displays the Search Result and All Replies Using a Keyboard

Description

A student selects to display the search result post and all of its replies using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. There are discussion in the forum
  8. There are replies in the forum
  9. There are replies or discussions that match the search criteria in the forum.
  10. The user has finished searching via advanced search or simple search.

Steps

  1. The student uses the screen readers next header keyboard commands to locate the reply they want to edit.
  2. The student hits the tab key to tab to the action menu for the discussion
  3. The student uses the spacebar to open the action menu
  4. The student uses the down arrow to select the Show post and its replies menu item
  5. The student uses the enter key to select the Show post and its replies menu item

Postconditions

  1. The discussion pane displays the post and all of its sub replies
  2. The user’s bowser focus is set to the post that Show post and its replies was selected for.

Accessible Forum Display Forum and Discussion Pane

Description

The forum and discussion pane is designed to provide the user with quick access to overall activity within the forum. This is where the user quickly navigates to the discussion or reply they want to view in the discussion pane.

Requirements
  1. The Forum and discussion pane will display the following: (See Mockup: Forum and Discussion Pane)
    1. A drop down list of all forums in the course with the current forum selected
    2. A button to Add a new discussion topic
    3. If visible or separate groups is set for the forum a statement of the setting will display below the forum select box. See Mockup: Forum and Discussion Pane Separate Groups and Mockup: Forum and Discussion Pane Visible Groups
    4. An expandable collapsable list of all discussions and replies in the currently selected forum the user can view.
  2. The forum selector drop down will not appear if there is only one forum in the course
  3. The forum selector will list all advanced forums in the course in alphabetical order
  4. Selecting a forum from the forum drop down will reload the page as if the user had clicked on the forum in the course.
  5. The Add a new discussion topic button will not appear for users if they do not have permissions to create a discussion.
  6. Clicking the Add a new discussion topic will display the Your new discussion topic modal. See Mockup: New Discussion Topic Modal
  7. Clicking the Post to forum button in the Your new discussion topic modal cause the following to happen:
    1. Save the discussion to the forum
    2. Add the discussion in the correct sort order to the discussion tree
    3. Place the browser focus on the discussion tree.
  8. The Your new discussion topic modal will lock the user’s focus in the modal
  9. Clicking the Close image will close the modal and the user’s focus will return to the forum and discussion pane.
  10. Clicking the Cancel button will close the modal and the user’s focus will return to the forum and discussion pane.
  11. The user will use tab to navigate between the forum selector, add a new discussion topic button and discussion tree.
  12. A group selector option will display below the mail now form field if a forum is set to separate or visible groups.
  13. The user will use the up and down arrows to navigate up and down in the discussion tree. See Mockup: Forum and Discussion Pane Expanded
  14. The user will use the left and right arrows to expand and contract the discussion tree. See Mockup: Forum and Discussion Pane Expanded
  15. The user will be able to use the mouse to click on the + and - images to expand and contract discussions and replies. See Mockup: Forum and Discussion Pane Expanded
  16. Discussions that are collapsed and have replies will have a + image to the left of the discussion title and the screen reader will read that the discussion is collapsed. See Mockup: Forum and Discussion Pane Expanded
  17. Replies that are collapsed and have replies will have a + image to the left of the reply title and the screen reader will read that the reply is collapsed. See Mockup: Forum and Discussion Pane Expanded
  18. Discussions that are expanded and have replies will have a - image to the left of the discussion title and the screen reader will read that the discussion is expanded. See Mockup: Forum and Discussion Pane Expanded
  19. Replies that are expanded and have replies will have a - image to the left of the reply title and the screen reader will read that the reply is expanded. See Mockup: Forum and Discussion Pane Expanded
  20. When expanded a discussion or reply will display all replies to the discussion in tree form below it. See Mockup: Forum and Discussion Pane Expanded
  21. If a discussion or reply has no replies to it then no image will display to the left of the title. See Mockup: Forum and Discussion Pane Expanded
  22. Users will use the enter key on a discussion to display the discussion and all replies in the discussion pane. See Mockup: Discussion Accessible Display
  23. Users will click on a discussion to display the discussion and all replies in the discussion pane. See Mockup: Discussion Accessible Display
  24. Users will use the enter key on a reply to display the reply and all replies to the reply in the discussion pane. See Mockup: Selected Reply Accessible Display
  25. Users will click on a reply to display the replies and all replies to the reply in the discussion pane. See Mockup: Selected Reply Accessible Display
  26. Clicking on a reply or discussion will place the user’s browser focus on the discussion pane
  27. Hitting the enter key on a discussion or reply link will place the user’s browser focus on the discussion pane.
  28. The discussion tree will display the number of unread replies for the discussion/reply to the right of the discussion/reply title if the user has read tracking enabled. See Mockup: Forum and Discussion Pane
  29. Forums set to visible or separate groups will add the for and group name to the right of the discussion title when the post is set to a specific group in the discussion tree view. See Mockup: Forum and Discussion Pane Separate Groups and Mockup: Forum and Discussion Pane Visible Groups
Mockups
Forum and Discussion Pane

afForumDiscussionPane.png

Forum and Discussion Pane Expanded

afForumDiscussionPaneExpanded.png

Forum and Discussion Pane Separate Groups

afForumDiscussionPaneSeparateGroups.png

Forum and Discussion Pane Visible Groups

afForumDiscussionPaneVisibleGroups.png

Discussion Accessible Display

afAccessibleDiscussionDisplay.png

Selected Reply Accessible Display

afAccessibleReplyDisplay.png

New Discussion Topic Modal

afNewTopicModal.png

Use Cases
Student Uses a Keyboard to Navigate Between Forum and Discussion Panel Areas

Description

A student navigates between the forum selector, add a new discussion topic and the discussion tree using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the tab key to navigate between the areas of the forum and discussion pane

Postconditions

  1. The student is able to navigate between the forum selector and discussion tree areas
  2. The student with the use of the screen reader understands the areas they are navigating between.
Student Selects a Different Forum Using a Keyboard

Description

A student navigates to a different forum without going back to the course page using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. The is more than one forum in the course

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student tabs to the forum selector
  7. The student uses the spacebar to open the forum selector
  8. The student uses the down arrow to select the next forum in the course
  9. The student hits the enter key to select the forum

Postconditions

  1. The page is reloaded and the student is in the accessible view of the selected forum.
Teacher Adds a New Discussion Topic Using a Keyboard

Description

A teacher with a visual disability adds a new discussion topic to the forum using their screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display

Steps

  1. The teacher uses the screen reader to skip to the main content of the course
  2. The teacher tabs to the forum activity within the course
  3. The teacher hits the enter key
  4. The teacher uses the F6 key to get to the filter pane
  5. The teacher uses the F6 key to get to the forum and discussion pane
  6. The teacher uses the tab key to navigate to the Add a new discussion topic button
  7. The teacher hit the enter key
  8. The teacher uses tab to fill in all field in the Your new discussion topic modal
  9. The teacher tabs to the Post to forum button
  10. The teacher hits the enter key

Postconditions

  1. The teacher’s post is saved
  2. The teacher’s browser focus is placed back on the forum and discussion pane.
  3. The discussion tree is updated with the new discussion.
Teacher Adds a New Discussion Topic For a Specific Group Using a Keyboard

Description

A teacher with a visual disability adds a new discussion topic to the forum using their screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The advanced forum is set to separate groups

Steps

  1. The teacher uses the screen reader to skip to the main content of the course
  2. The teacher tabs to the forum activity within the course
  3. The teacher hits the enter key
  4. The teacher uses the F6 key to get to the filter pane
  5. The teacher uses the F6 key to get to the forum and discussion pane
  6. The teacher uses the tab key to navigate to the Add a new discussion topic button
  7. The teacher hit the enter key
  8. The teacher uses tab to fill in all field in the Your new discussion topic modal
  9. The teacher selects a specific group from the group selector
  10. The teacher tabs to the Post to forum button
  11. The teacher hits the enter key

Postconditions

  1. The teacher’s post is saved
  2. The teacher’s browser focus is placed back on the forum and discussion pane.
  3. The discussion tree is updated with the new discussion.
  4. The discussion title has the words for <group name selected> to its right.
Teacher Keyboard is Locked in the Your New Discussion Topic Modal

Description

A teacher with a visual disability tabs through all live areas in the Your new discussion topic modal and can’t exist the modal until they hit enter for the close or cancel buttons.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display

Steps

  1. The teacher uses the screen reader to skip to the main content of the course
  2. The teacher tabs to the forum activity within the course
  3. The teacher hits the enter key
  4. The teacher uses the F6 key to get to the filter pane
  5. The teacher uses the F6 key to get to the forum and discussion pane
  6. The teacher uses the tab key to navigate to the Add a new discussion topic button
  7. The teacher hit the enter key
  8. The teacher hits the tab until they have listened to all fields in the modal
  9. The teacher hits tab until they find the close button

Postconditions

  1. The teacher’s keyboard focus is locked within the modal until they hit enter on the close or cancel buttons.
Student Expands a Discussion Using a Keyboard

Description

A student expands a discussion to listen to all of the replies to the discussion using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created
  8. Replies have been posted to discussions

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the tab key to navigate to the discussion tree
  7. The student uses the left arrow key to expand the replies to the discussion

Postconditions

  1. All the titles for the replies of reply depth 1 for the discussion are showing and read to the user via the screen reader
Student Expands a Discussion Using a Mouse

Description

A student expands the replies to a discussion using their mouse.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student has set the accessible forum display
  6. More than one discussion has been created
  7. Replies have been posted to discussions

Steps

  1. The student clicks on the forum in the course
  2. The student clicks on the plus image to the left of the discussion title

Postconditions

  1. All the titles for the replies of reply depth 1 for the discussion are displayed
Student Navigated Down the Discussion Tree Using a Keyboard

Description

A student navigates to a reply to a discussion using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created
  8. Replies have been posted to discussions

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the tab key to navigate to the discussion tree
  7. The student uses the down arrow to navigate to the next discussion in the tree

Postconditions

  1. The title of the discussion is read to the student via the screen reader
Student Selects a Discussion to Display Using a Keyboard

Description

A student selects a discussion using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created
  8. Replies have been posted to discussions

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the tab key to navigate to the discussion tree
  7. The student uses the down arrow to navigate to the next discussion
  8. The student hits the enter key

Postconditions

  1. The student’s browser focus is set to the discussion pane
  2. The discussion pane is updated to display the full discussion plus all replies in the discussion.
Student Selects a Discussion Using a Mouse

Description

A student selects a discussion using their mouse.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student has set the accessible forum display
  6. More than one discussion has been created
  7. Replies have been posted to discussions

Steps

  1. The student clicks on the forum in the course
  2. The student clicks on the discussion title

Postconditions

  1. The student’s browser focus is set to the discussion pane
  2. The discussion pane is updated to display the full discussion plus all replies in the discussion.
Student Locates a Discussion With Unread Replies using a Keyboard

Description

A student navigates through the discussion tree until they hear a discussion that has new replies to it. The student is using the screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created
  8. Replies have been posted to discussions

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the down arrow to located a discussion with unread replies

Postconditions

  1. Each discussion title is read as the user uses the down arrow to navigate down
  2. The discussion title is read then the number of unread replies.
Student Selects a Reply Using a Keyboard

Description

A student navigates to a reply and selects it to listen to in the discussion pane using a screen reader and their keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created
  8. Replies have been posted to discussions

Steps

  1. The student uses the screen reader to skip to the main content of the course
  2. The student tabs to the forum activity within the course
  3. The student hits the enter key
  4. The student uses the F6 key to get to the filter pane
  5. The student uses the F6 key to get to the forum and discussion pane
  6. The student uses the right arrow to expand a discussion
  7. The student hits the enter key

Postconditions

  1. The student’s browser focus is set to the discussion pane
  2. The discussion pane is updated to display the reply and all replies of a reply depth below the starting reply.
Student Selects a Reply Using a Mouse

Description

A student navigates to a reply and selects it to listen to in the discussion pane using their mouse.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the course
  5. The student has set the accessible forum display
  6. More than one discussion has been created
  7. Replies have been posted to discussions

Steps

  1. The student clicks on the forum in the course
  2. The student clicks on the plus image to the left of the discussion title
  3. The student clicks on the reply title

Postconditions

  1. The student’s browser focus is set to the discussion pane
  2. The discussion pane is updated to display the reply and all replies of a reply depth below the starting reply.

Accessible Forum Discussion Display Pane

Description

The discussion display pane is the region of the forum that displays to the user the specific discussion or reply they have chosen with all sub replies. The pane is designed to present the selected discussion or reply in the most accessible manner focusing on simplified content and easy tabbing between actions. HTML headers are used to help inform the user where they are in the hierarchy of the discussion.

{note}It is understood that using HTML header’s to denote the hierarchy of the forum has the issue that HTML only has a header level up to H6. Furthermore H1 is only used once on a page and for the page heading. This is why the maximum reply depth setting has been added. It also should be noted that after a reply depth of 3 forum replies become less focused on the original discussion topic.{note}

Requirements
  1. The discussion pane will be separated into 2 areas: (See Mockup: Discussion Display Pane Structure)
    1. Message display area. This is a live area that is updated with message as information is added or removed via modals.
    2. Discussion/reply display area. This is dynamically updated based on modals and the forum and discussion pane.
  2. Messages in the message area will display for 30 seconds and then be removed from the page.
  3. The message output area will not be accessible if there are no messages.
  4. Each discussion or reply will be separated into 3 areas: (See Mockup: Discussion/Reply Structure)
    1. Heading
    2. Post
      1. Post text
      2. File attachments
    3. Actions
  5. A discussion/reply heading will display the following information in this order: (See Mockup: Teacher Views Own Discussion)
    1. Post title using the correct HTML header based on reply depth (see below)
    2. Author with their image and name, the image will not be identified to a screen reader
    3. Post date, the date the post was created
    4. Rating type and value (this will only display if ratings are enabled)
  6. The accessible display mode will use HTML header tags for the title of the discussion post and replies. See Mockup: Discussion Accessible Display
  7. The discussion post will use a h2 HTML header tag for the title of the post. See Mockup: Discussion Accessible Display
  8. A replies reply depth will determine the HTML header tag to be used for the title: (See Mockup: Discussion Accessible Display)
    1. Reply depth 1 will use the HTML header h3
    2. Reply depth 2 will use the HTML header h4
    3. Reply depth 3 will use the HTML header h5
    4. Reply depth 4 will use the HTML header h6
  9. Forums that allow a reply depth greater then 4 will use the HTML Header tag of H6 for all reply titles at a depth of 4 or greater.
  10. The post text area will display the post text and then any file attachments in an un ordered list below the. See Mockup: Discussion/Reply Structure
  11. If there are no actions available to the user then the action area will not display
  12. When the forum is set to separate groups and a discussion is set to all participants the action area will not display to students.
  13. Replies in the discussion pane will display based on the reply hierarchy and depth.
  14. If the teacher is the creator of the discussion or reply their name will be denoted in bold and the screen reader will read “Teacher” before reading the poster’s name.
  15. Anywhere in the below action menus if the action is subscribe it will be replaced with unsubscribe if the user is already subscribed to the discussion.
  16. Anywhere in the below action menus if the action bookmark is available the option remove bookmark will show if the discussion or reply is already bookmarked
  17. Anywhere in the below action menus if the action mark substantive is available the option Unmark substantive will show if the discussion or reply is already marked as substantive.
  18. Reply will display in the below action menus only if the user has permissions to create a reply
  19. Rating and view ratings will only display in the below action menus if the rating setting is enabled for the forum.
  20. A teacher will have the following actions available when viewing their own discussion: (See Mockup: Teacher Views Own Discussion)
    1. Edit
    2. Delete
    3. View ratings (only displays if ratings are enabled for the forum)
    4. Subscribe (will not display if subscribed to the forum or forum subscription is disabled)
    5. Mark substantive
    6. Bookmark
    7. Reply
  21. A teacher will have the following actions available when viewing their own reply: (See Mockup: Teacher Views Teacher Reply)
    1. Edit
    2. Split
    3. Delete
    4. View ratings (only displays if ratings are enabled for the forum)
    5. Mark substantive
    6. Bookmark
    7. Reply
  22. A teacher will have the following actions available when viewing a student’s reply: (See Mockup: Teacher Views Student Reply)
    1. Reply
    2. Split
    3. Delete
    4. Rate (only displays if ratings are enabled for the forum)
    5. Mark substantive
    6. Bookmark
  23. A student will have the following actions available when viewing a discussion: (See Mockup: Student Views Discussion)
    1. Reply
    2. Rate
    3. Subscribe
  24. A student will have the following actions available when viewing their own reply: (See Mockup: Student Views Own Reply)
    1. Edit
    2. Delete
    3. Reply
  25. A private reply will display only to the student who created the original reply and the teachers.
  26. A teacher will have the following options available when viewing a private reply: (See Mockup: Teacher View Private Reply)
    1. Edit
    2. Split
    3. Delete
  27. The action area will not display to a student for a private reply. See (Mockup: Anonymous Reply)
  28. The user’s picture will display as the default user picture for an anonymous forum. See (Mockup: Anonymous Reply)
  29. The user’s name will appear as a Anonymous user instead of the creators real name.
  30. A user will have all the same action menu options for an anonymous reply as they would for a reply of the same type in a regular forum.
  31. A user will be able to use the spacebar to open the action menu
  32. A user will be able to tab to an action menu
  33. A user will be able to use the enter key to select an action menu item.
  34. Selecting the reply action will bring up the reply modal.
  35. The student reply modal will have the fields in Mockup: Student Reply Modal
  36. The file upload area will not display if the forum is set to not allow attachments.
  37. The teacher reply modal will have additional form fields compared to a student’s reply modal based on the type of forum and the forum settings:See (Mockup: Teacher Reply Modal)
    1. Mail now
    2. Group (select box with available groups if the forum is set to visible or separate groups)
    3. Private reply
    4. Reveal yourself in this post (if the forum is set to anonymous)
  38. The reply modal will lock the user’s keyboard in the modal until the user clicks the Close, Cancel, or Post to forum button.
  39. Clicking the Post to forum button will cause the following things to happen:
    1. The reply is added as a reply to the discussion
    2. The modal closes
    3. The reply displays inline in the discussion/reply hierarchy
    4. Add a message to the message output area stating that the reply was successfully created and that the user has 30 minutes to edit the post.
    5. The message will be followed by a link to jump to the reply in the discussion display pane.
    6. The user’s browser focus is placed on the successful creation message.
  40. Selecting the split action will bring up the split post modal. See (Mockup: Split Post Modal)
  41. The split post modal will key the keyboard locked in the modal until the user clicks the Close, Cancel, or Split button.
  42. Clicking the Split button will cause the following things to happen:
    1. The Split post modal to close
    2. The Post and all of the replies to it or lower in the reply hierarchy to be converted to a discussion
    3. The post converted to the initial discussion post for the new discussion with the title in the new discussion title field of the modal
    4. A message to be added to the message display area stating that the post was successfully split and is displayed below.
    5. The discussion display pane will display the new discussion that the post was split into.
    6. The discussion tree in the forum and discussion pane is updated to reflect the changes to the forum.
  43. Selecting the delete action will bring up a conformation that the user wants to delete the reply or discussion. See (Mockup: Delete Reply Modal)
  44. Clicking the Delete post button will do the following things:
    1. Close the modal
    2. Remove the post and all of the replies lower in the hierarchy than the post.
    3. Add a successfully deleted message to the message output area.
    4. Place the user’s browser focus on the success message.
  45. The delete post modal will key the keyboard locked in the modal until the user clicks the Close, Cancel, or Delete post button.
  46. Selecting the edit action will bring up the reply modal pre-populated with the post that is being edited. See (Mockup: Edit Reply Modal)
  47. Selecting the rate action will bring up the rate modal pre-populated with the current rating the user has given the post. See Mockup: Rating Modal
  48. The rate post modal will key the keyboard locked in the modal until the user clicks the Close, Cancel, or Rate post button.
  49. Clicking the rate button will cause the following things to happen:
    1. The rate post modal will close
    2. The rating the user had entered will be saved for the post
    3. The rating for the post will update based on the forum settings.
    4. A message will be printed in the message output area stating that the rating was successfully saved with a link to jump back to the post within the discussion display panel.
  50. Selecting the view ratings action will bring up the view ratings modal. See (Mockup: View Ratings Modal)
  51. The view ratings modal will keep the user’s keyboard focus until the user clicking on the Close or Close this window button.
  52. Closing a modal using the Close, Close this window or Cancel buttons will place the user’s browser focus back on the action menu the user was on when they opened the modal.
  53. Any errors in the processing of a modal will display an error message in the message output area with a link back to the area the user was in when the error occurred.
  54. Selecting the subscribe action will do the following things:
    1. Subscribe the user to the discussion to receive emails when new replies are created in the discussion
    2. Display a message in the message output stating that the user has been subscribed to the discussion
    3. Place the user’s browser focus on the message output.
  55. Selecting the unsubscribe action will do the following things:
    1. Unsubscribe the user from the discussion and cause the user to stop receiving emails when new replies are created in the discussion
    2. Display a message in the message output stating that the user has been unsubscribed to the discussion
    3. Place the user’s browser focus on the message output.
  56. Selecting the bookmark action will do the following things:
    1. Add the bookmark flag to the post
    2. Display a message in the message output stating that the post was bookmarked
    3. The message will end with a link to jump to the post that was bookmarked.
    4. Place the user’s browser focus on the message output
  57. Selecting the Remove bookmark action will do the following things:
    1. Remove the bookmark flag from the post
    2. Display a message in the message output stating that the bookmark has been removed from the post
    3. The message will end with a link to jump to the post that the bookmark was removed from.
    4. Place the user’s browser focus on the message output
    5. The message will end with a link to jump to the post that the bookmark was removed from.
  58. Selecting the Mark substantive action will do the following things:
    1. Add the substantive flag to the post
    2. Display a message in the message output stating that the post was flagged as substantive
    3. The message will end with a link to jump to the post that was flagged as substantive
    4. Place the user’s browser focus on the message output
  59. Selecting the Remove substantive mark action will do the following things:
    1. Remove the substantive flag from the post
    2. Display a message in the message output stating that the substantive flag was removed from the post
    3. The message will end with a link to jump to the post the substantive flag was removed from.
    4. Place the user’s browser focus on the message output
Mockups
Discussion Display Pane Structure

afDiscussionDisplayPaneStructure.png

Discussion/Reply Structure

afReplyStructure.png

Teacher Views Own Discussion

afTeacherViewOwnDiscussion.png

Teacher Views Teacher Reply

afTeacherViewTeacherReply.png

Teacher Views Student Reply

afTeacherViewStudentReply.png

Student Views Discussion

afStudentViewDiscussion.png

Student Views Own Reply

afStudentViewOwnReply.png

Teacher View Private Reply

afPrivateReply.png

Anonymous Reply

afAnonymousReply.png

Student Reply Modal

afStudentReplyModal.png

Teacher Reply Modal

afTeacherReplyModal.png

Rating Modal

afRatingModal.png

Split Post Modal

afSplitModal.png

Delete Post Modal

afDeletePostModal.png

Edit Reply Modal

afEditModal.png

View Ratings Modal

afViewRatingsModal.png

Use Cases
Student Listens to a Discussion Created by a Teacher

Description

A student selects a discussion using a screen reader and keyboard and listens to the screen reader read the discussion post.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. Replies have been posted to discussions

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion

Postconditions

  1. The student is able to identify that the teacher created the discussion and not just another student.
Student Navigates Between Replies to a Discussion Using a Keyboard

Description

A student navigates between reply headings using the screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. The student has made a reply to a discussion

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student uses the screen readers next header function to locate the next reply

Postconditions

  1. The student can identify by the header where they are within the forum hierarchy.
  2. The student is able to quickly navigate to each reply
Student Replies to a Discussion Using a Keyboard

Description

A student creates a reply to a discussion using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. Replies have been posted to discussions

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student hits the tab key to tab to the action menu for the discussion
  5. The student hits the spacebar to open the action menu
  6. The student uses the down arrow to navigate to the reply action
  7. The student hits the enter key
  8. The student uses the tab key to tab through the forum fields and enter a reply
  9. The student tabs to the Post to forum button
  10. The student hits the enter key

Postconditions

  1. The reply is added to the discussion display pane in the proper place
  2. A message is displayed in the message output area
  3. The student hears the message
Student Edits a Reply Using a Keyboard

Description

A student edits a reply they have made using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. The student has made a reply to a discussion

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student uses the screen readers next header keyboard commands to locate the reply they want to edit.
  5. The student hits the tab key to tab to the action menu for the discussion
  6. The student uses the spacebar to open the action menu
  7. The student uses the down arrow to select the edit menu item
  8. The student uses the enter key to select the edit menu item
  9. The student uses the tab key to navigate to the field they want to change
  10. The student uses the tab key to navigate to the Post to forum button
  11. The student hits the enter key to post the edits to the forum

Postconditions

  1. The reply is updated in the discussion display pane in the proper place
  2. A message is displayed in the message output area stating that the reply has been created and allowing the student to jump to the new reply.
  3. The student hears the message
Student’s Keyboard Stays Locked in the Reply Modal

Description

A student tabs through all of the options in the reply modal twice using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. The student has made a reply to a discussion

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student uses the screen readers next header keyboard commands to locate the reply they want to reply to.
  5. The student hits the tab key to tab to the action menu for the discussion
  6. The student uses the spacebar to open the action menu
  7. The student uses the down arrow to select the edit menu item
  8. The student uses the enter key to select the edit menu item
  9. The student uses the tab key to navigate through all the modal fields twice

Postconditions

  1. The user always tabs within the modal and the keyboard focus never leaves the modal.
Student Jumps to a Newly Created Reply

Description

A student jumps to the reply they have made using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. The student has made a reply to a discussion

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student uses the screen readers next header keyboard commands to locate the reply they want to reply to.
  5. The student hits the tab key to tab to the action menu for the discussion
  6. The student uses the spacebar to open the action menu
  7. The student uses the down arrow to select the edit menu item
  8. The student uses the enter key to select the edit menu item
  9. The student uses the tab key to fill out all the fields in the forum
  10. The student uses the tab key to navigate to the Post to forum button
  11. The student hits the enter key to post the reply to the forum
  12. The student hits the enter key when the screen reader reads the link to jump to the newly created reply

Postconditions

  1. The user’s browser focus is placed on the header for the reply they just created.
Student Subscribes to a Discussion Using a Keyboard

Description

A student subscribes to a discussion using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher
  8. The forum is set to optional forum subscriptions.
  9. The student is not subscribed to the forum
  10. The student has not subscribed to the discussion

Steps

  1. The student uses the F6 key to get to the filter pane
  2. The student uses the F6 key to get to the forum and discussion pane
  3. The student uses the enter key to select the discussion
  4. The student uses the screen readers next header keyboard commands to locate the reply they want to subscribe to.
  5. The student hits the tab key to tab to the action menu for the discussion
  6. The student uses the spacebar to open the action menu
  7. The student uses the down arrow to select the subscribe menu item
  8. The student uses the enter key to select the subscribe menu item

Postconditions

  1. The student is subscribed to the discussion
  2. A message is displayed in the message output area stating that the student has been subscribed to the discussion.
  3. The student hears the message
Student Accesses a Discussion’s Action Menu Using a Mouse

Description

A student displays a discussion’s action menu using a mouse.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a student
  3. An advanced forum has been created in the course
  4. The student has navigated to the forum
  5. The student is using a screen reader
  6. The student has set the accessible forum display
  7. More than one discussion has been created by the teacher

Steps

  1. The student clicks on the discussion
  2. The student clicks on the action menu for the discussion

Postconditions

  1. The action menu expands
Teacher Rates a Post Using a Keyboard

Description

A teacher rates a student’s post using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The teacher has created a discussion
  8. A student has made a reply to a discussion
  9. The forum is set to allow rating
  10. The student reply has not been rated

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher uses the screen readers next header keyboard commands to locate the reply they want to rate.
  5. The teacher hits the tab key to tab to the action menu for the discussion
  6. The teacher uses the spacebar to open the action menu
  7. The teacher uses the down arrow to select the rate menu item
  8. The teacher uses the enter key to select the rate menu item
  9. The teacher uses the spacebar to open the rating select box
  10. The teacher uses the down arrow to select the rating they want.
  11. The teacher hits the enter key to select the rating for the post
  12. The teacher uses the tab key to navigate to the rate button.
  13. The teacher uses the enter key to rate the post.

Postconditions

  1. The post is rated
  2. The post’s rating is recalculated
  3. A message is displayed in the message output area stating that the post has been rated and allowing the teacher to jump to the post they rated.
  4. The student hears the message
Teacher Deletes a Discussion Using a Keyboard

Description

A teacher deletes a discussion using a screen reader and keyboard

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. A discussion has been created in the forum
  8. A reply has been made to the discussion

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher hits the tab key to tab to the action menu for the discussion
  5. The teacher uses the spacebar to open the action menu
  6. The teacher uses the down arrow to select the delete menu item
  7. The teacher uses the enter key to select the delete menu item
  8. The teacher uses the spacebar to open the delete select box
  9. The teacher listens to the modal window text
  10. The teacher uses the tab key to navigate to the delete post button.
  11. The teacher uses the enter key to delete post button to delete the post.

Postconditions

  1. The post is deleted
  2. A message is displayed in the message output area stating that the post has been deleted and allowing the teacher to jump back to the forum and discussion pane
  3. The student hears the message
Teacher the Views Ratings for a Post Using a Keyboard

Description

A teacher views the ratings that have been given for a student’s post using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The teacher has created a discussion
  8. A student has made a reply to a discussion
  9. The teacher and others have rated a student’s reply

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher uses the screen readers next header keyboard commands to locate the reply they want to view the ratings for.
  5. The teacher hits the tab key to tab to the action menu for the discussion
  6. The teacher uses the spacebar to open the action menu
  7. The teacher uses the down arrow to select the view ratings menu item
  8. The teacher uses the enter key to select the view ratings menu item

Postconditions

  1. The view ratings modal appears with all the ratings that have been submitted for the post.
Teacher Splits a Reply Using a Keyboard

Description

A teacher splits a reply into a new discussion using a screen reader and keyboard

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The teacher has created a discussion
  8. The reply has multiple replies to it.

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher uses the screen readers next header keyboard commands to locate the reply they want to split.
  5. The teacher hits the tab key to tab to the action menu for the discussion
  6. The teacher uses the spacebar to open the action menu
  7. The teacher uses the down arrow to select the split menu item
  8. The teacher uses the enter key to select the split menu item
  9. The teacher uses the tab key to tab to the new discussion title field and enters a discussion title
  10. The teacher tabs to the split button
  11. The teacher hits the enter key to split the reply

Postconditions

  1. A new discussion is created from the reply with the title provided in the new discussion title field
  2. A message appears in the message output area that states the reply was split.
  3. The teacher’s browser focus is set to the message output
  4. The discussion display pane shows the newly created discussion
  5. The discussion tree in the forum and discussion pane is updated with the new discussion.
Teacher Marks a Post as Substantive Using a Keyboard

Description

A teacher marks a post as substantive using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The teacher has created a discussion
  8. A student has made a reply to a discussion

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher uses the screen readers next header keyboard commands to locate the reply they want mark as substantive.
  5. The teacher hits the tab key to tab to the action menu for the discussion
  6. The teacher uses the spacebar to open the action menu
  7. The teacher uses the down arrow to select the mark substantive menu item
  8. The teacher uses the enter key to select the mark substantive menu item

Postconditions

  1. The post is marked as substantive
  2. A message is added to the message output area stating that the post has been marked substantive and a link is included to allow the teacher to jump to the post.
  3. The teacher’s browser focus is placed on the message output.
  4. The teacher hears the message read to them.
Teacher Bookmarks a Post Using a Keyboard

Description

A teacher bookmarks a post using a screen reader and keyboard.

Preconditions

  1. The user is logged in
  2. The user is enrolled in a course as a teacher
  3. An advanced forum has been created in the course
  4. The teacher has navigated to the course
  5. The teacher is using a screen reader
  6. The teacher has set the accessible forum display
  7. The teacher has created a discussion
  8. A student has made a reply to a discussion

Steps

  1. The teacher uses the F6 key to get to the filter pane
  2. The teacher uses the F6 key to get to the forum and discussion pane
  3. The teacher uses the enter key to select the discussion
  4. The teacher uses the screen readers next header keyboard commands to locate the reply they want to view the ratings for.
  5. The teacher hits the tab key to tab to the action menu for the discussion
  6. The teacher uses the spacebar to open the action menu
  7. The teacher uses the down arrow to select the bookmark menu item
  8. The teacher uses the enter key to select the bookmark menu item

Postconditions

  1. The post is flagged as bookmarked
  2. A message is added to the message output area stating that the post has been bookmarked and a link is included to allow the teacher to jump to the post.
  3. The teacher’s browser focus is placed on the message output.
  4. The teacher hears the message read to them.

Glossary

  • Reply depth: The hierarchical level that a reply is on. A reply to a discussion is reply depth 1. A reply to a reply is depth 2. A reply to a reply to a reply is depth 3. Example:
    Discussion (depth 0)
    Reply (depth 1)
    Reply 2 (depth 2)
    Replay 3 (depth 3)
    Reply 4 (depth 2)
    Replay 5 (depth 1)

Document Change Management

Revision Summary

Revision History

Open Questions

See also

[1]