Note:

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

Usability issues - Tabs: Difference between revisions

From MoodleDocs
Line 69: Line 69:
* Another option will be to group in Update tabs Settings, Assign roles, Override permissions, so the order of tabs will be less (because this three tabs previously mentioned would be subtabs). This would be a good idea to reduce the number of tabs and because this actions won't be done with frequency.
* Another option will be to group in Update tabs Settings, Assign roles, Override permissions, so the order of tabs will be less (because this three tabs previously mentioned would be subtabs). This would be a good idea to reduce the number of tabs and because this actions won't be done with frequency.
* It must be taken into account that by default it would be displayed the tab and subtab that is used more frequently in the activity and the one that describes more its content.
* It must be taken into account that by default it would be displayed the tab and subtab that is used more frequently in the activity and the one that describes more its content.
=== Conclusion ===
{| border="1" cellpadding="5" cellspacing="0" align="center"
|+'''Final Tab line after the study'''
|-
! style="background:#ffdead;" | ID
! style="background:#ffdead;" | Activity
! style="background:#efefef;" | Tab line (default tab in bold)
|-
| style="border-bottom:3px solid grey;" | 1
| style="border-bottom:3px solid grey;" | Quiz
| style="border-bottom:3px solid grey;" | Info, Preview, '''Edit'''(with subtabs '''Quiz''', Questions, Categories, Import, Export), Results, Update quiz (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 2
| style="border-bottom:3px solid grey;" | Forum
| style="border-bottom:3px solid grey;" | '''Edit''', Update Forum (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 3
| style="border-bottom:3px solid grey;" | Glossary
| style="border-bottom:3px solid grey;" | '''Edit''' (with subtabs '''Add entry''', Import, Export), View, Search, Browse (with subtabs Browse by alphabet, Browse by category,  Browse by date, Browse by Author), Update Glossary (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 4
| style="border-bottom:3px solid grey;" | Chat
| style="border-bottom:3px solid grey;" | '''Enter to the chat''' (with subtabs '''Normal mode''' and without frames and Javascript), history, Update chat (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 5
| style="border-bottom:3px solid grey;" | Choice
| style="border-bottom:3px solid grey;" | '''Edit''', View responses, Update Choice (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 6
| style="border-bottom:3px solid grey;" | Assignments
| style="border-bottom:3px solid grey;" | '''Edit''', View attempts, Update assignments (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 7
| style="border-bottom:3px solid grey;" | Database
| style="border-bottom:3px solid grey;" | View list, view single, search, add entry, export, templates, '''fields''', presets, Update database (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 8
| style="border-bottom:3px solid grey;" | Lesson
| style="border-bottom:3px solid grey;" | Preview, '''Edit''' (with subtabs '''collapsed''', expanded), Reports, Grade essays, Update lesson (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 9
| style="border-bottom:3px solid grey;" | Survey
| style="border-bottom:3px solid grey;" | '''Edit''', View responses (with subtabs '''Questions''', students, download), Update survey (with subtabs Settings, Assign roles, Override permissions)
|-
| style="border-bottom:3px solid grey;" | 10
| style="border-bottom:3px solid grey;" | Wiki
| style="border-bottom:3px solid grey;" | Edit, '''View''', Search wiki, History, Links, Choose wiki links, Administration, Update wiki (with subtabs Settings, Assign roles, Override permissions)
|-
|}


== Screenshots ==
== Screenshots ==

Revision as of 06:58, 4 August 2008

Identification of the tabs

In the followint table the tab line of each activity is described.


Tab line of the different activities
ID Activity Tab line (default tab in bold) Justification
1 Quiz Info, Results, Preview, Edit(with subtabs Quiz, Questions, Categories, Import, Export), Settings, Assign roles, Override permissions
2 Forum Edit, Settings, Assign roles, Override permissions Edit would contain the information of "add a discussion topic".
3 Glossary Edit (with subtabs Add entry, Import, Export), Search, Browse (with subtabs Browse by alphabet, Browse by category, Browse by date, Browse by Author), View, Settings, Assign roles, Override permissions Edit would contain the information of "add a new entry" in Add entry. The print option will be accessible from View.
4 Chat Enter to the chat (with subtabs Normal mode and without frames and Javascript), chat history, Settings, Assign roles, Override permissions I would replace "View past chat sessions" by chat history (it must be taken into account that it has been used the concept "message history" previously at Moodle).
5 Choice Edit, View responses, Settings, Assign roles, Override permissions
6 Assignments Edit, View attempts, Settings, Assign roles, Override permissions
7 Database View list, view single, search, add entry, export, templates, fields, presets, Settings, Assign roles, Override permissions
8 Lesson Preview, Edit (with subtabs collapsed, expanded), Reports, Grade essays, Settings, Assign roles, Override permissions
9 Survey Edit, View responses (with subtabs Questions, students, download), Settings, Assign roles, Override permissions
10 Wiki View, Edit, Links, History, Search wiki, Choose wiki links, Administration, Settings, Assign roles, Override permissions The "reload this page" button must be maintained in all pages.

Next of this classification, an analysis of the name of the tabs and their order have been done:

  • The world "history" will be used both for the chat and the wiki history. So the tab will be only called "History"
  • The order of the tabs will be followed by this logic: info, preview, edit/enter, links, view, search, add entry, export, templates, fields, presets, results, Reports, Grade essays, history, Choose wiki links, Administration, settings, Assign roles, Override permissions. Depending on if an activity has or not this tabs will be ordered in a determined way.
  • Another option will be to group in Update tabs Settings, Assign roles, Override permissions, so the order of tabs will be less (because this three tabs previously mentioned would be subtabs). This would be a good idea to reduce the number of tabs and because this actions won't be done with frequency.
  • It must be taken into account that by default it would be displayed the tab and subtab that is used more frequently in the activity and the one that describes more its content.

Conclusion

Final Tab line after the study
ID Activity Tab line (default tab in bold)
1 Quiz Info, Preview, Edit(with subtabs Quiz, Questions, Categories, Import, Export), Results, Update quiz (with subtabs Settings, Assign roles, Override permissions)
2 Forum Edit, Update Forum (with subtabs Settings, Assign roles, Override permissions)
3 Glossary Edit (with subtabs Add entry, Import, Export), View, Search, Browse (with subtabs Browse by alphabet, Browse by category, Browse by date, Browse by Author), Update Glossary (with subtabs Settings, Assign roles, Override permissions)
4 Chat Enter to the chat (with subtabs Normal mode and without frames and Javascript), history, Update chat (with subtabs Settings, Assign roles, Override permissions)
5 Choice Edit, View responses, Update Choice (with subtabs Settings, Assign roles, Override permissions)
6 Assignments Edit, View attempts, Update assignments (with subtabs Settings, Assign roles, Override permissions)
7 Database View list, view single, search, add entry, export, templates, fields, presets, Update database (with subtabs Settings, Assign roles, Override permissions)
8 Lesson Preview, Edit (with subtabs collapsed, expanded), Reports, Grade essays, Update lesson (with subtabs Settings, Assign roles, Override permissions)
9 Survey Edit, View responses (with subtabs Questions, students, download), Update survey (with subtabs Settings, Assign roles, Override permissions)
10 Wiki Edit, View, Search wiki, History, Links, Choose wiki links, Administration, Update wiki (with subtabs Settings, Assign roles, Override permissions)

Screenshots

Quiz

Quiz.JPG

Glossary

Glossary.JPG

Chat

Chat.JPG

Choice

Choice.JPG

Forum

Forum.JPG

Assignments

Assignments2.JPG

Database

Database2.JPG

Lesson

Lesson.JPG

Survey

Survey.JPG

Wiki

Wiki.JPG

Possibility of moving tabs using javascript mentioned in the Fluid project (Javascript vs. AJAX)

This is related to support tab layout widgets. I think I might prefer javascript to AJAX as my impression has been that AJAX generally slows the page down especially for large courses. Again, some research on comparing these appoaches could be useful to the developers as we try to figure out how best to implement the tabs.

Circumstances would tabs cause more confusion or not be recommended

It would be recommended to add this tabs and delete the update activity button because the information of the activity is displayed in the same page and accessing with that button increments too much the number of clicks to update.