Redesign the dashboard

[StanFromIreland]

Inspired by memory.python.org.

This PR changes a lot, so I propose to leave the metadata.html and the per language pages alone for now, and complete them in a follow up. I think we will be able to get rid of the metadata page, and simply merge it with the language pages (in said followup).

Alternative for #101

Closes #99, partly #67

---

📊 Dashboard preview 📊: https://python-docs-translations.github.io/dashboard/105/merge/

[AA-Turner]

Could we keep to 3 columns maximum? On a wider screen, four feels too many. It's also unclear that the first link goes to the devguide.

[m-aciek]

The navbar is much nicer than what we have currently.

Regarding the cards, and the dashboard as whole, the biggest UI/UX challenge for me is to link to three places for a language:

• contribution page,
• translated documentation,
• language stats details

and how to do it in a clear and not overloaded way.

I'm highly interested with that addressed, and it's not yet solved here.

[AA-Turner]

More design feedback:

There should be a reasonable max-width, so that the columns aren't this wide on a large screen.

Without a progress bar, it's unclear why the sorting is as it is. The most emphasised information is the language name, so I would expect alphabetical sorting. If we want to keep progress sorting, can we restore the progress bar on each card?

Can we say "Documentation Translations [Dashbord]"?

I think if we have this nicer view we can remove the chart view? We could probably include the metadata inline in each card, too.

A nice source of inspiration might be https://translations.react.dev/ -- the cards here link directly to the "place to translate" which I think is the likely expected experience.

[StanFromIreland]

I think if we have this nicer view we can remove the chart view? We could probably include the metadata inline in each card, too.

Yes, that is what I meant in the PR description.

[StanFromIreland]

I think if we have this nicer view we can remove the chart view? We could probably include the metadata inline in each card, too.

I agree, but I propose to leave such things to a follow up PR.

Followup prs:

• Removing Charts for good (... or convert it to use matplotlib and generate a few more interesting ones?)
• Merging Metadata with each language page, I think this will just be a card with the details
• Implementing Macieks Language details on each language page: Language details #94
• Big Refactoring/cleanup once all features are implemented

[StanFromIreland]

@m-aciek

and how to do it in a clear and not overloaded way.

That is why I have them on the language details page, WDYT?

[AA-Turner]

I would suggest removing the language-specific pages, I don't think they add much. Instead, I would add the "localised name" and repository link to the card, and make the card link to the contribution place.

We could then have a tick-box for "more details" that could show the switcher details, number of translators, branch, warnings/failures, etc -- but this could be hidden by default.

Can we also fix the grammar for the footer -- i.e. "at" and "in 7:14 minutes". I'd expect it to read "Last updated on Saturday 26 July 2025 at 9:56:43 UTC (in 7 minutes 14 seconds)" [or, "(in 7m14s)"].

[StanFromIreland]

I would suggest removing the language-specific pages, I don't think they add much

Please see my previous comments. This page may be empty now, but will in the future have a detailed progress report. IMO, that since we will have the page anyway (for said report), why overload the main page? Instead of a tickbox (which would mean the whole card cannot be clickable) and a compact display that must omit details, we can have a nice expansive one.

I will fix the grammar.

[AA-Turner]

This page may be empty now, but will in the future have a detailed progress report.

Sorry, I hadn't picked this up. I'm still on the fence -- I think it could be too busy. For now, could we remove the per-language pages, and perhaps reintroduce them alongside the PR that would introduce this?

tickbox ... would mean the whole card cannot be clickable

Apologies, I had meant a single tick-box for the whole page. For now though, we could omit this. The only things on the per-language pages are the "local" names (which we should move to the main cards anyway), switcher/build details, and the contribution links. I think all of this could just be moved to the cards. I would suggest removing the list of all translator names regardless of what we do, because it is too busy/long.

a compact display that must omit details, we can have a nice expansive one.

Less is more! People don't read [on the internet], so we should aim to present the minimal set of maximal information possible.

A

[StanFromIreland]

For now, could we remove the per-language pages

I am a fan of the pages, and when generation takes ~3 seconds (on my machine, so I assume the CI is one or two more) I don't see why not:-)

I would suggest removing the list of all translator names regardless of what we do, because it is too busy/long.

I think it is a good way of appreciating contributions, though not overly important, so I would drop them to the very bottom of the file (when we generate the full report).

I had meant a single tick-box for the whole page.

I think this would make it difficult to navigate, suddenly the section you are reading disappears of your screen.

People don't read

I know;-) But, there is also a reason for memory.python.org not being a single page with one graph where all of the charts are thrown on top of eachother! Most people don't care about "the number of sphinx lint warnings" a particular translation has, but yet some people do [e.g. me]. So, meeting in the middle, there is one, "simple" page for those who don't need much information, and more detailed pages for those who would like to access it.

[AA-Turner]

when generation takes ~3 seconds ... I don't see why not

My goal here is to present the most useful information in the simplest way possible. As such, the speed of generation isn't a primary concern. I'm pushing back on the per-language pages as I'd like to explore the more constrained design space of a single-page card view first. The risk I see is that we start presenting far too much information, much of it useless to the modal reader. By restricting ourselves to a single page, it forces us to consider what information we present more deeply. It might be that we discover, in time, that we do need ancilliary pages for displaying more detailed statistics -- but I'd like for us to try the more constrained page first. Choosing what not to show is often harder than the converse!

I would suggest removing the list of all translator names regardless of what we do, because it is too busy/long.

I think it is a good way of appreciating contributions, though not overly important, so I would drop them to the very bottom of the file (when we generate the full report).

I'd still drop the entire list -- we don't show contributors on docs.python.org, for example. The contributor lists are still discoverable elsewhere, so we're not loosing a unique resource.

I think this would make it difficult to navigate, suddenly the section you are reading disappears of your screen.

Good point. I think to start with we can ignore my tick-box idea -- 'Simple is better than complex'!

A

[StanFromIreland]

Maybe I simply don't understand your vision, but we already have what you would like, to some degree IMO. The index features the key/superficial information, for the "modal reader," the "unimportant information" for most, i.e. contribution links, switcher status, native name (and later build details and detailed completion) is separated for those who would like to see it.

@m-aciek , which design do you prefer?

[m-aciek]

• language details: I think we can invest in sphinx-doc/sphinx#11537 instead, and have the dashboard simpler
• progress: (related: #96) I would track only the core (tutorial, library/functions, bugs) with percents, the rest I would convert to number of words translated and number of words translated in last thirty days; I think tracking the overall progress percent is daunting for translators, as the whole docs volume is very big, and some specific parts of docs can be deprioritised; also sphinx-doc/sphinx#11537 can be kind of per-chapter alternative to tracking the overall percent progress;
• order: with the point above we could have a two-level "sort by": core progress and language name; those two points could be implemented in a follow-up PR;
• number of translators: I would drop this number (and list) completely from the dashboard, as after a python-docs-translations/transifex-automations#155 Transifex fix this data is not reliable;
• links: I would still try to link to both browsing translated docs and contribution pages from the main view

[StanFromIreland]

(@AA-Turner will be happy to know I have conceded...)

language details: I think we can invest in sphinx-doc/sphinx#11537 instead, and have the dashboard simpler

I have removed the per language pages.

progress: (related: #96) I would track only the core (tutorial, library/functions, bugs) with percents, the rest I would convert to number of words translated and number of words translated in last thirty days; I think tracking the overall progress percent is daunting for translators, as the whole docs volume is very big, and some specific parts of docs can be deprioritised; also sphinx-doc/sphinx#11537 can be kind of per-chapter alternative to tracking the overall percent progress;

This should be a follow up, lets keep this PR to (mostly) front end work.

order: with the point above we could have a two-level "sort by": core progress and language name; those two points could be implemented in a follow-up PR;

I can do this in a follow up.

links: I would still try to link to both browsing translated docs and contribution pages from the main view

There is only one page now. (Excluding the old pages, which are to be done in a followup as planned before.)

number of translators: I would drop this number (and list) completely from the dashboard, as after a python-docs-translations/transifex-automations#155 Transifex fix this data is not reliable;

For non-TX translations it is, and the dashboard has always had this statistic, so I'm not sure on removing it.

[m-aciek]

Thank you for your work on it!

Animation: in my opinion current animation with zoom and negative colors makes it harder to read, I think the hover effect should be delicate.

Language code: I think language code is too technical, I'd suggest to incorporate in a link (like docs.python.org/pl as a text of a link?), or drop it.

number of translators: I would drop this number (and list) completely from the dashboard, as after a python-docs-translations/transifex-automations#155 Transifex fix this data is not reliable;

For non-TX translations it is, and the dashboard has always had this statistic, so I'm not sure on removing it.

I would at least omit it for TX-translations.

Repository link: I think repository link and contribution link are overlapping. I would choose one, maybe for TX-translations we should link to readmes instead of linking directly to Transifex landing page?

Chart: not looking back, I would drop the chart in this PR. We can move the bottom text to the bottom of the cards view.

[StanFromIreland]

Animation: in my opinion current animation with zoom and negative colors makes it harder to read, I think the hover effect should be delicate

I see, I can remove it.

Language code: I think language code is too technical, I'd suggest to incorporate in a link (like docs.python.org/pl as a text of a link?), or drop it.

Same as above, I'll remove it, you can get it by clicking "View" anyway. (Also note that not all /lang redirect to /lang/3/)

I would at least omit it for TX-translations.

Not all TX translations are affected?

Repository link: I think repository link and contribution link are overlapping. I would choose one, maybe for TX-translations we should link to readmes instead of linking directly to Transifex landing page?

I disagree, I personally find I need to go to the repository more often. Linking to readmes is not great, not all repos have proper ones, and the branch they are on vary, i.e., they can be on a different branch from the files.

Chart: not looking back, I would drop the chart in this PR. We can move the bottom text to the bottom of the cards view.

I’ll drop it.

[m-aciek]

Sorry that it took me so long to get back to it.

Animation: in my opinion current animation with zoom and negative colors makes it harder to read, I think the hover effect should be delicate

I see, I can remove it.

Sorry I wasn't precise: I think that zoom effect with couple of lines of text makes it difficult to read, I would prefer a grey background highlight. If we were to stick with zoom, we lack a fade-out animation that causes a visual jump.

I would at least omit it for TX-translations.

Not all TX translations are affected?

Those that temporarily stopped to pull from TX are unaffacted. They will be when they reenable pulling.

Repository link: I think repository link and contribution link are overlapping. I would choose one, maybe for TX-translations we should link to readmes instead of linking directly to Transifex landing page?

I disagree, I personally find I need to go to the repository more often. Linking to readmes is not great, not all repos have proper ones, and the branch they are on vary, i.e., they can be on a different branch from the files.

In my opinion from a reader's perspective it doesn't make sense to differentiate between repository and a contribution link. I'm strongly inclined to have only one link, I'd link contribute to repository as a middleground.

[AA-Turner]

Sorry I wasn't precise: I think that zoom effect with couple of lines of text makes it difficult to read, I would prefer a grey background highlight. If we were to stick with zoom, we lack a fade-out animation that causes a visual jump.

On my PC, the zoom has a distracting aliasing/blur, and the diacritics move. I've tried to record it (see below). I agree with @m-aciek, pleasecould we replace the hover effect with e.g. a drop shadow or a fade-in border, rather than a zoom?

Screen.Recording.2025-08-05.143400.mp4

[StanFromIreland]

I have stripped the cards view and the hover effect.

Can further refactoring of the generation files (e.g. removing the now unused translator count generation) be left to the follow up pr?

[AA-Turner]

Suggested change

	<h5 class="card-subtitle text-muted">{{ project.translated_name }}</h5>
	<h4 class="card-title">{{ project.language.name }}</h4>
	<h4 class="card-title">{{ project.language.name }}</h4>
	<h5 class="card-subtitle text-muted">{{ project.translated_name }}</h5>

[StanFromIreland]

I preferred the previous ordering, is there a reason why it was changed? translate.react.org focuses on the translated name rather than the English, for example.

[AA-Turner]

It goes against semantic HTML to have a lower heading before a higher one, it suggests that this is an entirely new section. Currently, this dashboard is designed for translators & those of us managing the documentation, if we make a version of the dashboard geared towards readers then it might make sense to reverse the order ('local' name first).

[StanFromIreland]

It also has the side-effect of this odd vertical spacing:

[AA-Turner]

Ahh, ok. Would you be able to include a CSS fix in the followup PR?

[StanFromIreland]

I’ll get an emergency fix in half an hour or so as I’m away:-/