Provide visual feedback when adding or editing IDs and comments

Feature Requests
1

Platform: website

Description of need:
Add visual feedback to each of the following operations on the observations page:

  1. Add a new ID
  2. Add a new comment
  3. Edit an existing comment
  4. Edit an existing ID

None of the above operations provide adequate visual feedback that indicates the operation was successfully completed.

Feature request details:
When I press the Agree button on an individual observations page (observations/OBS_ID), the button is dimmed and a spinning icon is displayed. This minimal visual feedback is crucial. Without it, valuable data may be lost.

Unfortunately, other operations on the observations page do not provide adequate visual feedback. Consider, for example, the following operation:

Add a new ID:

  1. Press the “Suggest an Identification” tab
  2. Specify the ID
  3. Optionally enter the text of a comment
  4. Press the Done button

Similar to the Agree button, the above operation may fail due to a poor network connection and/or a busy server. Since there is no visual feedback, a failed operation may go unnoticed, in which case the ID will be lost.

When a new ID is added (by either of the above methods) and the operation succeeds, other portions of the observations page may be dynamically updated. In particular, the observation ID or the Community Taxon may be updated. These are not sufficient, however. To see why, consider the following simple operation:

Add a new comment:

  1. Press the Comment tab
  2. Enter the text of the comment
  3. Press the Done button

Immediately after the Done button is pressed, the new comment is inserted into the timeline, suggesting to the user that the comment has already been saved on the server. This is a red herring since in fact the operation may still be in progress, with no guarantee of success. If the operation does succeed, there is no visual feedback to indicate this has occurred.

The previous example shows why even the visual feedback on the Agree button is inadequate. Immediately after the Agree button is pressed, the new ID is inserted into the timeline, suggesting that the ID has already been saved on the server. As a result, the user may overlook the dynamic Agree button.

Two additional operations on the observations page do not provide visual feedback:

Edit an existing comment:

  1. Select Edit from the drop-down menu
  2. Edit the text of the comment
  3. Press the Save Comment button

Edit an existing ID:

  1. Select Edit from the drop-down menu
  2. Edit the text of the comment associated with the ID
  3. Press the Save Identification button

In both cases, the edited text is immediately displayed, suggesting that the comment has been saved on the server, which is yet another red herring. I’ve lost many comments as a result of these processes.

2

I’m for adding better/more visual feedback here. For what it’s worth, when adding a new ID or comment, there is very subtle visual feedback when adding a new ID or comment. The little down arrow is gray until the newID/comment is saved. It then turns black.

image

1 Like
3

I’ve never noticed that! Thanks for tip!

For comparison, the corresponding operations on the Identify page do not have these issues. The ID or comment is not added to the timeline until the operation succeeds.

3 Likes
4

Issue here: https://github.com/inaturalist/inaturalist/issues/3521

5

This appears to be fixed! The newly added UI element is grayed out until the transaction is complete.

6

Yup! Added today.

2 Likes