Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.Sign up
UI introducing a help sidebar to provide more context #5612
Thanks to the community's feedback, we learned that customers were struggling to connect-the-dots on various Octopus concepts, from deployment targets and lifecycles, to packaging, tenants and even variables.
Our design has reached capacity for displaying help text, and we needed a way to show addition help text per page. We also wanted to introduce conceptual images to help customers better understand some of the key concepts of Octopus, such as targets, roles etc., so we needed room to display these images without adding noise to our existing layouts.
Internally, we explored conceptual images to better explain some of these concepts and decided on supporting summary text. Our goal was to help nudge users in the right direction, without creating too much noise to the existing UX.
We decided on a sidebar of help information that is both readily available and easily dismissible. This sidebar provides a quick summary of concepts related to the page you're viewing, as well as links to our documentation and additional helpful resources for people beginning their journey with Octopus.
The help text and concept images should be short, concise and to-the-point. It gives you a hint (or a push in the right direction), and if you need more information, it gives you an easy jump to our documentation. This should be helpful to both new and existing customers alike.
What this is
What this isn't
Why two help icons?
When you go looking for help, you should be able to find these help icons easily, no matter where you're looking. Similar to the "Configure Features" functionality of steps, we chose to display the help icons in 2 easily accessible areas: in the area title up top/right, and in the page layout's section title. So no matter where you're looking, you should be able to find it easily.
A right hand sidebar now complements the layout and, when open, balances the design against our left sidebar menus.