o²S²PARC UX/UI Improvements

[elisabettai]

Description: Feedback-based: In addition to Team Black input (see NewY7–(Task) 1f: Team Black Interactions), user feedback will continue to be collected via the SPARC Portal’s feedback form (Wrike), o²S²PARC’s Github issues repository, support emails, the NIH SPARC Slack channel, and SIM-Core’s internal messaging channels at the IT’IS Foundation. Feedback case priorities will be assigned by Team Black, users, and the development team according to importance and effort and then selected for development during every SIM-Core SPRINT.

Deliverable: Slides as part of the monthly NIH SIM-Core Update meeting

Deadline: Continuous task

wrike Y7–(Task) 1c: o²S²PARC UX/UI Improvements

[elisabettai]

Y7Q2 Status update (02/29/2024): Continuously Ongoing Implementation: Presented to the NIH at the monthly update meeting on 02/07/2024 and 02/28/2024

Key new functionalities and UX/UI improvements:

• General improvements to the UI appearance and user experience: -- The action buttons (e.g., “Open”, “New Node” to add a Service to the pipeline) are now highlighted with colors that respect product specific themes (different for osparc.io, tip.itis.swiss, s4l-lite.io). This change provides visual guidance to the users to identify the most important actions; -- Improvements to the drop-down menus, for example by introducing highlighting on selection -- The workbench UI colors in light mode were made consistent with product theme
• New dialog to prompt users to update their services: since Y6, users can perform patch updates (e.g., from version 1.0.1 to version 1.0.x) with a single click. However, when updates were available, they often passed unnoticed. If users do not update, they might forgo improvements and performance enhancements (e.g. the latest version can be started faster). To overcome these limitations, we introduced a new dialog that prompts users to update when they open a Study. The update is not mandatory, so if users wish, they can keep the current version
• Dashboard organization: a recurring user feedback is that the number of studies in the dashboard can grow rapidly and become very disorganized. The ideal solution involves allowing users to create folders - however this implies a currently unaffordable effort, in particular when considering how to deal with shared studies inside folders. As intermediate, lower-effort solutions, we introduced two features that help users organize their studies and search for studies: --Sorting and filtering of project: we introduced new functionality to sort studies by different criteria (e.g. by creation date, last modification, owner). Together with the filtering functionality that was introduced in Y6, this helps users rapidly find study of interest. -- Study thumbnails: A common means of identifying studies is by their thumbnail images. While we kept the current functionality to assign thumbnails (i.e., any static or animated image that has a public link can be used), we introduced a new “gallery” presenting a predefined set of thumbnails (proposed by us and easily extensible) that users can select with a single click.

[elisabettai]

Y7Q3 Status update (05/27/2024): Continuously Ongoing Implementation: Presented to the NIH at the monthly update meeting on 03/27/2024 (see slides and minutes)

Summary of UX/UI improvements:

• Refactoring of the Study Details Page: since this is the first contact users have with a Study, it was considered important to improve its utility, informativeness, and readability, by reorganizing text and thumbnail from top to bottom and adding labels to the left column (in addition to the existing icons), to make it easier to discover and find functionalities (e.g., sharing, adding/modifying tags, etc.)
• “More Options” menu: this is a shortcut on the Study Card to rapidly access the most important functionalities. The menu has been re-organized (with separators) and new shortcuts have been added (e.g., to add a thumbnail)
• Secondary column in the Study workbench: since users reported finding it hard to locate operations associated with Services inside a study, we completely overhauled the secondary column in the Study workbench. The three original tabs were replaced by a single one in which users find all the information and functions associated with input ports, output ports, and Service settings in a single, collapsible view.
• Progress and status messages: some operations on the platform can take long (e.g., opening studies with tens of GB of data). While a significant speed up can only be achieved with major architecture changes, we now provide information that helps users estimate the remaining wait time. When opening studies, progress is now reported for each step, considering data size where relevant. This also required changes to the interactive Services backend #1082
• Two-factor authentication (2FA): Users can now disable 2FA and adjust their 2FA preferences (e.g., e-mail instead of SMS)
• “Captcha” in the registration form: to avoid account requests by bots, we added a captcha.
• UI improvements to computational pipelines: to ensure consistent results in computational pipelines, users are prevented from modifying the pipeline during Service execution. This was not always evident to users. We now inactivated the Service deletion button while the pipeline is running. In addition, a “temporary Service” UI concept was introduced: when users try to add a new Service, a loading icon is shown that turns into a Service once the backend has confirmed that it can be added (i.e., once the pipeline has finished running and users are allowed to modify it).