Checklists can be created in 4 different styles (stay tuned for more styles) to best align to the aesthetic of your product and vision:
Nested
Flat
Compact
Timeline
Choose a checklist-style when you create a "New user checklist" or set your org's default style in branding settings.
From the preview tab of any checklist guide you can also switch between styles and launch the updated style.
Nested
Nested guides allow you to provide detailed information to your users in each step. You can include multiple forms of media (e.g., pictures, videos, gifs, etc.), many lines of text, and links / calls to action.
The Nested guides are often made up of many steps and are most relevant for more complex products and onboarding flows.
Flat
Flat guides are meant for simple onboarding flows to clearly outline the few required steps, include call to actions, and link users to relevant documentation as needed.
The step descriptions will be 'inline' with the titles rather than requiring the user to open the steps to expose the description, this is true for guides inline and in the sidebar.
You can include all content types and branching in flat guides but it may require you to adjust the step height.
Note: We recommend step descriptions for flat guide to be quite short to avoid a jarring UX.
Compact
The compact layout most closely resembles the nested layout in terms of the assets you can include and the length of the steps.
The compact layout allows you to show the simple steps required for onboarding upfront, followed by more detail guidance when the user clicks into the experience.
Timeline
The timeline layout gives you the opportunity for horizontal scroll / navigation rather than vertical like the other layouts.
It is great for simple onboarding steps that are more informational rather than action-oriented.
If there are any other guide themes or styles you would like to see send us your inspiration and we will help you create them!
Hiding completed steps in checklists
For flat and compact guides you can hide completed steps from the inline and sidebar checklist.
In the styles tab of any checklist make sure the layout is flat or compact
Select "Hide completed steps"
Play with the preview to see what the end user experience looks like