Feature Wiki
Tabs
Streamlining Blocks as Panels
Page Overview
[Hide]- 1 Initial Problem
- 2 Conceptual Summary
- 3 User Interface Modifications
- 4 Technical Information
- 5 Contact
- 6 Funding
- 7 Discussion
- 8 Implementation
- 8.1 Adapt blocks My Memberships, Selected Items to Listing Panel
- 8.2 Adapt side blocks on Personal Desktop to Secondary Panel
- 8.3 Adapt side blocks in Wikis to Secondary Panel
- 8.4 Adapt side blocks in Courses to Secondary Panel
- 8.5 Adapt side blocks in Groups to Secondary Panel
- 8.6 Adapt side blocks in Categories to Secondary Panel
- 8.7 Adapt Poll to Secondary Panel
- 8.8 Adapt Webfeed to Secondary Panel
- 8.9 Adapt side blocks in Blogs to Secondary Panel
1 Initial Problem
Because of the Abandon Levels of Details and Movability of Side Blocks on PD, the use of ViewControls and Page Layout Revision, all page blocks are also to be converted into a uniform design.
2 Conceptual Summary
see above
Block | Settings in 5.4 | Suggested in 6.0 | Context | Note |
---|---|---|---|---|
My Memberships | [Sort by Type] | View Control Sortation |
| Sortation (Title Ascending | Title Descending | by Location) |
Calendar | [Upcoming Events] | View Control Mode |
| Mode ( Month | Upcoming Events) (Month=default) |
Mails | View Control Pagination (if necessary) |
| ||
News | [Settings] | View Control Mode |
| Mode (Week | Month | Year) (Month=default) |
Study Programes | - | - |
| No functionality changes required. |
Recommendation (formerly Selected Items) | [Sort by Type] | View Control Sortation |
| Sortation (Title Ascending | Title Descending | by Location | Startdate Ascending | Startdate Descending) |
3 User Interface Modifications
3.1 List of Affected Views
- Repository » Recommended Content (formerly Selected Items)
- Personal Desktop » Overview
- Repository-Object Category
- Repository-Object Course
- Repository-Object Group
3.2 User Interface Details
MockUps CENTRAL BLOCKS
![](./data/docu/mobs/mm_65284/Bildschirmfoto_2019-01-02_um_15.51.30.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
![](./data/docu/mobs/mm_65286/PD_Revision_Panel_-_My_Memberships__Courses__Groups_800_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
![](./data/docu/mobs/mm_65289/PD_Revision_Panel_-_Study_Programmes_800_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
MockUps SIDE Panels
Uses a new Side Pane » See PR: Standard Listing Panels within Side Blocks (and Slates)
![]() | Listing Panel Standard » new Side Panel
|
![]() |
|
![]() |
|
![](./data/docu/mobs/mm_65293/PD_Revision_Panel_-_Calendar_400_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
![](./data/docu/mobs/mm_65295/PD_Revision_Panel_-_News_320_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
![](./data/docu/mobs/mm_65298/PD_Revision_Panel_-_Mails_320_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
![](./data/docu/mobs/mm_65404/Bildschirmfoto_2019-01-02_um_15.18.01_320_0.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
3.3 New User Interface Concepts
Use
- View Control Mode
- View Control Sortation
- Central Panels (formerly CentralBlocks) » uses KS Panel » Standard (Need an Example with ViewControls (#4))
- Sidepanels (formerly SideBlocks) » uses UI Presentation of Standard Listing Panels in Side Panels and Slates #1414
Proposal for display: The headlines of the page blocks should always be right-aligned. (This does not match with the MockUps.)
4 Technical Information
None.
5 Contact
- Author of the Request: Samoila, Oliver [oliver.samoila]
- Maintainer: Killing, Alexander [alex]
- Implementation of the feature is done by: Killing, Alexander [alex]
6 Funding
If you are interest in funding this feature, please add your name and institution to this list.
7 Discussion
Seiler, Yvonne [yvseiler], 20.12.2018: Many thanks for all the helpful mockups. In general I think the idea of converting the side blocks to a panel and adding actions, view modes and sorting to the panels makes sense.
I have a few visual comments:
- To break the "law of proximity", I would create a gradation between "panel toolbar" and the panel content. For example, in the Presentation Table - Redesign Visual Presentation we made an adjustment to the table header, where View Mode and Sortation are also included. The advantage of this is that the buttons are not only visually associated with the first entry, but are positioned above the entire content of the panel.
- In addition, I would tend towards more subtle buttons. Currently the focus is strongly on the buttons and not on the panel content. With visually more restrained buttons the focus could be put back on the content and not on the buttons themselves.
- The same procedure could also be used for the side blocks. The exact visual representation could still be discussed. Below I added a few first suggestions.
- With the change of the side blocks to panels these contents resemble also more strongly the object "Item Group". This has a small action menu on the right. Maybe this would also be a useful solution for the collection of actions in a panel (at least side blocks would work the same as item groups).
- In the view mode "tile / list" I would like to start the race, if glyphs would make sense here (see suggestion in accordion)?
Killing, Alexander [alex], 3 Jan 2019: Thanks for these suggestions. I would like to share some of my preferences
- The current UI Framework description of the Panels states that "Standard Panels are used in the Center Content section to group content". I think we should respect this and not use Standard Panels for side blocks, but instead migrate the current side blocks to a new Panel subtype Side Panel. Side Panels will have a different look (more subtle, since they are not the main content) and could also have other rules.
- The current description of Panels states that "Additionally an optional Dropdown that offers actions on the entity being represented by the panel is shown at the top of the Panel". I would also respect this rule and not make actions like "Manage Portfolios" buttons. These things belong in an action dropdown imo.
- I would focus this feature wiki page on the blocks that "should be kept or introduced" as stated on the Overview Personal Desktop Revision page:
- Remove the notes/comments screenshots, since these are other views which should be discussed separately.
- Discuss only the future blocks of the overview screen on this page: Courses, StudyProgrammes, Calendar, Mail, News, Tasks
- The current block "Selected Items, My Memberships" should be migrated to Standard Listing Panels imo.
- The interactive elements in the Side Panels should be much more subtle.
- Actions should be represented in the action Dropdown (arrow glyph only). This is the current state of the Panels in the UI Framework.
- The Sortation View Control could be added to the panels and be represented beside the action Dropdown glyph in a minimal version (using only the Sortation glyph).
- An open issue are the Mode View Controls in Side Panels: Yvonne made an improved suggestion here, but in my opinion even this is "to heavy" and not subtle enough for the side panels. I would suggest to move these options to the action Dropdown for Side Panels (using a Horizontal Divider) and not to use the Mode View Control here.
Killing, Alexander [alex] 9 Jan 2019: If we have the Side Panels accepted, we should also define which components we are going to use inside of the Side Panels. I made a PR for using Standard Listing Panels within Side Blocks (and Slates).
Amstutz, Timon [amstutz] 15.01.2019: We (@tfamula , @klees , @alex40724 and @Amstutz ) discussed the base idea of side panels and their similarities with slates today in a skype meeting (full record of the meeting: https://edupad.ch/p/ym7klsMeXz). We agreed on the following next steps:
- We need distinction between side panels and slates (as precise as possible) in the rivals section.
- We agree that the name "side panel" gives too much indication on the placement, we need a better naming.
- We agree that the side panels will only introduce a listing panel and a legacy panel for the moment to generate more data for a possible unification of slate and "side panel" or for a clearer distinction between the two
Killing, Alexander [alex], 30 Jan 2019
- Instead of Side Panel we suggest "Secondary Panel" or "Accompanying Panel".
- Rival Slate: Secondary Panels should be used to contain content or components that have a strong relationship to the current screen context. Slates are used to display components that should be available independent from the current screen. Slates depend on a component that toggles their visibility, Secondary Panels don't.
JourFixe, ILIAS [jourfixe], 11 MAR 2019 : We highly appreciate this suggestion and schedule the restructuration as described in chap. 2 for ILIAS 6.0. Details about the visual implementation will be discussed with the new UI elements that still need to be finalised and commited.
8 Implementation
8.1 Adapt blocks My Memberships, Selected Items to Listing Panel
Test Cases
Test cases completed at 16. OCT 2019 by Zenzen, Enrico [ezenzen]
- C18384: Standard-Sortierung für "Meine Kurse und Gruppen" konfigurieren
Approval
Approved at 2019-12-06 by Samoila, Oliver [oliver.samoila]. (My Memberships and Selected Items | Favourites)
8.2 Adapt side blocks on Personal Desktop to Secondary Panel
Test Cases
Test cases completed at 16. OCT 2019 by Zenzen, Enrico [ezenzen]
- C1855: Ausgewählte Angebote sortieren
- C1856: Ausgewählte Angebote aus Liste entfernen
- C7211: Mehrere Objekte entfernen
Approval
Approved at 2019-11-26 by Samoila, Oliver [oliver.samoila]. (Personal Desktop / Dashboard to Secondary Panel)
8.3 Adapt side blocks in Wikis to Secondary Panel
Test Cases
Test cases completed at 16. OCT 2019 by Zenzen, Enrico [ezenzen]
- C435: Navigation aufrufen
Approval
Approved at 2019-11-19 by Samoila, Oliver [oliver.samoila]. (Wikis to Secondary Panel)
8.4 Adapt side blocks in Courses to Secondary Panel
![](./data/docu/mobs/mm_70678/Secondary_Panel.png?il_wac_token=44d3bebbc7d8d76e5f05a4ef72117daca85072ec&il_wac_ttl=5&il_wac_ts=1725752276)
Test Cases
Test cases completed at 16. OCT 2019 by Zenzen, Enrico [ezenzen]
- C5983: Zusammengefasste News aus Kursen und Gruppen
Approval
Approved at 2019-11-26 by Samoila, Oliver [oliver.samoila]. (Course to Secondary Panel)
8.5 Adapt side blocks in Groups to Secondary Panel
Approval
Approved at 2019-11-26 by Samoila, Oliver [oliver.samoila]. (Group to Secondary Panel)
8.6 Adapt side blocks in Categories to Secondary Panel
Approval
Approved at 2019-11-26 by Samoila, Oliver [oliver.samoila]. (Categories to Secondary Panel)
8.7 Adapt Poll to Secondary Panel
Test Cases
Test cases completed at 16 OCT 2019 by Zenzen, Enrico [ezenzen]
Approval
Approved at 2019-11-19 by Samoila, Oliver [oliver.samoila]. (Poll to Secondary Panel)
8.8 Adapt Webfeed to Secondary Panel
Test Cases
Test cases completed at 16. OCT 2019 by Zenzen, Enrico [ezenzen]
- C2029: Edit External Web Feed
Approval
Approved at 2019-11-26 by Samoila, Oliver [oliver.samoila]. (Web Feed to Secondary Panel)
8.9 Adapt side blocks in Blogs to Secondary Panel
Test Cases
Test cases completed at 16 OCT 2019 by Zenzen, Enrico [ezenzen]
Check the layout of the Postings Side Panel in the following test case.
- C1926: Datum editieren
Approval
Approved at 2019-12-05 by Samoila, Oliver [oliver.samoila].
Last edited: 30. May 2022, 20:19, Samoila, Oliver [oliver.samoila]