Feedback request: New top bar and MultiCollider redesign

Question

UPDATE 3

This is out on meta! New feedback post is here.

UPDATE 2

We're going to try putting the hot network questions on the homepage - replacing recent tags and recent badges.

Something like this (actual heading still under discussion):

UPDATE

We have made some visual adjustments based on the feedback below.

• Fixed anti-aliasing on the SE bubble, made the "Exchange" a lighter shade of blue so it's easier to read.
• Top bar links are now white instead of blue for easier readability
• Increased red unread count font size.
• Popups: increased width, also made font size bigger.

We are planning on making your site list order a user setting, but this won't make it into the initial version.

Stay tuned later today or tomorrow for our plan for hot network questions.

TL;DR:

We’ve incorporated a ton of your requests for the top bar into a new version, and we’re going to ask you to test it here on Meta sometime in the next 2-3 weeks (double-time!).

First, we wanted to share the current work in progress and get your input on anything glaring you think we should know even before we test it.

Insanely short history:

The top bar, and the Multicollider SuperDropdown did exactly what they were supposed to: they integrated your network info in one place on every site, and gave you quick access to a ton of the things that you needed to get to on a regular basis. It was a step in the right direction.

You’ve told us that it’s not quite there yet. And we agree that there’s room for improvement.

Some big-picture goals:

• Retain easy access to the features and navigation that our top users need
• Cram fewer things together / group things together more logically. Today, the multicollider contains:
  • Your inbox
  • Another queue for notifications, without clearly indicating how it differs from the inbox
  • Hot questions from other sites (not very related to the first two things)
  • A list of all other sites (static nav, unlike every other item)
• Make behavior more consistent.
  • Some top bar items are hovers, some are clicks
  • The hovers let you click too, but that does something different
  • Clicking the MultiCollider after you’ve checked notifications shows you a totally different thing (hot questions) in an unexpected way.
• Make network-wide rep changes more accessible
• Move toward a more globally consistent top bar across the network
  • The current top bar is small, low contrast, and different on every site
  • This creates a little friction for current users, but seriously undermines users’ ability to recognize they’re on another one of those sites with the good answers.

Here’s the proposal (subject to further tweaks):

This is still a work in progress, and we expect that once you can touch it, you’ll find a bunch of things that need to be added/tweaked/cut-to-pieces-and-have-the-pieces-thrown-in-a-fire, but we wanted to share these mockups in case you spot anything major that’s missing now.

MultiCollider

The multicollider now becomes a site switcher. Slightly larger, and in color, it anchors every page on every site and makes it more clear that you are just on one of many Stack Exchange pages.

Your current site appears at the top, along with any relevant meta, chat, and blog links. Stack Overflow gets a careers 2.0 link. Immediately below, in a new condensed format (you certainly don’t need descriptions if you’re participating in a site already), you’ll get a list of all the sites that you have logged into, in order of reputation. Finally, you’ll find the full alphabetical site list with descriptions, searchable by title, URL, and description.

We’ve made larger clickable areas for all of these elements so you don’t have to aim as much.

Inbox

The inbox tab disappears from the MultiCollider. It’s now one click away instead of two, and it behaves just as you would expect: inactive when there are no new inbox items and active with a red number when you have new inbox items.

Things that will now be inbox items that were not before: bounty notices, post migration notices, moderator messages to users, and edits (suggested and regular).

Reputation, Privileges, and Badges (Achievements)

While researching the user profile page, we discovered that one of the top use cases was checking on recent reputation changes. We would like to make this easier from the top bar than it is now.

All reputation, privileges, and badge updates now appear under a new achievements drop-down, located next to the inbox. (Privileges and badge notifications were 85% of the notification volume). This drop-down will also incorporate reputation updates that are more detailed than we currently display, rolled up by day and post.

The icon will appear deactivated if there are no badge, privilege, or reputation updates since you last checked; activated (green) if there are, with a green number representing your rep since the last visit.

Additionally, this entire drop-down will now be global, with cumulative rep for today broken down by site for those who have accounts on more than one site.

Profile image and clickthrough

The existing “on hover” menu disappears. It didn’t make any sense to have one click menu and one hover menu. Your username is replaced by your avatar, which is clickable (no more weird spacing issues with long names), along with the entire user card through to the profile page - as it was previously.

Help

The help link will now be a drop-down, grouping together the tour, meta, and the help center with descriptions to help people get to the right place.

There are two things that we haven’t addressed here that we are still working on: mod messages and hot network questions. We will figure those out over the next few days.

But before it rolls out, or even goes to development, we want your feedback. We’ve tried very hard to address the needs of new users, experienced users, and power users, but it’s always possible that we’ve missed things. Post your concerns below, and we’ll do our best to make sure we get the most out of the new design.

Answer 1

Please leave at least the meta/main link on the bar. I'm always using the meta/main link to go back and forth between the sites, and now I'd have to click twice every time I would want to do that..

Answer 2

Suggestion : Make the list of sites that appear in the MultiCollider editable by users

This is partially inspired by my experience of using the Android app for a few weeks now. The suggested MultiCollider and achievements seem to be similar to the implementation in the app.

While using the app, the main way to navigate through multiple sites is by opening the site drawer and then clicking either the site or going to all sites and then searching. The biggest problem that others and I have with this is that reputation is not necessarily a measure of interest in various sites. I may have found a new site SE which I like to browse but not necessarily participate, however it is impossible to go to it directly from the drawer. Sometimes, single questions end up generating a lot of rep thereby pushing up that account on the list. This also does not mean I would necessarily participate on that site more.

Since the design of the MultiCollider seems to be on similar lines, I feel that the site list should be edit-able (for the same reasons).

These are some ways that the sites could be ordered:

• Let users set the list as they see fit.
• Set it based on volume of activity over a certain period (taking into account a minimum of 1 week of user participation). This could be done by a doing a simple count of user actions per site similar to how its done on meta sites on the /users?tab=participation tab. (This wont be user editable, but its still better than rep-ordering)

---

Activity-Based Ordering

Here is another way to go about it. This is an extension of the activity count as mentioned above. While this will have more overhead involved, I think this will be better than either user set, or the simple meta count. Pseudo code:

    CalculateSiteRank ( UserId, AccountList) :

          for Account in AccountList 
          do
            PrevScore = Account.CurrScore
            Account.CurrScore = Account.Votes + Account.Posts + Account.Comments + Accounts.Reviews
            
            Account.Rank = r * [Account.CurrScore + c * (Account.CurrScore - PrevScore)]

            Sort (AccountList, Account.Rank)
          done
          

Here, Account.Rank will decide the site ordering in the multicollider.

Formula

Now, lets look into the main part, which is r * [Account.CurrScore + c * (Account.CurrScore - PrevScore)]

r

In this, r can be a constant that is used to scale the representation of a site in the list based on factors like user reputation, overall site volume, and beta/launched status. This can be used by SE to control some generic properties of the ordering such as by site size.

Derivative

c * (Account.CurrScore - PrevScore) is basically the derivative of activity with time.

• If the user's activity decreases over time, then this derivative will be negative, thereby decreasing the site rank.
• If the user's activity increases over time, then this derivative will be positive, pushing up the site rank. So, if you participated by performing 5 actions one week, and 8 actions the next, then the corresponding site will get a positive bump in its rank, reflecting the increased participation.

Thus, the derivative will try to minimize too much of moving around of a site within the list as well as try to order by the most likely active accounts.

c

c is a (positive) factor that can be used to scale the effect of the user's previous weeks' activity on the site rank. c would depend on the duration for which activity is considered and how much is previous activity an indicator of future activity (needs some analysis).

Frequency

This script should ideally be run once a week per user. It should be triggered per user whenever (s)he first logs on to a site, in the beginning of a UTC week.

This will have many benefits:

• Will make the list static for at least a period of one week.
• Less and distributed load of running the script compared to more frequent runs. As users may log on for the first time in a week on Sunday, Monday or later, the load will get distributed.
• By triggering on log on, extra work can be avoided on the part of drive-by users who are less likely to come back every week.
• Also, when users' take breaks exceeding 1-2 weeks, the MultiCollider ordering will still pick up from where they left off. (which will be beneficial if it becomes indispensable in cross-site navigation.)

Problems:

• If the SEDE schema is similar to the internal database, then this query will likely generate significant load.
• List will still be dynamic. Activity volume will likely be proportional to site status, so graduated sites may be consistently higher ranked than beta sites since graduated sites will have more scope of activity than beta sites.

Predictive MultiCollider

If a predictive element is also added (into this formula or otherwise) then the MultiCollider could become a surprisingly useful way to move around, and/or even predict the future of a site's short-term growth (number of users * average_siterank for example could predict how much activity is expected on a site in the next week). I am not sure of what are the full-scale metrics the SE team already uses, but from an outside perspective, this seems like an interesting addition, or at least experiment.

_{Also, SEDE graphs would make this answer much more interesting, if you get my drift ;-)}

Answer 3

Maybe its just my eyes, but I can't really read anything that is blue on that black background.

Also, straight black seems out of place at the top. It makes me think you are doing a memorial type thing.

Answer 4

Looking great and think it's really about time for a major design change like this. Kudos!

That said, in my opinion flags are currently not getting the attention they deserve. Users are flagging posts and I strongly suspect that many of those users have no idea how to check on their flags progress, if they were accepted or not etc, which can cause problems like double flagging or continued behavior of bad flagging as they simply don't know their flags are being declined.

Why? Because the only link to the flag history is hidden as a mysterious "helpful flags" in the profile page. Personally I spotted it easily but it's far from being trivial or easy to find. Many users just miss this.

So now with the new design, why not give the flags some love?

Whenever a flag is handled (either accepted or rejected) the number will rise and it can just be a link to the existing flag history page if designing "mini view" would be too much trouble.

I truly believe this will improve the overall flagging quality and reduce "double flagging".

Answer 5

Sounds fantastic!

I'm a stickler for real estate though; so I'd like to request that there be a way for those of us who have only ever visited the careers site by mistake to opt out of seeing the Careers 2.0 link? I don't see a situation in the near future where I'm ever going to click on that on purpose, and I only see it as a way to make the location of links to other sites inconsistent depending on whether I'm on SO or not.

Answer 6

Suggestion: Site icons on a new achievements drop-down should be linked to our relevant profile -> reputation tab.

What I mean is described by the following image:

By this we can quickly redirect to our relevant site's reputation tab.

Answer 7

Please leave the Chat and Meta links in the top bar.

This gives us quick access, and advertises the fact that these things exist to new users. These are important features of any site, and I'm concerned the visibility of their existence will be lowered too much this way.

Answer 8

Nice!

I noticed that the badge notifications in the mock-up are more terse than what we currently get: the super-collider tells me what question a per-question (or per-answer) badge was for. I find that handy and it doesn't look like it would cost too much space (you're already doing it, after all). Could we have that info too?

Answer 9

I'm concerned about the size of the red bubble and its text on the inbox: I can only just barely read the number on my full-size monitor, which means it'll devolve to a binary indicator (red dot or no) on my tablet. (And if it gets to a two-digit number it'll be even worse.) Sometimes I deliberately leave inbox notifications unprocessed and save them for later, but I'd still like to know if I'm getting new ones. But if I click it clears them all, so I don't want to click -- I rely on the number in the red bubble.

If you don't want to change the visual design, this problem could be mitigated by an informative tool tip (e.g. "3 notifications" or "3 items in inbox").

Answer 10

That rep tab is amazing, but I have one request: please make unread rep events highlighted. My most common use of my profile page by far is to check where that 10 rep came from, and it would be great to have that information a single click away.

Answer 11

I use a couple of things in the popup that appears when I hover over my username. Having my user card instead would be totally useless — I know who I am, thank you very much.

Most importantly, I keep track of how many times I've voted today. This is very important for me on Unix.SE, where I have to ration down my votes to keep under the 40/day limit. I can't find this information in the new design. The number of close votes would be a nice addition to that (though it's not a big issue for me personally).

I occasionally look at what posts of mine have been voted on recently. Depending on the site, I'm interested in different information:

• On subjects where I'm not very comfortable (so sites where I post rarely), I like to see if my recent posts have gotten positive or negative feedback: did I get it right? The existing interface is good for that. The new interface would have these drowned out by my most active sites.
• On subjects where I'm most comfortable (so sites where I post often), I like to see whch of my old posts are regularly getting upvotes: these are reference posts that I should perhaps polish. The existing interface is bad for that because it's buried in the feedback about recent fire-and-forget stuff that I couldn't care less about; the new interface would be no better.

Answer 12

Currently the dropdown box is cached once it is loaded. So if I want to see the current view I have to refresh the page and then hover over my name on the top.

Can the future dropdown menus be always filled with current data without refreshing the page?

Answer 13

Would it be possible to add some notification when there's something to review? Currently reviewing requires a lot of refreshes of the review page...

Answer 14

Making this functionality accessible from the keyboard (say, hotkeys on the webpage) would make the site more 508 accessible, and help out regular users to boot.

Answer 15

As requested by Shog9...

The collider and profile tabs are unlinked. Visiting your inbox doesn't reset the tabs or vice versa. Visiting what caused the notification (like a comment) doesn't reset either of them. You must visit both the inbox and the tabs to "reset" to the default state.

Answer 16

Can we revisit this question?

Items that are viewed (regardless of viewing them through the inbox), should be marked as read.

It's been a while since it was asked, and I think since the SuperDropdown is getting an upgrade soon, it should be incorporated.

Answer 17

Overall, I like it. Well done!

Suggestions (sorry, no hand drawn circles)

1. Support the vision impaired (all of us one day) by user selection of either preset color profiles (easier) or individual color selections (yuck), and a user selectable expanded bar (say, double the height).

2. Every second user has their favorite feature. Support them by allowing them to drop a button (or similar) for their fav feature onto the bar.

Good work folks.

Answer 18

I think the big black bar looks less... err... bold, when it does not extend into the margins.

click image to enlarge

I added rounded corners too, so it looks a bit more smooth.

Answer 19

When looking at the screenshots, the 'achievements'/'reputation' tab menu feels too small to me. I think it should be a little bit wider horizontally so the content doesn't feel so cramped, and I think it should be expanded vertically so that no scrollbar is needed. When I view the achievement menu, there is nothing on the background I really need (or want) to see (ala it doesn't matter more of the background is blocked by a bigger menu), and I think it is really helpful to be able to see all information in that menu without needing to scroll.

Answer 20

Allow exchanges to dictate the nav bar background color

Cool! The new multi collider looks like a step forward.

Except...

Black is being forced as the header color? I am going to have to disagree with the color choice. All of the examples shown in this question seem to indicate that testing was done on stackoverflow. Yet the header color was chosen "for all of stackexchange".

How can this work? Right now almost every exchange site (this is from looking at the top 7 sites on the all sites list) use different html markup to design their headers. It seems that the html is custom and changes from site to site. I don't see a good reason to change the flair that each exchange is using to accommodate the new nav bar. For example, changing the nav bar to use black as a background the English Exchange will cause a rather jarring rendering.

Perhaps the entire structure of html will be different there? I could see it working if the new nav bar was somehow sitting on top of the current structure. I wonder if that will be different for each site in which case does that mean that custom headers will need to be redesigned by each site to somehow incorporate this new nav bar?

Answer 21

^{Submitted here in order to ensure that involved feature requests (listed below) are included in the list of feedback items.}

Hot questions stay at the top of the supercollider for too long

Above wording is as has been recommended by David Fullerton♦ here.

---

Involved feature requests (listed in order from earlier to later):

Don't let questions stick to the top of the hot questions list forever (submitted Jul 20 '11)

Sometimes those are interesting questions, but often they are popular mostly because they appear in the hot questions list gaining views and are about a topic where everyone has an opinion (and a vote) to give. I'm fine with promoting the questions via the MultiCollider, but I don't think those highly-voted questions are that good, they don't need to be in the hot questions list for several days.

I think those questions should be thrown out earlier and should not stay in the hot questions list for several days. It makes the hot questions list less useful as you very often encounter the same questions again, even if you check back a day later. I thought the idea was to show a broad mixture of possibly interesting questions from all around the SE network, not to semi-permanently highlight questions that are already popular...

Trial run of modified “hotness formula” for Programmers questions (submitted Jan 25 '13)

Given that current formula appears to give an unjustified value to crappy answers in highly upvoted questions (Qscore/5, no matter how much is answer downvoted), I would like to perform test run to find out if suggested change would make an impact to issues outlined in Programmers meta posts:

• What can we do to help users understand our site better?

• Answers quality in hot questions

In “network hot” questions formula, discard answers when voting evidence indicates that these are not good data points (submitted Aug 6 '13)

contribution of under-scored posts into "question hotness" (which in turn blocks intended time decay) forces questions with multiple low quality answers stick for a long time at the top of the collider, making wrong impression on what kind posts are welcome at Stack Exchange.

This makes it look like good questions are those having many meh answers, the effect that is amplified by these questions being highly visible to collider audience - hundreds and thousands of SE users. Misguided users spread acquired attitude further into other questions and answers, posting stuff that follows what they saw at the "cool" ("hot") questions.

As far as I can tell, this jeopardizes the very idea ^* of making an Internet a better place.

Please stop counting proven low score answers in hotness formula. Please roll the dice fairly, let user voting and time decay contribute to hotness score as intended. Please promote to collider audience less brain-damaging content to learn from.

Answer 22

Can we have something per-user that causes the bar to be sticky to the top of the page? Per-browser is also FINE by me, I'll check it off on like 15 computers, I don't mind.

It's garnered enough interest to have a few userscripts generated for it, so this could be highly useful.

Answer 23

I miss the mouseover from the portrait that shows recent reputation activity. I know there is a dropdown that shows all of the reputation activity for the whole exchange, but it is too busy.

Please bring back the mouseover popup that showed recent reputation when I hover over my portrait.

If at all possible, it would also be nice to see my user name again. I feel a little too anonymous.

Answer 24

Is it possible to include, on inbox or somewhere else in the bar, notifications for new questions on favorite tags? I now keep extra windows to catch new questions in some 2/3 tags I like to monitor, and would be nice to have that on the inbox instead.