Profile Page Makeover, Part 3: the Prototype returns

Question

Update

We have done a bunch of work following your feedback - just look at all those status-completed tags on the different answers here!

The top suggestion was to do something about the badge visualization - we have listened and completely redesigned that piece - check out the new and improved badge visualization, on the profile page.

In the next few weeks we will preview further profile changes here on MSE - mostly to the activity page and following feedback and rework on those, the new profile page will go live to the rest of the network (6-8 weeks, give or take).

---

You may recall this thing - our profile page makeover prototype, the reloaded user page. We posted a prototype 6 months ago and got a lot of feedback. Since then, generations of dinosaurs were born, fell in love, had families and were eventually killed by a comet. Or climate change, or maybe texting and driving or some nonsense like that.

We picked up work again after a couple months of avoiding it (one or two of you noticed...) and started cleaning up some of the rough edges. We are looking to get this right and the change isn't urgent, so we are taking our time on it. We want to have something that is clearly better than the current page.

What is all this about again?

The user profile page was trying to address two fairly different use cases:

• What is most valuable and useful when you want to see what someone else is all about.
• What you should see when looking at your own profile.

Because it was trying to solve both problems in one place, it was decent at both, but not great at either, and it probably was overall more optimized for the "looking at my own profile" use case.

So, here's what's happening

If you go to your profile on MSE right now, you'll see it now has two tabs in the top left:

The "Profile" page is your new public profile. It's what everyone will see by default when they click your picture at the bottom of a post or find you in the users list. It should communicate what you know and what you've done.

The "Activity" page is intended to be your own personal dashboard, stuff that isn't necessarily of interest to others but that you want to see when visiting your own profile. Right now it's just the old profile page, but we'll be tackling that next and asking for feedback here on how to make it more useful.

See for example the Activity and Profile pages of BalusC - the former shows you his overall activity on the site, the latter showcases him.

Some of the things we changed based on your feedback:

User info section:

We also added a new "people helped" counter based on the views your questions and answers have gotten. This is essentially a sum of views of your questions, and answers that fall within the following criteria: accepted, have a score of 5 or more, have more than 20% of total score of all answers on a question or are within the top 3 answers by score. No deleted posts are counted.

Tags:

And some other tweaks and visual updates we can't quite remember - you can see the old version here.

Unfortunately the very popular request to make the badges interactive didn't quite make it in -- but we may still come back to this later.

Feedback

We are looking for your feedback before this goes out to the rest of the network - what's broken? What's missing from the new page? What needs a bit of polish?

Answer 1

The whole piece was redesigned, so making status-completed. Let me know if you feel that's off-base.

(expanding on animuson's comment)

The rows of dots illustrating badges is silly. It doesn't convey any useful information. It doesn't even visually convey the number of badges, since the size of the dots is adjusted depending on the number of badges. This picture (with both screenshots scaled at 80% to fit on the same line on the desktop site) suggests that I (left) have more silver and bronze badges than Jeff (right), if I go by badge-covered area!

Drop that and use the space for something useful, such as having a column for recent badges and one for the most notable badges (suggestion by Monica Cellio). Or one for the counts and one for the notable badges. Or drop the column formatting altogether.

Answer 2

1. FOR SVG (or just divs with enough border-radius, as it is done with badges on the left - they are not SVGs, but SVG is just a short word to use on the pic :); but on other sites where the shape of badges is more complex, I think that SVGs would be used rather than CSSing divs)! And no excess borders please.

In a sense, this is status-completed, since the whole thing changed and is all lovely and zoomable.

2. Wow, great number! What does it mean?

   Already mentioned in other answers here and already has a dedicated meta thread.

   

3. Someone is trying to eat the right part of badges... (this is fixed)

   

4. (using the profile of Jeff Atwood)

   • The biggest place is not for the tag with highest score
   • Only the tag in the biggest slot has a badge displayed, even if the user earned badges for other tags
   • There is status-declined in the last slot, however more scoring tags are omitted (stackoverflow or reputation or tags - their score is 1k)

   All these points have now been addressed (next build).

   

5. Clicking "My Logins" from "Profile" tab doesn't open login window. But it still works in "Activity" tab. (this is fixed)

   

6. If user don't have top network posts, the section tells us that he doesn't have... hot network posts? (updated to top)

   

7. Uset info fields (website, location, age) are good margined only in the profile of currently logged user:

   

   For all other users, the margins are bad:

   

   Given the low impact and that we are working on a redesign for the activity page, this will not be fixed. status-declined

Answer 3

The top network posts should show whether they're questions or answers. Like this:

Just because I think it would be nice to know at a glance.

Answer 4

Make these thingies links to their respective pages, please:

---

These UI elements have a specific job, adding links would detract from that.

Hrm? That really doesn't make much sense. Adding links does not necessarily require a change in appearance, correct? (Aside from underlining on hover, or something along those lines.) So if the only effect is purely functional and not visual, how would that "detract from their job?"

In any case, I expect them to be clickable, and you don't gain anything by keeping them unclickable (other than making it that much harder to find what you're looking for).

Answer 5

status-declined - after discussing internally, we decided to decline this request. We understand that for some avatars the display is not optimal, but that will be true for just about any design with some avatars.

The grey background that spans the top half of the avatar box is somewhat distracting. It’s barely visible but sufficiently visible to catch someone’s eye.

It looks particularly irritating for avatars with a white background, which does not only include some selected custom avatars such as mine but also many Identicon avatars:

Answer 6

I don't like having the top network posts directly on the site profile. Voting varies a lot between sites, so this is likely to highlight questions in a different subject matter. I post on a variety of sites, and I know everything is public, but if (hypothetical example) I show my Theoretical Computer Science profile to someone, I don't want them to think too much about my Gaming questions from when I spent 48 hours walled in after the latest blockbuster release.

Answer 7

This issue has its own thread now:

We're working on a new stat to help convey the reach of your posts here

---

"people helped" is a rather misleading term. It helps to boost the ego, but it's really a lie.

Most of the question views will not count as somebody you actually helped. For one, your answer may be number 3 in the list with a score of -3 and really not helping anybody.

It's a nice statistic, but call it "total views of posts" or "post views" for brevity. And add a mouse-over with explanation or a link to a site with details. Because, right now, I am merely speculating as to what it means.

Answer 8

I want to be allowed to decide which of my badges are notable. You might think that Explainer is cool, but perhaps I want to showcase one of my silver badges in the top spot instead.

So, feature request: Allow us to choose which badges are notable.

Answer 9

The score for the Top network posts doesn't really stand out. For a few seconds I was wondering why the titles of posts were things like "18 Shortest unmatchable regular expression" and "16 How many Stack Exchange logins should I have?"

In my opinion, it may look better with a slight background, maybe like this:

---

Also, I have a score of -8 in feature-request. Why is it in my top tags?

---

Braiam just pointed out that there is a discrepancy between my feature-request score on https://meta.stackexchange.com/users/238586/the-guy-with-the-hat?tt=profile

and the score on https://meta.stackexchange.com/users/238586/the-guy-with-the-hat?tab=tags&tt=activity

That's been fixed now.

Answer 10

This issue has its own thread now:

We're working on a new stat to help convey the reach of your posts here

---

Please call People Helped something else or drop it: that name is disingenuous.

You've explained the way this is calculated, and I've read it:

We also added a new "people helped" counter based on the views your questions and answers have gotten. This is essentially a sum of views of your questions, and answers that fall within the following criteria: accepted, have a score of 5 or more, have more than 20% of total score of all answers on a question or are within the top 3 answers by score. No deleted posts are counted.

The problem is, we all know full well that view counts are not remotely correlated to people helped. It pretends all of the following scenarios, which would increase the view count, also signify a new person helped, even though that isn't the case (this list is not exhaustive):

• Someone who happened across the question, determined it wasn't what they were looking for, and left.
• People who were visiting to read, already knew everything written in an answer, agreed with it and considered it helpful, and upvoted that answer.
• Repeat visitors, who aren't looking for an answer to help them. (In 2010, people investigating the views count mechanism found that the same visitor could increase the view count multiple times, if they simply spaced out their visits. If this is still current, I could count for 5 "people helped" myself on a question just revisiting my own answers to edit them further.)
• People visiting to perform moderation, or check that things are okay. (This accounts for most times I've added to a view count)

The people who visited and were helped by an answer is only a portion of views. It's also an indeterminable portion of the views. (That means we can't emulate such a number accurately either.)

My answer to Betrayed by my GM; how can I respond? is one of my highest-scored, most viewed answers. I'm confident I made a difference to some people, but I don't believe it's accurate to say the views (6595) capture that number. This was an extreme and toxic social situation most viewers will never have to deal with (thankfully). Fewer than that could have learned something, or maybe through a ripple effect a lot more than that number did. But I don't know how many were helped, really, and neither do any of us.

The honest thing to do would be to admit we don't know how many people we help. Views are views. That statistic is more accurately labelled "views on questions you've answered which meet certain criteria" or something else, but "people helped" is not an accurate label. I'm not sure what such a statistic would mean, exactly, but if you display it, please do not label it "people helped". Raff has suggested in comments the possibility of calling it "total readership", which is one possibility much nearer the mark.

Answer 11

This is much-improved over the previous version. However, the tags section still has too low a signal-to-real-estate ratio. Look at all that empty space within the top tag block! If you want to do some sort of size-based visualization, you could easily get twice as many tags in that same space without it being cluttered. The current ("activity") version is much more useful to me, showing me ten tags instead of six and in less space.

You've said that the order will be changed to show top tags by score (like on the current page). That's good; that's less confusing.

I don't particularly need to know if people have badges for their top six tags; I can see the scores, after all, and if I really want to know if there were enough non-CW answers to earn the badge, I can hover and find out. If the badges don't cost much space then meh, but if that's part of why you're spreading things out so much in this view, consider dropping it from here and adding it to the "all tags" page, which favors functionality over aesthetics already, instead. It'd do no harm, and it might be handy to have one place to scan for "tags this user has answered enough to earn badges". (This would also address the request elsewhere to call out tag badges in the "badges" section, which is only space well-spent for users who have several of those. Most don't.)

Answer 12

status-completed

The custom scrollbar here is fancy and all:

But it's really hard to click since it's so skinny. Could it be embiggened?

---

After taking a look at the CSS:

.bio::-webkit-scrollbar {
    width: 4px;
    background: #f4f4f4;
}

.bio::-webkit-scrollbar-thumb {
    background: #dad7d7;
}

It shows up bigger in Firefox because FF doesn't support those pseudo-elements.

Personally, I like the way it looks in Firefox better, so those lines of CSS could just be removed.

Answer 13

status-completed

The text color of the badges on the sites section upsets me:

The bronze badge text stands out way too much. Make all the badge labels the same colour.

Answer 14

Please weight "top network posts" by site.

My top network posts section currently looks like this:

You'd think, from this list, that I participate mainly on The Workplace with a smattering elsewhere on the network. But that's not really true; it's just that posts on The Workplace get a lot more votes overall than posts on the other communities where I participate. By local standards some of my Mi Yodeya posts are way more significant than the ones shown here, but we are a small community and those posts are unlikely to ever crack this list. Ditto Writers, Pets, and Moderators Community Building.

This gives a distorted view of my participation. I would like to see posts here be weighted by some measure of per-site activity that reflects voting (average score/post for the site, maybe).

I'm not suggesting that this be done in real time every time a profile is loaded; that would be way too much load on the servers. A job that runs once per day (or even once per week) that updates a table of weighting factors would be good enough. Unlike top posts on the current site (where the profile is being viewed), this needn't be completely up to date.

We have another list that has similar issues and is addressed by weighting: hot network questions. If the raw hotness formula governed what's on that list, SO would dominate and small sites would never get onto the list. SE therefore introduced a score-reduction algorithm based on how many posts a site already has on that list, which smoothed it out some. Handling of the HNQ list is what gave me the idea for how we could address a similar problem in another multi-site list. (I don't know if an algorithm designed for a 100-entry list would work well for a 7-entry list, but that might be worth investigating as a solution here.)

Finally, I understand that the current ordering has always been in place on the network profile, and is what people will see if they click through to that. I'm not asking to change that; I'm just asking that the "first view" of a user active on many sites with highly-varied voting activity be adjusted to more-accurately portray that user's activity.

(I am not asking that users be able to customize this list; I recognize the issues with that. And anyway, I'd rather have an automated list that does a better job than have to maintain a hand-picked list myself.)

Answer 15

status-deferred

I personally liked the "Apps & Projects" section from the second part, can we have that in?

Answer 16

status-completed

Minor CSS cross browser glitch:

Can you make sure the gold/silver/bronze badges align with their number in IE11 just as good as they do in Chrome?

Answer 17

I am voting against any features such as

• Allowing users to select their "top" badges/questions/answers
• Allowing users to exclude sites from their hot/top networks
• Showing projects (such as github/bitbucket repositories)

As for the first two points, StackExchange is not a social¹ networking² site. It is a questions and answers site. Customizing your profile will start to creep into the whole personalization thing, which isn't at all what SE is about.

When I go to a profile, I expect to know exactly what I'm looking at -- top/best badges, top posts/answers, etc. I have a specific set of options lined up for my own personal use when I few another user's profile. If users can customize exactly what's on their profile, then that guarantee is no longer there causing a UX impediment and possibly confusing me (as a user).

Further, if users can hide their questions/answers from the page (such as when I want to see their lowest rated questions/answers, which I do from time to time), then I am now seeing possibly skewed information (this is just an example).

---

As for the third point, you run into several issues here, some of which have already been addressed.

• What dictates which sites we can pull repositories from? Is this something the user is going to have to maintain or allow access to?
• We don't have fields for Twitter, Facebook, or XYZ personal profiles; why have projects? I don't care if a user has 15 hello-world-xyz-language repositories, and if they're someone who has an established project, they'll most likely have it linked in their about me section. It's wasted space and breaks the current theme of profile fields.
• It's still social network-ey. GitHub is probably as close to a social network as a site could be without capitalizing on being a social network. Let them manage that (nothing against them, of course) - not us.
• Since when has the About Me box ever been less than sufficient for showcasing whatever the user wants to showcase?

---

Just my $0.02.

Answer 18

status-completed

The 'top x% this time' box is too big, relative to the username.

It should be a little smaller, IMO.

Answer 19

status-declined

Please please please display at least a littlte section of reputation, something like this:

Answer 20

status-completed

There's a redundant percent sign for the tags where this is displayed:

This could be fixed by putting the percent sign in parentheses after the number of posts in that tag (in a smaller font), for instance.

Answer 21

The new profile page is somewhat overdeveloped. The use cases for a profile page are (speaking from my own experience), in no particular order:

/me looking at my own page:

• switching to another site or the network-wide profile
• checking my unmarked questions
• checking the posts I flagged - have the mods left me a custom message
• finding out why I have -10 reputation (the user has been deleted)
• looking at my suggested edits - have they been rejected or not

/me looking at others' pages:

• looking at knowledgeable posters' favorite pages to see what gold nuggets are there on a particular site
• checking a user's activity/network scores while doing reviews for spam

Does the new design help those use cases? NOPE. It detracts from the established routine, adds unnecessary clicks for common tasks, and showcases nothing in particular. Badges? Top network posts? Pleease. I can always go to a user's network-wide profile to see all that.

TL;DR : Please please please do not re-invent the profile pages.

Given the number of public beta sites that are waiting for custom themes, it is obvious that SE designers' time could be better spent on graduating sites.

Note: I do understand that adding vanity design elements (aka Facebookization of SE) may lead to users spending more time on SE. Will they spend it answering questions? Unlikely.

Answer 22

This now has a dedicated meta thread:

We're working on a new stat to help convey the reach of your posts here

---

The PH ("People helped") stat is IMHO just another ridiculous number, even more ridiculous than the rep. I do not see a reason why to introduce yet another stat like that.

It doesn't bring any new information to the system. Even if it did: Imagine that someone has rep:PH ratio 1:10 and someone has 1:2 -- what is it telling about that person? IMHO nothing at all.

Moreover, this PH stat is even more sensitive than rep to post being discussed on meta, getting tweeted or featured etc. ... we are currently facing this problem with rep and if you introduce PH, we'll soon face the problem twice as much.

(As a side note, I believe that introduction of a new stat should be discussed completely separately from design decisions on the profile page.)

PS: As Oded suggested, I created a discussion thread about this feature: What is "People helped" and why does it exist at all?

Answer 23

status-completed

This was also reported here, but i wanted to make it official:

Tag scores are now being calculated to include answers and questions, while previously it was just answers.

This is confusing.

I've used the tag score feature to see how close i am to tag badges, but now that's all messed up.

Please, either bring back the old way (just answers) or make it easy to see the breakdown (perhaps with a tooltip).

Answer 24

status-completed

It says "Moderator ♦" twice on a mod's profile - once in the top bar, where it is in the activity tab, and once by the username. The link should be by the username.

Also, up in the bar looks like it might be another tab.

(That's gotta be the worst freehand circle ever.)

Answer 25

status-completed

Please remember my choice in "Top Posts".

No matter what I choose (all,questions,answers/votes,newest), after reloading the page it resets to all/votes.

Answer 26

Many thingz in SE show exact info in popup on hover. Please for people helped too?

Answer 27

I think age also should be displayed in "Profile" tab:

Answer 28

status-completed

In my previous answer (deleted when implemented), I requested a count and score for posts in a tag, to be shown on a mouse hover.

However, I'd like to request a small fix to it: it it's not too much trouble, can those numbers be shown on a hover over the whole gray box for the tag, and not only when hovering over the numbers at the end of the box? That would make it a whole lot easier to use, and (for new users) a whole lot easier to discover it.

Answer 29

status-completed

Tag badges link to general respective section of tag badges (bronze, silver, gold), could they link to specific badges please (discussion bronze tag badge, feature-request bronze tag badge)?

Answer 30

status-declined

Observe: Fancy Hover Effect Thingy™ exists in Exhibit B. Fancy Hover Effect Thingy™ is decidedly absent in Exhibit A.

Could the fancy fadey thingy be implemented if the text overflows the area, even without hovering? That would be much better IMO than what currently exists (ellipses happen, not even at a word break!).