User Experience -- rethink profile, dashboard, and account

[kytrinyx]

Right now the profile, account, and dashboard pages are a bit of a jumble. We have a bunch of "stuff", and I'm not sure what stuff is useful and what is not.

Account page:

• Link to the API key page where you can reset it.
• Private URL stuff, to make your profile visible to people even if they're not logged in, and to let them see the solutions to your exercises from the profile (usually you'll only get access to exercises that you yourself have solved)
• Avatar - instructions to update it on GitHub, if you like
• list of teams (member of or invited to). For each team
  • link to the team activity stream (if you're a member)
  • invitations, with button to accept or decline
  • button to leave a team that you're a member of
• team invitations with buttons to accept or decline
• button to leave the team
• button to create a new team
• track mentor stuff: if you're a track mentor on any tracks
  • list the tracks
  • provide a form to let you invite other track mentors to tracks you're a mentor on

Profile page:

The profile is a problem, because some stuff is visible just to the person whose profile it is, other stuff is visible to everyone. We should really have pages that are just one or the other, because it's super hard to maintain (and hard to implement new features without getting it wrong, and hard to review pull requests, because there's so much complexity).

• username
• avatar
• link to GitHub profile
• teams that the user is on (only links to it if the person viewing the profile is a member of the team)
• progress bars for the profile. Lots of problems with this, UX-wise, especially for people with lots and lots of exercises in lots and lots of languages. I don't know that we need progress bars, maybe it's the wrong way to think about it. I have expressed opinions in various issues, but I think I'm not seeing this clearly at all. See
  • Feature Request - label which exercises are complete exercism#2780
  • User page: sort languages by progress percentage exercism#2758
  • Don't include "HelloWorld" in progress or statistics in general exercism#2736
  • Profile Page: completed exercises chart exercism#2816
  • Progressbars on accountpage, differ between archived and not archived exercises exercism#2734
  • Profile Activity Stream exercism#2059
• List of exercises that the user has solved, by language, in a table, sortable
• List of archived exercises the user has solved
• List of tracks that the user has completed, with a suggestion that they help contribute to the track.
• Explanation for lock icon (you don't get to see exercises you've not completed yourself... unless you're looking at a "private share" URL).

Dashboard

The dashboard doesn't seem to be useful at all. I think we need to rethink it from scratch per all three use cases (newbie, polyglot, artisan), as well as what it looks like if you haven't started any exercises yet.

It contains:

• exercises that are in progress
• teams
• links to recently viewed exercises
• links to notifications about reactions to your own solutions (likes, comments)
• link to the help page
• link to the contribution guidelines

[kytrinyx]

Ref: #34

[kytrinyx]

Having sorted through a bunch of tickets today, I think that the first answer is to replace the profile page with a profile activity stream for that user. See exercism/exercism#2059 for details.

As a first pass, in order to fix the profile, I think we could simply move all the other stuff in the profile to the account page.

[kytrinyx]

If only we had user surveys of Exercism users or something like that.

• @petertseng in discussion: Haskell exercises as complete projects haskell#182

I think it would be incredibly helpful to be able to have something like this on the dashboard. At the very least we should be able to target everyone vs all submitters to a track, and we might also consider everyone in a track who has submitted exercise X.

[troubalex]

I think to solve this we need to do two things.

1. Take a step back, and think about what purpose the three pages really serve.
2. Map out the different elements currently on the pages to find out if they really are on the right one, and if there is maybe a fourth one lacking.

My opinion on point 1:

• The account page holds everything that feels like settings or preferences.
• The profile page holds the public information about a specific user, a bit like a shopping window or a CV.
• The dashboard holds all handy shortcuts for logged in users, in addition to any kind of notifications. Elements here should be actionable.

The one that I see as the muddiest here clearly is the profile page. How much detailed information on completed and archived exercises is really necessary? Is the purpose to show skill or progress? Or is it meant to put a face/context to someone submitting or commenting on solutions?

It might be that it is necessary to split up the profile in public and member versions. But that is really only a hunch I have at this point.

As soon as we have some clarity on point 1 we can get to point 2 to refine point 1.

[troubalex]

Initially, I meant to add this comment directly to exercism/exercism.io#2816 but I think it fits better here. It's a more fundamental change, and dependent on what the outcome from this discussion is. So here we go.

Profile Page: completed exercises chart

The trick might be to award badges as the user goes along, or to split up the tracks into "chapters" that could be used to display progress rather than absolute percentages. Both could play to our human tendency to collect stuff, and our need to complete sets.

Inspiration can be found at Codeschool. The paths still look kind of depressing if you, like me, never finish anything. But they're not quite as insulting as a bunch of progress bars stuck at a value way below 30%, especially when combined with the badges for finished courses further down on the page.

Or take a look at Stackoverflow, the mother of all reputation sites.

[kytrinyx]

I think to solve this we need to do two things.

I think you're right.

The account page holds everything that feels like settings or preferences.

Agreed.

The profile page holds the public information about a specific user, a bit like a shopping window or a CV.

Right—it's not quite public unless you explicitly create a "private share link". This page would be where you go to look at what code a person has written / in what languages.

I don't think that the archiving/deletion stuff belongs there at all. This seems like it should be a section in the account.

completed exercises chart

I'm not really sure what to do with that. I think that if you've completed a full track, we should just have the track logo with some sort of indication that you've completed it. But if you've not, maybe just a 9/34 or something showing how many you've done. Logos would take up much less space (especially for people who do all the tracks. It's really unweildy).

I'm trying to avoid badges/reputation stuff, anything that smells of gamification.

[Insti]

[I]t's not quite public unless you explicitly create a "private share link". This page would be where you go to look at what code a person has written / in what languages.

I can view anyone’s profile if I'm logged in and know their username.
Is this a bug, or a differing definition of 'public'?

Edit: I find being able to view peoples profile and other solutions helpful when writing reviews.

[kytrinyx]

Is this a bug, or a differing definition of 'public'?

Differing definition of public.

If you're not logged in, you can't see the profile page.

If you are logged in, you only get access to exercises that you have are authorized to see (have completed, or are mentor on the track).

People can create a "private share" link which will let people see everything they've done. That link is configurable in the settings page (which was a bad choice on my part. It should be on the profile page. But whatevs. Everything about the profile is a bit of a mess).

[troubalex]

I'm trying to avoid badges/reputation stuff, anything that smells of gamification.

May I ask why?

[kytrinyx]

Yeah, there's a bunch of research about how these sorts of systems (gamable) reduce (or destroy, depending on context) the internal motivation that people have for the activity itself. My favorite resource about it is a book called "punished by rewards".

[ghost]

Not sure if this is the right thread for this. I'm finding it quite tedious to "See other implementations of ..."

My suggestion is to have a "Previous implementation" : "List of implementations" : "Next implementation" toolbar somewhere on the screen to easily switch from one to another without having to go back. The "List of implementations" could be just a series of user avatars.

[kytrinyx]

"previous" and "next" are somewhat nebulous concepts. I guess we could

• only show it if you have access to the exercise in the language, and
• use the same criteria as we do in the activity stream

That, however, is an incredibly expensive query.

We could simply have a link to "prev" and "next" which wouldn't compute the actual exercise until you actually tried going there, but then we would end up linking to "prev" when there are no previous exercises and "next" when there are no next ones.

The "List of implementations" could be just a series of user avatars.

Would you elaborate, please? Would that be a random sampling of the users who have solved that problem?

[ghost]

Hi Katrina

I don't mean navigation between exercises, just in implementations of the current exercise. The query could be the same as on http://exercism.io/tracks/python/exercises/hamming for example

The page could look something like this (High quality MS Paint artwork to follow)

[ghost]

Or, another suggestion:

[kytrinyx]

Thanks for the screenshots, that's helpful.

The thing that is bugging you is the link below the "manage" menu, right?

[ghost]

Not so much that link, but the workflow that follows it, so:

• Click on See other implementations of Hamming in Python
• Click on an avatar
• Click back
• Click on avatar
• Click back

It would flow much easier if I could move from one implementation to the next without having to go back to the page that has the list of implementations on it.

[kytrinyx]

Thanks for elaborating, it makes a lot more sense now.

There's another problem with "next" that I forgot about in my previous comment. If you've commented on this one, now it's first, and "next" is the second-most-recent one. So what we really mean is "next... before I did anything on this one".

[ghost]

I think that would be an effective way of doing it. It would be really confusing if the list reordered itself while I'm going through it.

[kytrinyx]

Note to self: when we rethink the dashboard, consider this idea about suggesting that people revisit an old solution from time to time. exercism/exercism#2262

[sguermond]

@richieacc I don't know if your suggestion for scrolling between implementations of an exercise already includes this, but I would be interested in seeing a side-by-side comparison of your solution vs. the implementation you're looking at (kind of like Github diffs, but less fancy - just the code). I see this being useful for both users trying to improve their solution and newbie reviewers trying to give feedback to someone else based on their own solution.

[ghost]

@sguermond I like that idea. What do you think @kytrinyx ?

[kytrinyx]

@sguermond @richieacc we used to have diffs, but it made the already cluttered code page even more cluttered. It didn't feel like it was adding enough value. I wouldn't be against having the feature if we could make it not feel like yet another kind-of random thing tacked onto the site.

[binoymichael]

It would be great if we could view all the comments/nitpicks given by a particular user.

Some users give really insightful comments. So whenever I submit an exercise, I try to hunt for their comments on other solutions of the same exercise and learn from their comments.

Implementation could be a div on the user's profile page, with a paginated list of comments and options for filtering the comments based on language, exercise.

Thoughts?

[kytrinyx]

@binoymichael Yes, absolutely!

I'd like to have it as part of the profile activity stream, open issue here: exercism/exercism#2059

[kytrinyx]

This is being done as part of the redesign described in #113 and #154