As part of the reproducibility project, I am working on improving the UX of applying JSON recipes (in the "History > Apply" dialog).
One feature I have implemented last month is the ability to adjust the column names mentioned in a recipe, so that they are compatible with the project the recipe is applied to. This means:
mapping any columns read by the recipe to columns already existing in the project;
giving names to columns created by the recipe, so that those names do not exist yet in the project.
Currently, the UI for this looks like this (for an example recipe taken from this tutorial):
Beyond the layout and wording, which can be improved I'm sure, I'd be interested to read what you think about the best way to select existing columns (in the first "Required columns" section). At the moment it's using simple text fields where the user needs to type the name of an existing column, but I think that would be improving, to help the user select a valid column name. I can think of multiple ways:
adding an auto-complete widget like for selecting reconciliation entities, adapted to work for columns,
no auto-complete widget, but some visual indication of whether the column name is valid or not (such as a green checkmark / red cross on the right-hand side of the field). The same sort of validation could be used for the created columns (which are required not to exist in the project);
using a UI similar to the Wikibase schema, with drag-and-drop of columns.
I think it would be useful to develop some UI elements that we would reuse in other places of the UI, to have a consistent experience around selecting columns.
I think autocomplete works great in this regard.
The example demo experience that I'm thinking of uses jQuery UI Autocomplete and has many examples on it's right side of it's page which can be combined for various behaviors.
At the moment it's using simple text fields where the user needs to type the name of an existing column, but I think that would be improving, to help the user select a valid column name. I can think of multiple ways:
Why not a native select-element(when picking existing columns)? It is; more or less resistant to user-errors, accessible by default, an existing pattern in OpenRefine, supports jumps in very long lists, ect.
A better select with search would indeed do good across OpenRefine but it might be better suited in a larger effort to tackle the current mix of UX patterns. Don't let perfect be the enemy, this functionality on its own moves the project forward!
but some visual indication of whether the column name is valid or not (such as a green checkmark / red cross on the right-hand side of the field).
Maybe just a native input with the pattern attribute? and possibly some CSS for border colors and such? It would be reusable in existing places more or less straight away.
Would this UI also be the place to notify the user if the recipe will delete columns that were not initially present in the project when the JSON was created? This is coming from this feedback
When you create workflows using JSON history with the step Re-order/remove columns, if you import a new file with extra columns you want to maintain, they are deleted when running the workflow. The workaround is to move and delete each column individually, which is cumbersome. (1 user)
I understand this is a scope change and I am OK having this addressed separately.
Yes, this is something I have been thinking about:
I am hoping that the visualization of the recipe (which I propose to show alongside the column mapping UI) will help highlight this issue. In this visualization, the column reorder operation will (so far) be shown as a big unanalyzable block that users should hopefully learn to avoid.
Beyond that, the introduction of more expressive operations for deleting multiple columns in one go (without reordering any other) and reordering columns without deleting any column could help with this issue, assuming we are able to expose them in the UI in a satisfactory way.
