diff --git a/docs/hyperloop/userdocumentation.md b/docs/hyperloop/userdocumentation.md index ef0b43cd..6255f0f3 100644 --- a/docs/hyperloop/userdocumentation.md +++ b/docs/hyperloop/userdocumentation.md @@ -3,6 +3,34 @@ sort: 1 title: User Documentation --- +## Introductory Tours + +When opening a page in Hyperloop which has not been visited before, a guided tour will explain key concepts. These tours provide an interactive learning experience for Hyperloop, easily activated with a single click. They are ideal for beginners and for refreshing knowledge. + +Where appropriate, when one tour ends, the next will begin to explain the next section of Hyperloop. Tours can be exited at any time. Once closed, they will not automatically begin on future page visits. + +
+ +
+ +### Tour Elements + +* Each element of Hyperloop with a tour includes a tour 🚌 button. Clicking this button initiates the tour. + +
+ +
+ +* Each tour step includes a _Next_ button to access the next step of the tour. The page will automatically scroll to and highlight the next element to be explained. Also displayed is the current step number and total number of steps in the tour. + +
+ +
+ +* Each tour step additionally includes an exit button. Clicking this closes the tour. After clicking this, the tour of the given section will not automatically open on future visits to the section of Hyperloop. To access the tour of the section again, the relevant tour 🚌 button must be clicked. + +* Many tours also offer direct links to relevant sections of the documentation for in-depth explanations, reducing the need to search through the documentation. + ## My Analyses * [**My Analyses**](https://alimonitor.cern.ch/hyperloop/) is a personalized webpage which displays all the analyses where the user belongs to. diff --git a/docs/images/JoyrideNextButton.png b/docs/images/JoyrideNextButton.png new file mode 100644 index 00000000..5d3dbd12 Binary files /dev/null and b/docs/images/JoyrideNextButton.png differ diff --git a/docs/images/JoyrideTourIcon.png b/docs/images/JoyrideTourIcon.png new file mode 100644 index 00000000..0e2bc3a3 Binary files /dev/null and b/docs/images/JoyrideTourIcon.png differ diff --git a/docs/images/JoyrideWelcome.png b/docs/images/JoyrideWelcome.png new file mode 100644 index 00000000..ace6cec4 Binary files /dev/null and b/docs/images/JoyrideWelcome.png differ