Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve proof explorer UI #13

Open
bgins opened this issue Jan 3, 2022 · 2 comments
Open

Improve proof explorer UI #13

bgins opened this issue Jan 3, 2022 · 2 comments
Assignees
Labels
enhancement New feature or request

Comments

@bgins
Copy link
Collaborator

bgins commented Jan 3, 2022

@matheus23 and I were discussing some ways we could improve the proof explorer UI. Here are a couple of things that could be improved:

  • The UI should keep the delegate chain when a user selects any delegate in the chain. This would allow the user to navigate backwards and forwards across the delegates without losing their furthest out exploration, which would help them keep context.
  • The UI could be more intuitive in general

The UI has some good aspects that it would be nice to keep:

  • The hints shown on hover give users a quick view of issuers and audiences
  • The yellow triangles that indicate invalid and undecodable proofs, which makes it easy to see where problems are at a glance

We should also see if we can keep the proof explorer UI in a single row below the Encoded and Decoded sections, for a couple of reasons:

  • The user can always see the Decoded section when interacting with the proof explorer without scrolling
  • Adding to that, the Encoded and Decoded sections stack at smaller screen widths, like when the browser takes up half of the user's screen. The Decoded section ends up on the bottom, and the proof explorer should be right below it.
  • It would be good to preserve space above Encoded/Decoded for a UCAN editor controls. This part isn't fully thought out yet, but it might include "Edit" and "Encode" buttons.
  • We could potentially put parts of the proof explorer into a carousel. It's not super likely that folks will have UCANs deep enough or with enough proofs for this to matter, so it should be considered optional (and maybe we don't do it now at all.)



@bgins bgins added the enhancement New feature or request label Jan 3, 2022
@bgins
Copy link
Collaborator Author

bgins commented Jan 3, 2022

One possibility would be to put the delegate chain on the left and proofs to the far right. Each delegate can be selected or not. When a delegate is selected, its proofs are displayed. When a proof is selected, it becomes the new tail of the delegate chain immediately after the selected delegate.

Here's a simplified prototype of what that interface might look like: https://svelte.dev/repl/2fec1ab80b6c442a9660157e6cab14dc?version=3.44.3

And a giphy preview of that prototype:

proof-explorer-ui-proposal

This preserves the delegate chain and the animations will make the interface more intuitive.

@bgins bgins self-assigned this Jan 5, 2022
@jeffgca
Copy link
Contributor

jeffgca commented Apr 22, 2022

Note from the eng cast today - perhaps we can take some inspiration from @appcypher 's cool demo for this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants