[feature request] flair for display on external websites

Exercism
1

Problem

I want to show off my progress on exercism.org from my github profile page. Currently, I can URL link my exercism user badges page https://exercism.org/profiles/jtmoon101/badges . But this is visually uninteresting, and requires the viewer to click the link.

Solution

Allow exercism “flair” for displaying a little graphic communicating progress at exercism.

Stackoverflow example

The stackoverflow flair is embeddable in many places, including README.md files, which become automatically rendered by github and other websites.

Stackoverflow provides a little HTML code snippet too make image embedding easy

<a href="https://stackexchange.com/users/216253/jamesthomasmoon">
<img src="https://stackexchange.com/users/flair/216253.png" 
  width="208" height="58"
  alt="profile for JamesThomasMoon on Stack Exchange, a network of free, community-driven Q&amp;A sites"
  title="profile for JamesThomasMoon on Stack Exchange, a network of free, community-driven Q&amp;A sites"
/>
</a>

Checkout my stackoverflow flair User JamesThomasMoon - Stack Exchange
SO-flair-20221020
It shows my profile pic, username, and my Stackoverflow awards in one graphic. I’ve added it to my own github personal page. https://github.com/jtmoon79/#stackexchange
I also add it to the bottom of the primary README.md for my projects, for example https://github.com/jtmoon79/super-speedy-syslog-searcher#further-reading
It’s like a little business card of my Stackoverflow accomplishments. And it’s visually interesting so the reader is more tempted to click on it.

exercism

It’d be cool if excercism offered some similar “flair”; a little infographic expressing badges collected, tracks completed, overall reputation, etc.


(This post was originally posted on github exercism/exercism Issue #6592)
(Some links are code-fenced due to restrictions on links for new forum users)

5 Likes
2

Yeah this is a great idea, and also one that was suggested by multiple people (including moi) during various calls leading up to the v3 release, and after releasing.

I think the following as a default would be preferable, but let’s discuss, y’all!

Always visible

  • Exercism picture or identicon
  • Exercism username (pronouns)
  • Reputation in humanized form

Styles

I think it would be really great to be able to highlight whatever you like to focus on, in the same way that steam allows you to pick what to highlight on your profile. This is very different for very different people. Here are some suggestions:

  1. Focus on badges. In this case you would get the 4 badge colours + numbers. The second row could then have the most prestigious + recent badges.
  2. Focus on contributions. In this case you could show the icons for Publishing, Mentoring, Authoring, Building, Maintaining, Other.
  3. Focus on learning. In this case you could show the top languages on the first row, and use the second row for a total + recent statistic.
  4. Focus on mentoring. I think you see where I am going with this.
  5. Focus on completionism. Show tracks at 100%, and then the highest non-100% including percentage.
5 Likes
3

This sounds like a really useful idea as Exercism expands - are there plans to implement this?

@SleeplessByte, I love the styles suggestion! A doubt, what’s the difference between suggestion 3 and 5 - how do you rate “top languages” (no. 3)? Also, what would you consider to be “humanized form”?

1 Like