Right way to display a list dates from the past, current and future, but show the most upcoming first

Question

So usually when displaying a list of things the answer is ascending or descending order. However as the most important item is somewhere in the middle this doesn't work.

Displaying the list ascending would show the item with the date in the past first. Descending the list would show the date in the far future as first. The user therefor has to scroll all the way down either way to get to the current date.

How can I overcome this problem, and put the focus on the most upcoming date.

Ive attached a screenshot to illustrate the problem. The focus should be on march 30 as that is the most upcoming date.

Answer 1

You can try pinning the row of the next upcoming date, and favor redundancy to enforce clarity about the next date.

If making sure users see the next upcoming date, you can enforce it by giving it some visual treatment, and pinning it to the top.

This way the sort order is ignored for just the first row, and keeps this date in the viewport.

You will have some redundancy, but there's less risk of them missing the important date.