search

Quansight-Labs / czi-conda-forge-mgmt

🚀 Top level project management for conda-forge CZI grant
https://github.com/orgs/Quansight-Labs/projects/10
BSD 3-Clause "New" or "Revised" License
5 stars 0 forks source link

Quetz maintainers dashboard mockups #14

Closed jaimergp closed 4 months ago

jaimergp commented 1 year ago

📌 Summary

Investigate and design prototype mockups with the desired features for the maintenance board

📝 Background

conda-forge.org/status offers a "maintainers dashboard" with information about:

This panel has grown organically over the years without significant UX or accessibility analysis. We will provide mockups that offer the same functionality with a consistent UI informed by best practices in UX and accessibility.

🚀 Tasks / Deliverables

📅 Estimated completion

This task should be finished in the first six months.

ℹ️ References

SylvainCorlay commented 1 year ago

cc @GabrielaVives

GabrielaVives commented 1 year ago

I have been investigating different design solutions for the conda-forge.org status website. For the moment I have focused mainly on the information architecture, trying to organise the information with more hierarchy.

Here is the link to the prototype

I illustrated how having a main page with a dashboard-style view could interact with other more detailed pages for each section. However, here the dashboard is scrollable with a left-panel menu to help users quickly access the information they are looking for.

I have detailed on the first page of the prototype what I have done already, and what I am planning on working on next. In the second page of the prototype, are a few tips for navigating through the prototype (built with figma). If you encounter any difficulties using it please don't hesitate to contact me.

Any comments or suggestions from users are welcome and would be greatly appreciated to help understand what information is the most important for you. Please either comment directly on the prototype, or summarise your thoughts in this thread.

I would be happy to organise a community meeting to talk about this topic and prioritise the next steps together?

jaimergp commented 1 year ago

Apologies for the ultra delayed response and thanks for sharing that @GabrielaVives! I took a look at the Figma canvas and I like what I see! It's also my first time properly navigating a multi-page canvas so I'll be honest and confess that at some point I was lost 😬 So there's a chance I missed something?

I am happy to go on a 1:1 call anytime (check my Calendly here), but the team is conveniently meeting next Monday at 4PM CET (see here for details), so that'd also be a good time to share the work with the grant team. We can then iterate and share it with the broader community on the next conda-forge core call (Wednesday 8th, 6PM CET). As you wish! And again, apologies for only replying to this after two weeks!

GabrielaVives commented 1 year ago

No worries, the link is a bit outdated now as I have changed quite a few things since, so it's normal that it confused you. Sorry, I haven't updated the link yet.

Here is the latest version, it may make more sense !

Anyways I will walk you through when we have a call. I'll have a look at your calendar and send you an invite soon!

jaimergp commented 1 year ago

Thanks for the update and wow that new version looks awesome! ✨ Loving it <3 I'll wait for the invite.

jaimergp commented 1 year ago

Gabriela and I met today.

We reviewed the dashboard mockups and provided some items for feedback and discussion. Namely:

We will present the mockups in the conda community call today for more feedback, iterate a bit and re-present in next week's conda-forge call.

GabrielaVives commented 1 year ago

We have been thinking about introducing a new page that would list all the packages in a table, with information on their status, what other packages they are waiting for, what migrations are they involved in, etc.

image

This would allow user to search for a specific package and see all the dependencies, instead of having to search through a table of migrations using ctrl+F.

Do you see a use in this way of displaying this information ? Would there be any other or different columns you would add?

jaimergp commented 1 year ago

From today's conda-forge core call:

@mbargull:

If direct links à la <dashboard-url>/migrations/<migration-name> would be possible, that'd be awesome :).

@dbast:

Any ideas how to implement that? A fancy python holoviz panel with interactive pyscript elements? Very nice.

@SylvainCorlay:

I would go with good old web development. Mostly frontend.

@jaimergp:

Yea, ideally JSON-backed clientside only, no backend

@hmaarrfk:

While not in the status page, we have https://conda-forge.org/feedstock-outputs/ which is an important discovery tool. I feel like this is similar to the "packages" page which you dis (...)

is the "issues" taking the space of "Announcements"? I've seen a few important announcements from John before for critical issues.

Something that would help me from a conda-forge perspective is finding what packages a given user maintains. (another idea for the "dashboard", but admittedly a new "feature" and less of a "reorganization")

jaimergp commented 1 year ago

I see a package (or, more accurately, feedstocks) involved in these potential scenarios:

New version updates:

Migrations:

This global view of feedstocks would also allow us to implement other metrics, like the maintainers search, or which artifacts a feedstock produces. However, as stated in the call by other members, it's true that it might be technically challenging to provide all that info in a performant way given that we have almost 19K feedstocks. UI pagination and/or on-demand search might be required.

However, thinking about it in a different way, what would a like a "feedstock details" card/section would look like? I could imagine a detailed feedstock card with info like:

beckermr commented 1 year ago

I'm wondering if we'd like to emulate at least in part the status pages of other major services like

There is a pretty standard visual language for status pages. Usually, this is a big banner at the top that is color coded with details in a single-page that simply scrolls down with components stacked vertically instead of on a large grid.

I don't know why exactly all of these services choose to do things this way, but for sure it appears to make the page simpler to grok quickly and find the primary bits of information that are important, namely the current status at the top and any incident details right below.

jaimergp commented 1 year ago

@GabrielaVives - can you post the link to the figma file you showed today in our call? Thanks! 🙏

GabrielaVives commented 1 year ago

Here is the current state of the prototype: https://www.figma.com/proto/rdSQ2UFHNgLeq80LMxkV48/Website?node-id=46-431&scaling=scale-down&page-id=0%3A1&starting-point-node-id=46%3A431

trallard commented 1 year ago

Hey @GabrielaVives - I wanted to check how the progress on the dashboard is going.

@jaimergp and I were wondering if we could schedule a call soonish - ideally in the next couple of weeks - to do some design review/critique on this. Let us know what you think.

GabrielaVives commented 1 year ago

Hi @trallard ! Yes sure, I have been making good progress but haven't updated anything this week. We could setup a call next week?

trallard commented 1 year ago

Hey @GabrielaVives thanks for your patience - we just got back from our company offsite so @jaimergp will be organising a call in the upcoming days to align on this

jaimergp commented 4 months ago

This is complete. See https://github.com/Quansight-Labs/czi-conda-forge-mgmt/issues/17 for updates in the implementation.