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

SvelteKit DocumentCloud Menu and Page Consistency #840

Closed
morisy opened this issue Nov 18, 2024 · 2 comments
Closed

SvelteKit DocumentCloud Menu and Page Consistency #840

morisy opened this issue Nov 18, 2024 · 2 comments
Assignees
Labels
design Colors, fonts, layout and other visual elements
Milestone

Comments

@morisy
Copy link
Member

morisy commented Nov 18, 2024

We'd like to have more consistency on DocumentCloud menu items. Some concepts underlying the redesign were (please correct or clarify as needed, couldn't find this explicit in the Figma):

  • Users use the left bar for navigation.
  • The right bar for action.

Right now, /documents/ /projects/ and /add-ons/ all off slight visual distinctions and different menu mappings, which I think hurts the usability more than we need to.

Consistent Action Buttons

We should have a consistent ordering and appearance (when applicable) in the "Upload Documents" section in the top right and generally on the left rail so that if a user is used to looking there for some item, it will appear there.

Image
Image

For the Upload Documents action box, I'd suggest the following actions, with the asterisked actions only appearing on /projects/ pages:

Upload (or Upload to Project)

  • Share & Embed (Make name consistent)
  • Edit Metadata
  • Edit Project Data*
  • Edit Tags & Data
  • Move to Project
  • Reprocess
  • Delete Document(s)
  • Delete Project*
  • View in Document Search*(would we still need this? Maybe we can drop it entirely?)

We should similarly keep the left hand side consistent, though adding Project Collaborators when on a project page but otherwise keeping the left hand menu the same.

I would suggest keeping that left hand rail for /add-on/ pages as well, and moving the Add-On pane to replace the right rail to be consistent with the initially stated left/right navigation/action distinction, while providing clearer markers for people to get back to the key area they're most likely to be interested in. I would also have the Add-Ons that don't run on documents still show the document pane for consistencies sake.

We should also be consistent in how items are capitalized. Our current style guide calls for clickable menu items to be capitalized; descriptive text should not be capitalized "Your Documents" button vs. "Your documents are safely saved." dialog. We have a place places such as Edit Metadata and Move to project in the Upload Documents dialogue area and EXPLORE by the Projects and Add-Ons menus where this convention is not followed.

@eyeseast eyeseast added this to the SvelteKit RC milestone Nov 18, 2024
@eyeseast eyeseast added the design Colors, fonts, layout and other visual elements label Nov 18, 2024
@allanlasser
Copy link
Member

@morisy I've noticed some similarity in how we show search shortcuts and how GitHub shows shortcuts for filtering issues:

screenshot_2024-11-21_at_11 32 44___am_720

If we moved the document search filtering shortcuts out of the left sidebar and into a search filter dropdown, this would go further to making the left sidebar globally consistent:

Screenshot 2024-11-21 at 11 53 17 AM

Thoughts?

@allanlasser
Copy link
Member

I've forked this into three smaller issues with tighter scopes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design Colors, fonts, layout and other visual elements
Projects
None yet
Development

No branches or pull requests

3 participants