New design for Nature Sort By

[foxintherain]

What

Design a new approach to the Nature Sort By component.

Why

The existing design unnecessarily relies on javascript and could be simplified. This will also help products to be more accessible.

Done when

• [x] Visual mockup is made
• [x] Reviewed by a developer
• [x] Reviewed by Amy

[foxintherain]

@benjclark See new design for Sort-By below, as we discussed:

When the Sort-by is its on its own:

[foxintherain]

@amyhupe @benjclark this might be part of the documentation but not sure if we want to come up with a limit on how many options can be used in the sort by? e.g. if we exceeded 5 options, it might be better to use a dropdown menu

[foxintherain]

Mobile (without filters):

Mobile (with filters):

[foxintherain]

Pandora have now created a jira ticket to update this: https://jira.springernature.com/browse/PAN-1598

[amyhupe]

Hi James,

This looks good. My only comments are about the wording of the sort by date radio labels.

1. We should say what the date represents. For example, is it Date published? Date updated? It might be worth including this point in the guidance, too.

2. If we're going to say "oldest first" then for consistency I think we should also say "most recent first". If that makes the label length feel clunky and uneven, you could try:

• Date updated (new to old)
• Date updated (old to new)

What do you think?

I'm aware we'll want people to decide the exact for themselves depending on what options they offer but I feel we should lead by example.

[foxintherain]

1. We should say what the date represents. For example, is it Date published? Date updated? It might be worth including this point in the guidance, too.

That makes sense, would we we also want to change the date filter above to "Date published" so this is consistent?

2. If we're going to say "oldest first" then for consistency I think we should also say "most recent first". If that makes the label length feel clunky and uneven, you could try:

* Date updated (new to old)

* Date updated (old to new)

Yes this reads better. Will update the design and check with Rosario (UX for Pandora) that "Date published" is the correct term.

[amyhupe]

That makes sense, would we we also want to change the date filter above to "Date published" so this is consistent?

Yes I think so!

[foxintherain]

@amyhupe Have check with Rosario and we can use "Date published" as the label.

Updated design: