Citatenplugin (refinement)

Goals

Rework the citatenplugin to be more user-friendly.

Plugin trigger

Current state

• Citatenplugin can be triggered by typing a keyword ("decreet van, besluit van,...")

• Using the "Voeg sjabloon in" button on the top-right will also trigger the plugin

Citatenplugin triggered via keyword

Issues & Improvements

• There is a need for a manual trigger, which is more prominent than the "Voeg sjabloon in" button

• Suggesting the use of the citatenplugin in the right context ("Motivering") (and disabling plugins which shouldn't at that time)

The plugin hints show up as enabled in the relevant section.

For more in-depth information about Plugin triggering and hints, see the Plugin hints exploration (refinement) page.

Quick view

Current state

Once the plugin is triggered, a quick view appears on the left-hand side, with:

• First 5 decrees

• Pagination to click-through decrees

• Advanced search option

• Clicking on the icon left from the citation will quick-add the citation to the document

• Clicking on the citation will open up the modal

Citatenplugin quick view visible on left-hand side

Issues & Improvements

• Adding a search option to the quick view

• Replacing the first 5 decrees with Suggested decrees/Favourites/Most recently used

• Omitting pagination, but keeping the advanced search option (opens up modal)

• Clicking on the citation will quick-add it to the document (this is a change from what we currently do)

• Clicking on "Selecteer artikel" will open up the modal, letting the user select the article they want within that decree.

Citatenplugin with improvements

We need to decide what the best way is to call "Selecteer artikel".

Edit citation

Current state

Currently, a citation cannot be edited or deleted through the plugin.

Clicking on an existing citation in the document doesn't trigger any change.

Issues & Improvements

• When the user selects a citation in the editor, the plugin recognises this.

• The user can edit the citation, opening op the modal to choose a specific article in from the decree.

• The user can also delete the citation, in which case the citation plugin will revert into the default view, letting the user search for- and select a new decree/article.

Editing of a citation

Modal

Current state

Using the advanced search button opens up a modal, where a user can filter through decrees and articles.

Current view of the citatenplugin modal

Issues

• The modal is full-screen. Users get confused and use the back button on their browser to exit the modal, rather than the close button.

• We currently have no way of searching for specific articles within a decree.

• We currently have no way of adding multiple decrees/articles simultaneously.

Short-term Improvements

• While we still work on a long-term solution to possibly replace the modal entirely, having a smaller version of the modal will allow users to understand they are still on the same page, rather than a new one.

• Similarly to the quick-view, clicking on the citation will add the decree to the editor, while clicking on "Selecteer Artikel" will take the user to the next step in the modal.

• The next step in the modal will have a search box to allow the user to search for articles within the selected decree.

Short-term improvement of the modal (screen 1)

Short-term improvement of the modal (screen 2)

Future possibilities

• Instead of a modal, we could work with a split-screen, with the plugin modals on the right-hand side, similarly to the improvement mentioned above.

Screen 1 - quickview

Screen 2 - advanced search/modal

How does the date filter work? Currently there are 4 fields. We could already half this by using a range datepicker.

Advanced search is currently dynamic. We could also add a Search button and treat the results as a next step. The design already exist for this in Figma.

Screen 3 - advanced search results

Notes

We need to make the modal on the right scrollable for instances where there are a lot of search results (e.g. screenshot 3)

We need to add a way to collapse the modals/plugins on the right-hand side to allow the user to only view them when needed (add this in the toolbar next to "toon annotaties?")