Use case:  From a time based list of announcements, reorder them so that the most important are at the top.

Scenario:  Midterms are in 2 weeks.  The instructor has created several announcements related to the midterm throughout the semester.  He wants to make sure students see them and would like them all to be at the top of the list for the next 2 weeks until after the midterm.

The instructor goes to the announcements tool and turns on Reordering in Options.

Once reordering is turned on, the Reorder link appears in the intra-tool navigation.  He selected Reorder. 

The Informational message disappears after drag and drop has been used OR if the instructor clicks the "Don't show me..." link.  Paging and view filter are disabled and greyed out.  The number input boxes appear in front of the announcements and the remove column is removed.  Page title changes. 


Instructor moves mouse over the first announcement related to the midterm.  She sees the mouse change to a hand and the rollover text displays after 1 second.

The instructor begins to drag the announcement toward the top of the list. She notices the arrow and red line indicating the drop target at any moment.  The announcement she picked up has a slight outline and highlight as she moves it.  The number in front of the announcement changes respectively as she moves up the list.  No other numbers changes while she is dragging since the order hasn't really changed until she drops it.

She drops the announcement at the top of the list. The number becomes 1 and all others update appropriately.  She notices the highlight persists for 2 seconds after she dropped it in the new location.  She also notices she is able to undo the last move or all moves.

The next one she wants to move up was created at the beginning of the semester so he decides to use the number controls.  It's much easier than dragging all that distance. She clicks in the number field and the number is highlighted to show her she can immediately start editing.

She changed the number to 2 so it falls in under the previous announcement she moved.  The announcement moves to the 2nd position and all other numbers change appropriately.  The screen focus moves with the announcement.  The row is highlighted for 2 seconds to let her easily see where it moved to.

She's made all the changes she wants to for now so she she goes back the list view to see what it looks like.

All controls (view dropdown, paging, sorting) are enabled.  And she sees a note at the top letting her know she is viewing her custom order.  This message continues to display until she removes the custom order. [fluid:Need to add a button to allow her to turn it off]  

Later, she needs to find a particular announcement and she knows when she created it.  So  she sorts by modified date.  Once she's done that, she notices the note changes.  She now has the choice to go back to custom order or cancel the custom order.


Scenario:  Student goes to announcement tool to see if there's anything new.

At first she doesn't see any new announcements so is confused.   Then she notices "midterm" in the subject line of the first announcement and then that the first several are related to the midterm.  They sound familiar to her but she reads them all again.

She notices the dates are old and then the message at the top of the page.

She wants to make sure she hasn't missed a new announcement so decides to sort by date so she can see the most recent.  She's please to see she can easily get back to her instructors custom order.

Announcement Tool Design Changes



Working Area

Working Design Ideas