Skip to main content
2 of 15
Fixed formatting of heading (sorry!)
Wai Ha Lee
  • 8.8k
  • 7
  • 45
  • 70

New Navigation Release Candidate

TLDR: We overhauled the navigation again, to get it you need to opt-in via the user preferences page, and we want your general feedback (love it / hate it) after you try it for a few days. We are planning to deploy it before the end of the year, and your feedback is important.

new new nav

New new nav: back to the drawing board

It has been 6–8 weeks since the last release of new nav, and we have been adding all the features that you have requested based on the previous iteration, plus working on an anonymous mode of the navigation. Initially we simply tried to add stuff, but we realized that adding more features by itself was making the interface too cumbersome. A new approach was needed. Or, as our fearless leader David said: we had reached a local maximum (technically the plural word maxima was used, but we can forgive that).

We went back to the drawing board and between August and early September we redesigned the navigation based on all the input of the previous months. In September we built a prototype, and tested it internally. Now we have reached what we consider an MVP which you can try out.

This has been released in the alpha channel on Stack Overflow (currently 20,000 users have opted in to this) from today. Once we smooth out the known issues and the bugs you identify we will begin testing on a larger scale and we will A/B test the solution to see if our users navigate better with it.

Here's how it works.

Basic Navigation

The purpose of basic navigation is to give a simple set of tabs for users that only want to use the mouse. Think of it as a “GUI” version for users. The purpose of basic navigation is to give a simple set of tabs for users that only use the mouse. Numbers show that most navigation currently happens on these tabs (this covers 94% of the hits on question lists):

  • Home page
  • Newest questions
  • Questions sorted by vote
  • Active questions

Homepage

Our solution brings these tabs on the homepage, directly linked (no typing necessary). Furthermore we have an explicit call-out to favor bountied questions.

homepage

This introduces clicking on tags as a navigation element. Furthermore it directs users to the new tag filter interface which is introduced later.

Inner pages

All inner pages are now shown as “temporary” tabs on the homepage. This is indicated by a “*” prefix on the tab name. For example, clicking on the “windows” tag leads here.

Temporary tabs will go away if the user navigates away from the page. This interface supports all links that are supported by the current navigation, including those not filtered by tag.

The temporary tab is automatically given an appropriate name, similarly to how page titles currently behave. For example, if the “windows” tag is filtering the list, then the tab is called “windows”. If, however, there is no tag filtering, but the questions are shown by activity, then the tab is called “active”.

In the specific case of clicking on a tag the tag excerpt is shown, which includes new submenu entries.

temporary tab

If a link leads to a page which is the same as a tab which already exists (e.g. active, votes…), then the corresponding tab is selected instead of adding a new tab.

Real time

If any tab is eligible to get real time updates, we will track it, whether it is in the foreground or not. This has the advantage of alerting the users of new questions on multiple tabs, similarly to what currently happens if a user has multiple browser tabs open (titles get the number of new or updated posts).

real time

Advanced Navigation

Advanced navigation covers the new features we are introducing with the new, new nav. Their purpose is to enhance navigation and to increase the likelihood of finding a question to answer.

These include the possibility of saving tabs (a registered user only feature), restoring old navigation tabs and renaming or deleting tabs. Furthermore we are extending real time notifications so it works with multiple in-page tabs.

Saving tabs

Temporary tabs are saved by clicking the “save” button. Thus they become permanent tabs. This function is disabled if the tab is already saved.

Once a tab is saved, it will be saved on the user account (currently this is not fully implemented as tabs are saved in the browser’s local storage instead). The tab will always appear to the user.

tab save

Permanent tabs can be modified, for example renamed. This will make them appear unsaved: they will have the “*” prefix and the “save” button will be enabled. Navigating away will restore the previous version, saving will make the changes to that tab permanent.

Restoring old nav tabs

It is likely that experienced users will have differing opinions regarding what tabs is useful to have on the home page. This is fine, and we do not want to force them to re-create them manually. To explain this change and to allow the users to restore tabs easily we introduced the “Where are my tabs?” link. Clicking it shows a configuration pop up that allows users to restore the tabs they want to keep or remove the ones they do not like.

Where are my tabs?

This pop up will also be permanently dismissible. The “Show me how it works” link will send the users to a help center page with an explanation similar to this document. For the moment, it will point here.

Adding tabs, Renaming, Deleting or Duplicating Tabs

A new tab is added by clicking on the "+ new tab" button. This creates a new tab with all the questions sorted by creation date. There is a drop down menu next to each tab, excluding home, that allows the user to rename, duplicate or delete a tab.

Tab editing

Clicking on rename, or double clicking a tab, will show the rename interface. The user can rename the tab by typing directly in-line.

Power User Navigation

If simple navigation is our “GUI”, power user navigation is our CLI. This includes the features that we are introducing for users that like extreme customization. It consist of features that either support old nav behaviors we are maintaining for backwards compatibility or features which are non-essential but likely to appeal to our hardcore user base: advanced filters, sorts, tab reordering and relatively complex boolean searches.

Advanced filters and sorts

When in a tab different from the “home” tab, users will be able to filter questions based on state (need answer, no answer, has bounty) or time (today, last week, last month). This is done through a drop down conventionally positioned on the left. Furthermore they will be able to change how the questions are sorted via a drop down conventionally positioned on the right.

Sorts and Filters

These drop downs allow users to reach lists that are currently seldom used.

Tab reordering and limiting

A user can move the tabs around by using the drop down and choosing “move left” or “move right” as appropriate. This is valuable if users have many tabs, because we will limit the number of visible tabs to one line. Once that limit is reached the size of the tabs will shrink. This is a bit awkward on purpose: we’re assuming most people won’t need excessive numbers of tabs.

Tab reordering

Boolean searches

Many power users like to use complex searches. As long as they do not use sub expressions (i.e. brackets), we allow them and they are going to be supported in the tag filter.

Boolean searches

Known Issues

We have chosen to get your feedback as early as possible. Because of this we are shipping with a few known issues:

  • Tabs are saved in the browser, not in the user account
  • Tabs flicker on first load
  • Deep linking to tabs is currently handled client-side
  • Question counts need to display the current tag if one is selected
  • Realtime notifications may not work with complex tag queries

Feedback

We welcome general feedback here, such as feature requests or general impressions, but please use separate questions for bug reports so we can track them in our internal bug tool. Please use the tag for bug reports, one bug per question.

Next steps

We are going to deliver bug fixes and close the known issues above without further announcements. After that, we are going to A/B test this navigation for a subset of victims users and take it from there.

Once again: if you’re not currently in the alpha channel you can join by checking the box under New Navigation in your profile settings.

Sklivvz
  • 31.1k
  • 3
  • 37
  • 44