App relies too heavily on icons for UI

One of the biggest changes in the new app is that virtually all of the functionality happens via clicking on icons that have no text explaining what they do. This is fine for familiar icons like the bell icon for notifications and the “hamburger” icon for the menu, but for a lot of these I was completely mystified as to their function and could only figure it out by clicking them and hoping it didn’t break anything. Some examples:

  • I wasn’t sure what the binocular and leaf icons in Explore mode did until I tried them.
  • I assumed that the circle arrow icon meant refresh, not sync (although I’m not sure this distinction matters that much).
  • I wasn’t sure what the badge-plus in a circle did (or if it was even a button) until I tried it and found out it meant “Agree”.
  • I wasn’t sure what the window-looking icon did until I tried it.

I think having a few icons that the user has to “discover” is OK (lord knows Apple does this all the time), but relying almost exclusively on icons with no text labels makes the UI intimidating and confusing for new users, and correct me if I’m wrong but I think the iNaturalist app is shooting to be accessible to a very broad range of users (even broader than the website).

Here are a few suggestions for improvement. I’m not a UI designer, so please take them with a grain of salt:

  • Put some small text labels under some of the icons (like in the old app).
  • Change the Agree button to “Agree” or something more intuitive looking (a green checkmark?).
  • Change the grid/list toggle into a single button that has both icons and switches which one is highlighted when you click it.
13 Likes

There have been a lot of requests to get rid of the Agree button on user’s own observations. I think having the icon to expose the agree button is a good compromise.

3 Likes

Another mystery icon: what does the little green circle with white checkmark in the species explorer mean? It’s not clickable; some species have them, some don’t.

1 Like

I believe a species will have the green checkmark if you’ve observed it before.

4 Likes

Another Item which I’ve wondered on mobile, why are some observation ID’s bold? Screenshot for example. First goldenrod observation is not bold, the second is bold.

1 Like

Would you please tell us your OS and the app version.

1 Like

please see the announcement: https://forum.inaturalist.org/t/inaturalist-next-app-soft-launch-for-iphones/55277

1 Like

One more problem. There is too much UI in general. It is almost imposible to fast scan over the observation in tiled mode because there are many icons and texts completely hide the photo itself

It will be nice to have ability to hide all UI from thumbnails.

5 Likes

I’m an Android user so I haven’t had a chance to use the new app myself, but just from looking at that photo, I’m quite surprised that the ID/comment/grade icons are across the middle of the photo tile, and not along the top.

I’d think that from a visual readability perspective, you’d want to fill in the edges before blocking the centre of the photo, which is most likely to be where the subject of interest is.

1 Like

This category is for the newly soft-launched iNaturalist Next app. The screenshot you shared is from the standard iNaturalist app. I think it’s likely a minor bug, but probably not something that will be fixed since that app will eventually be replaced by iNaturalis Next.

I’m also an Android user, but use the new app for a while (via manual app download from inat github).
And yes, you are right. Especially if observation have long science and common names.

1 Like

one of the biggest things overlaid on the images is what i interpret as a quality grade flag. i wonder why a separate flag is necessary? couldn’t you just make 3 different variants of the identification pin icon to account for the 3 different quality grades?

i guess the new flag with the stylized people emphasizes the community identification aspect of iNaturalist, and maybe that’s fine to keep when you have more space, but when you have less space, it seems like it’s unnecessary.

5 Likes

How can I do it?
I don’t find it in the GitHub
It’s not for me, I do have the App

The new app does have way too many new icons and too much clutter. The print is much smaller than the old version and not only smaller, but paler and harder to see. I found it very hard to use.

3 Likes

Even the Help page has tiny pale colored print.

The app should be able to handle larger font size options better than the old one, so you can choose to see larger fonts in iNaturalist Next. Here’s what a slightly larger font looks like on my device:

Here’s one way to adjust font size for a specific app: https://www.theverge.com/22580423/ios-15-iphone-text-size-how-to-control-center

Are you referring to the help website?

2 Likes


The green coloration doesn’t help.

1 Like

Another option (if you didn’t want to get rid of the icons) would be to give the user a little tutorial walk-thru the first time they encounter a new part of the app. It could have little bubbles that explain what each button does. Just an idea. Now that I’ve figured out what all the buttons do, I actually like the efficiency of the design, but I have to admit that I was lost at first.

10 Likes

Not a designer, but I think one reason we wanted to go with a more icons-based design is to make the app more accessible to people who can’t read. It would also mean that lack of translation into certain langauges wouldn’t be as a big of a barrier as it currently is. But yes, the downside is that some of the icons can be inscrutable at first. It’s good feedback, I’ve been using the app for 8+ months now so I’m used to them.

I like this idea. I also like the idea of making the grid/tile view really about the photos and not about info - info is what list view is for.

7 Likes

Personally, I really like the icons and find them mostly very self-explanatory.
Especially as stuff like the leaf and the binoculars already exist elsewhere with the same context.

The only one I found a bit unclear is the compass-looking one that opens the explore page. It’s weird, IMO, that it is both in the bottom row and also above the observations on the personal observations page, where it opens the explore page, but filtered to show only your observations. Personally, I don’t see the use of that latter one.

2 Likes