search

gbif / hosted-portals

Support material for establishing the GBIF Hosted Portals
Apache License 2.0
9 stars 6 forks source link

Update the look of the FilterBar #248

Open jack-brinkman opened 1 year ago

jack-brinkman commented 1 year ago

One feedback I've received is that people may not immediately make the connection that the top buttons are related to filtering. Below is one variation that explicitly marks these buttons as filters - thoughts? @MortenHofft @djtfmartin

image

MortenHofft commented 1 year ago

It looks nice, but I'm must admit that I'm a bit reluctant and sceptical. Here is why:

I'm not convinced that users actually wouldn't know how to. Or at least this could be a classical case of "I knew how to do it (implicit: because I'm smarter than average), but I have a feeling that other people wouldn't know how to".

We have had the system in production for over a year and haven't heard that feedback before.

Is this part of the UI review? I do not remember seeing it, and I cannot get the video to play and I cannot find the link to the UI review report I'm afraid.

That said I'm not dead set against it, but here is other suggestions:

GBIF mock

Screenshot 2022-11-16 at 12 29 10

I do not see other sites spelling out filters. Perhaps they otherwise do a better job at indicating that it is filters, but then perhaps we could look to that?

AirBnB

Screenshot 2022-11-16 at 12 34 12

FlatIcon search

Screenshot 2022-11-16 at 12 34 45

Github

Screenshot 2022-11-16 at 12 35 10
djtfmartin commented 1 year ago

I'm not convinced that users actually wouldn't know how to. Or at least this could be a classical case of "I knew how to do it (implicit: because I'm smarter than average), but I have a feeling that other people wouldn't know how to".

This was flagged as an issue in the UI review, but I agree with this point. Im not convinced its a real issue.

+1 as well for the use of icons as an alternative to layout changes. I'd hope github-esque icons for Maps, Downloads, Sites could be sourced. Not sure what Events would look like though...

jack-brinkman commented 1 year ago

Ah, okay - thanks for the feedback @MortenHofft @djtfmartin. Renaming the 'more' button to 'more filters' & adding a filter icon sounds good. @qifeng-bai has included a clear filters button as part of his PR (https://github.com/gbif/gbif-web/pull/197/commits/7935fc3a7ad4483427fcc025bd377f5002d240cb).

jack-brinkman commented 1 year ago

@MortenHofft @djtfmartin I've added a simple filters icon, & renamed the 'more' button to 'more filters' - thoughts?

image

MortenHofft commented 1 year ago

I like that filters icon, the problem with it (as I see it) is that it might not scale pixel size well (does it? perhaps a simpler version could be used?). So it might be hard to use it in columns headers. And I would prefer we used the same icon throughout for filtering. Variations on the classic funnel might scale better. It isn't as nice, but I do think it is familiar (e.g. excel use it)

Secondly, it appears almost like an inactive button now (if it is a button what does it do?). Did you try just as text, black on white background?

jack-brinkman commented 1 year ago

Right - I tried to find a similar icon similar to the flaticon one you linked above (this one). I do agree though, it might be better to have some consistency and use the funnel icon. Here's what it looks like now:

image

MortenHofft commented 1 year ago

tried to find a similar icon similar to the flaticon one you linked above

That makes sense. Sorry.

I'm still sceptical when seeing it together with the catalogue dropdown on the top left.

Perhaps we could make it customisable so you can move on. I wouldn't want this version on the hosted portals I must admit. Partly because i think it is a bit visually awkward/unbalanced, and secondly because I'm still not convinced that users actually struggle (perhaps they just haven't dared to tell me because they know I will be like this :D )

Screenshot 2022-11-22 at 10 03 01

I'm moving this issue to the hosted portal repo so that other site owners can comment

jack-brinkman commented 1 year ago

That's all right - if you're not too keen on it being a part of the hosted portals, I'll leave it for now. With the funnel icon, it did look a tad odd anyway. I'll revisit this issue if it's brought up again. Changing the more filters button might make it intuitive enough for everyone.