Skip to content

Guides section rework #152

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

Merged
merged 46 commits into from
Feb 22, 2024
Merged

Guides section rework #152

merged 46 commits into from
Feb 22, 2024

Conversation

nrichers
Copy link
Collaborator

@nrichers nrichers commented Jan 26, 2024

Internal Notes for Reviewers

This PR introduces several incremental improvements to the "Guides" section and sidebar of our docs site. The best way to preview the changes is to compare the old and new sites:

Addresses:

Major changes

  • A new "Guides" landing page now curates the main tasks at the H1 level from the sidebar (in the original version of this PR, they were curated by role)
  • A matching, restructured left sidebar enables navigation of content by major product features or user tasks, now collapsed at the H1 level to be more compact
  • Short descriptions have been reworked to just state the task being covered, removing the repetitive "Learn how to ..." and "This topic is relevant for" text; their maximum length has been reduced to 250 characters, down from 500 in the original version of this PR
  • Roles indicated by "This topic is relevant for ..." are now included in the prerequisites for H1 task topics where they belong
  • There are a number of new placeholder topics for the next phase of work

Minor changes

  • Sidebar navigation now more closely mirrors the current style used in the Platform UI, with some white space taken out to accommodate the much higher number of navigation links
  • Non-clickable sidebar text now looks different visually from clickable topic links; this change has also been applied to sidebars in other parts of the docs site, where applicable
  • Listing tiles and call-outs now have more clearly demarcated borders and a light drop shadow
  • Listing tiles now use more compact text which feels to scale and also fixes the odd card title overrun in the test descriptions
  • The keyword metadata has been removed as keywords are now displayed verbatim and we do not currently use them to improve SEO

This PR does NOT cover all of the Guides section rework, more PRs will come (cf. placeholder topics with lorem ipsum text). But it is a prerequisite to future content updates and should enable us to have a better conversation about the content architecture for this part of our docs site. If this format works, I will start a similar PR for the "Developer Framework" section.

Notes on the original new "Guides" landing page rework — OLD, IGNORE

The issue: The current, sparse page makes it difficult to know what you should be doing after you have completed the Quickstart and there's not a good way to highlight the most important tasks. The left sidebar is your only method of navigating content but it's really just a long list of topics, divided by role. If I had perform a task on, say, model templates I would need to scan the sidebar or use the search.

The resolution: Add a new landing page that curates the most common or important tasks by role, and then subdivide those tasks further into getting-started tasks and tasks you might perform more regularly. For example: if I am an admin, I should be able to see at a glance what I need to set up ValidMind for my organization. Or, if I'm a model developer, I want to know what I need to do get started with documentation projects, now with a better tie-in with our separate developer framework section. THIS HAS BEEN REPLACED, SEE ABOVE

The way this page is implemented is by taking the idea of Quarto document listings, tweaking the format to suit our purpose, and creating several smaller listing sections. This way, content updates in the topics listed here are automatically reflected in the listings which makes future maintenance easier.

If this format is well received, it could serve as a template for reworking the slightly awkward end-to-end workflow in the developer framework section (itself already an improvement over the massive flowchart we have in Miro, but the developer experience can be improved further).
Restructure the left sidebar

The issue: Our current sidebar tried to do what the new landing page does by superimposing a division by role, but within the limitations of a small sidebar that is not well-suited for the purpose. Additionally, we have some section headings that are not actually clickable topics which can make for an awkward user experience as you click around. It's currently the only way to find your way around the "Guides" section but it is not ideal.

The resolution: Sidebars work better when not overloaded. Let's restructure the left sidebar to facilitate navigation by product area or major feature, complementing the new landing page's role-based navigation of common tasks. This change also enables us to highlight product features that are designed to work across roles, such as collaboration between developers and validators. We can also indicate better what is a clickable topic and what is a HEADING by upper-casing the latter.

External Release Notes

A new landing page for the "Guides" section of our docs site now curates the most common tasks by roleto help you get up and running with ValidMind in a production setting. Additionally, a restructured left sidebar enables navigation of content by product area or major feature. Both of these changes make it easier to find the content relevant to you, whether it is for the role you perform or the product features you are interested in.

@nrichers nrichers added the internal Not to be externalized in the release notes label Jan 26, 2024
@nrichers nrichers marked this pull request as draft January 26, 2024 05:51
@nrichers nrichers added documentation Improvements or additions to documentation and removed internal Not to be externalized in the release notes labels Jan 26, 2024
Copy link
Contributor

Pull requests must include a description in the release notes section.

1 similar comment
Copy link
Contributor

Pull requests must include a description in the release notes section.

@nrichers nrichers marked this pull request as ready for review January 26, 2024 16:24
@nrichers nrichers requested a review from mehdi0501 January 26, 2024 16:24
Copy link
Contributor

@mehdi0501 mehdi0501 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

my comments are for the new structure only (I know the content within pages is still placeholders).
The new structure looks very good - much easier to navigate and the content organization is a lot more helpful.
This structure will also make it much easier to add new topics and sections

Copy link
Contributor

github-actions bot commented Feb 9, 2024

Pull requests must include a description in the release notes section.

@nrichers
Copy link
Collaborator Author

One remaining item for this PR is to hide the content that isn't ready. Quarto does have support for conditional content, but not for entire topics, so we need to do a bit of work to hide content and keep track of what's been hidden:

In the front matter

  • In each unfinished topic, add search: false to prevent Algolia from returning unfinished content
  • In guides.qmd, comment out unfinished topics in the listing section

In _quarto.yml

  • Comment out the unfinished topics in the "Guides" section

Output changes

Highlighted topics have been hidden.

Before After
image image








@nrichers
Copy link
Collaborator Author

@nrichers nrichers merged commit 4e7bddb into main Feb 22, 2024
@nrichers nrichers deleted the guides-section-rework branch February 22, 2024 00:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants