Clean up the Badges area in Achievements

1 Initial Problem

Badges currently offer a "View" and a "Manage" tab. Both offer essentially the same options. The difference is difficult to grasp except for the form of visualisation.
 
Current view tab:

• The details view of a badge in the modal dialogue, accessible via the title of a badge, is not visually attractive and could be clearer.
• There is no option to sort the badges.

• The detailed view of a badge is not available in the list view.
• There is far too much noise on the screen. For example:
  • the display of rows
  • the row selection
  • the actions menu which only offers redundant actions to the multiaction
  • the two filter criteria by badge title and object title appear to be unnecessary

2 Conceptual Summary

There should be no more tabs.
View and Manage offer the same actions. The only difference is the representation.
Therefore, a toolbar is to be introduced that contains a view control mode.

• Mode (1) Tile View | Tile
• Mode (2) List View | List

Details of Mode "Tile View"

The Tile View also receives a View Control Sortation with the options

• Title Ascending
• Title Descending
• Issue Date Ascending
• Issue Date Descending

Details of Mode "List View"

The List View also has a toolbar that shows the View Control Mode.

• The table is reduced by all unnecessary information:
  • No row display
  • no row selection
  • (Comment: I know of no use case with more than 25 badges. Even if there were 50, I estimate that this is not necessary).
• The Actions column is removed as there is only one action at a time (Add to Profile | Remove from Profile). This action is easily done via the Multi-Action.
• The filter is removed. Due to the amount of badges, filtering by badge title is oversized. Filtering by object title from which the badge was assigned is not practical in my opinion.

Revision of the modal

The modal with all information on the badge should also be accessible from the list view – also via click on the Title.
 
The content of the modal is cleared up. A Standard Item (KS Docu) is used for the badge information. Instead of the object icon (as on the Dashboard), the standard icon for badges is used. Above, the badge is still represented by its image.
Button in Modal is changed from "OK" to "Close".

3 User Interface Modifications

3.1 List of Affected Views

Achievements » Badges

3.2 User Interface Details

• ViewControl Mode
• ViewControl Sortation

3.3 New User Interface Concepts

3.4 Accessibility Implications

We do not see any accessibility implications.

4 Technical Information

None

5 Privacy

No personal data is stored or processed to implement this feature. 

6 Security

We do not see any changes for special security issues.

7 Contact

• Author of the Request: Samoila, Oliver [oliver.samoila]
• Maintainer: Jansen, Michael [mjansen]
• Implementation of the feature is done by: {The maintainer must add the name of the implementing developer.}

8 Funding

If you are interest in funding this feature, please add your name and institution to this list.

• Technische Hochschule OWL

9 Discussion

Kunkel, Matthias [mkunkel], 29 APR 2022: Thanks for this valuable improvement of the badges presentation. I just have two remarks/questions:

1. Can we use a better label for "Object"? E.g. "Awarded by". This makes it clearer that the badge is coming from this object.
2. Would it be possible to make the submit action of "Adding Badge to Profile"/"Removing..." an AJAX call? This would avoid reloading the page everytime you add or remove a badge from the profile – and therefore reduce the server load.

JourFixe, ILIAS [jourfixe], 02 MAY 2022 : We highly appreciate this suggestion and schedule the feature for ILIAS 9. We prefer the label "Table View" instead of "List View" and the suggested "Awarded by" instead of "Object" in the tile and as column header. And we don't want to introduce a special case for a AJAX call for the adding/removing action.

10 Implementation

{The maintainer has to give a description of the final implementation and add screenshots if possible.}

Test Cases

Test cases completed at 22-06-2022 by Scharmer, Lukas [lscharmer]

• C12706 : Badges in Lernerfolgen einsehen (Kachelansicht)
• C49955 : Badges Modal in Lernerfolgen öffnen
• C49956 : Badges Modal in Lernerfolgen schließen
• C49954 : Badges in Lernerfolgen einsehen (Listenansicht) ILIAS 9
• C12727 : Badges zum Persönliche Profil hinzufügen (Kachelansicht)
• C12731 : Badges aus dem Persönliche Profil entfernen (Kachelansicht)
• C12732 : Badges im Persönlichen Profil umsortieren (Kachelansicht)
• C49957 : Badges zum Persönlichen Profil hinzufügen (Listenansicht) ILIAS 9
• C49958 : Badges aus dem Persönliche Profil entfernen (Listenansicht) ILIAS 9
• C49959 : Kachelansicht sortieren ILIAS 9

Approval

Approved at 2023-09-12 by Fischer, Yvonne [yvonne.fischer].