As a user, I experience a product tour upon first viewing of a page

[colleenskemp]

Problem: As a user, I need help text that allows me to understand the application through a tutorial. The current state is a screenshot and doesn't look great.

Suggested UX: Upon first viewing: User is taken through help text one note at a time. In help mode, user can hover over an element and see help text.

Background: We have some designs on tool tips here:

Workbook overview tutorial: https://www.figma.com/file/QImAyi1guE4AICGMN7uODK/Drawdown-Portfolio-UI-Figma-Chakra-UI?node-id=1804%3A998

Sidebar Navigation: https://www.figma.com/file/QImAyi1guE4AICGMN7uODK/Drawdown-Portfolio-UI-Figma-Chakra-UI?node-id=1736%3A128813

Solution dashboard: https://www.figma.com/file/QImAyi1guE4AICGMN7uODK/Drawdown-Portfolio-UI-Figma-Chakra-UI?node-id=1736%3A129211

Acceptance criteria:

As a user, I experience a tutorial of the application upon first viewing of a page.

I can also enter help mode and experience that tutorial at any time. This is found in sidebar navigation as grey question mark icon.

[colleenskemp]

@ralphcutler - Can you consent to the suggested UX approach as seen in the issue description?

@sutjin - Can you work with this as written? Is there any other UX direction needed?

[Chukslord1]

@colleenskemp Time Estimate: 10 Hours

[sutjin]

@colleenskemp

there are two UX requirements thats missing to complete this ticket

1. How does the user enter help mode?
2. On first login, there needs to be an indicator on pressing next to show the next tooltip

imo, the helpmode needs to be in a separate ticket vs. first login - although both share the same tooltip component, theres going to be different workflow to allow it to show respectively

[colleenskemp]

@sutjin - Creating separate ticket for the help mode and focusing this ticket on the first login. @ralphcutler - Can you pease help with first login UX - user communication. There should be communication to the user that they are being lead through a tutorial and an ability to move through it or close it out.

• @Chukslord1 for visibility.

[brodavi]

@Chukslord1 is evaluating several tour libraries to determine how hard it would be to coax them into a "help mode"