Details
-
Type:
Improvement
-
Status:
Open
-
Priority:
Major
-
Resolution: Unresolved
-
Affects Version/s: 2.0
-
Fix Version/s: None
-
Labels:None
-
Difficulty:Difficult
-
Affected Branches:MOODLE_20_STABLE
Description
An alternative UI for editing the course page. I made a demo in Shoes (http://shoooes.net/ ) which produces executables easily, so here you go, for the big three of operating systems. (If you would like stand-alone executables instead of ones that use a downloader, tell me and I'll create some.)
Still missing from the prototype are the section editing controls, the design of which is not quite trivial - a toggle button may still be appropriate here.
Benefits:
- Quick: No page reloading, except perhaps when 'save' pressed (versus two or even more reloads, when changing group mode in current UI); additional clicks do not necessarily distract, but waiting does.
- Standard usage of controls: Buttons are used for actions and links are used for navigation so users can anticipate what happens when clicking (versus the action icons being mixed with the "assign roles" navigation link icon)
- No more three-state groups mode icon overloading the tooltip with both the description of the command and the status of it, and hiding the other choices and even the number of choices available!
- No more tiny 11 pixel toggle icons that are used in the course edit mode. As Fitt's law says, it is dang hard to hit some thingy that's too small.
Downsides
- This is NOT in line with Moodle style yet. for this to possibly be supported, we need to have clear understanding of the Moodle UI style first, in order to have this kind of a change really reflected on the entire Moodle UI.
- The number of clicks to change a setting increases (but since this is javascript, time to use likely decreases):
- group mode: used to be one or two, now always constant three clicks
- visibility: used to be one, now always three clicks
- javascript required so an alternative is still needed
- There is no affordance at all of the controls:
- especially keyboard usage is tricky. Some kind of an anchor that could be moved to with the tab key should definitely be added.
- first-timers may have more difficulties to find these controls than the old ones. (on the other hand, they are likely to find it easier to understand their usage since they have seen it all before)
- Since some items are by default hidden in what I suggest, some user groups may even find this more difficult. On the other hand, the tiny icons may not be any easier for users who don't have good eyesight.
This can be implemented in either plain javascript or with AJAX. AJAX would make saving quicker and feedback more fluent.
Couple of notes about that executable demo:
- the radio buttons for 'Groups:' are too far apart, the visual grouping falls apart there; the labels should also activate the radio buttons
- the only functionality that works: changing the name of the 'Introduction' resource and pressing save (or cancel)
- also, to make it less intrusive, quickly animating the appearing and the disappearing transitions would be great.
Attachments
Issue Links
| This issue has been marked as being related by: | ||||
| MDL-19586 | Create UI Guidelines to aid in Moodle development |
|
|
|
Added UI Mockup: <2009-07-18 16:00>