- in total, there are two types of filters:
- input fields
- user input with auto-suggestion for the input
- once clicked, a dialogue opens with max. 10 suggested values, each with a checkbox
- the checkboxes can be selected and the respective value can be added to selected filters by clicking on them
- dropdown fields
- if the amount of filter values the user can select is rather small, a dropdown menu is used instead of an input field
- input fields
Filters - Items - 2025 - Desktop view:
Filters - Items - 2025 - responsive view:
Elements
ID | Title | Show? | Action | Changes | Tickets | ||||||||||||||||
| 1 | filter header | always | clicking on it closes the filter box | ||||||||||||||||||
| 1a | amount of filter values | when a min. of 1 filter is selected | (de-)selecting filter values changes the number | ||||||||||||||||||
| 2 | reset all filter values | when more than one filter was selected | all filter values can be removed, which leads to the content on the page adapting | ||||||||||||||||||
| only shown when filter value was selected |
| ||||||||||||||||||||
| 3 | filter area | always | filter values can be selected and are shown below the respective category | / | |||||||||||||||||
| 3a | input filters | always | user types a term into the field, a group of filter values are displayed based on the input | no more placeholder text |
| ||||||||||||||||
| remove auto-complete of browser |
| ||||||||||||||||||||
| 3b | dropdown filters | always | user opens a dropdown menu with a set amount of results from which the user can select | / | |||||||||||||||||
| 3c | time filter | always | / | / |
| ||||||||||||||||
| 4 | selected filters (pills) | when filters were selected | filter value can be removed, which leads to the content on the page adapting in the background |
| |||||||||||||||||
| width adjustment |
| ||||||||||||||||||||
| 5 | dropdown menu | when user interacts with a dropdown filter |
|
Other Changes
Responsive View
- responsive viewimplementation:
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-6380
6522
- modal fills out entire screen
Other Changes
- implementation:
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-65226380
- bottom of module:
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-6523
- behavior:
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-6518
- accessibility
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-6541
- rights statements changed from input to dropdown menu:
Jira server JIRA - Deutsche Digitale Bibliothek serverId 67c0afcf-3564-3fd0-8d4d-a69afd7aed63 key DDBNEXT-6578
Figma
Filters - Robert Mikuljan (2025)