Skip to content
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

Guide through the interface #6695

Open
elizavetaRa opened this issue Mar 31, 2022 · 5 comments
Open

Guide through the interface #6695

elizavetaRa opened this issue Mar 31, 2022 · 5 comments

Comments

@elizavetaRa
Copy link
Member

elizavetaRa commented Mar 31, 2022

Expected behaviour

The web interface should provide an interactive guide to

  • show, what's new in the new release / since the last time user visited the app
  • demonstrate important functions of the interface

To discuss:

  • Conceptually: the guide consists of different tours, the tour consists of several steps
  • Usage of a library for the guide?
  • Where should the guide be stored?
  • Implementation in web/ as web extension?
  • Customization of the guide, injecting of guides
  • Advanced: mock-data to demonstrate functionality?

By CERNBox we decided to use shepherdjs liabrary for this purpose. With this library, it's possible to create tour instances built out of different steps. It's possible to attach steps to elements in the interface.

In cernbox@597eefee we implemented "What's new" guide:

guide

@tbsbdr
Copy link
Contributor

tbsbdr commented Apr 1, 2022

Nice, thats something I definitely want. From a users perspective, do those stories sound reasonable to you and meet the Idea?

1 - New features: (Everyday user)

  • As a everyday user I want a hint or guide about new features so that I can improve my known workflows.

2 - First-time guide: (first-time user)

  • As a first-time user who is afraid of randomly exploring the ui by clicking around, I want a guide that tells me what and how to do the most important things directly within the ui. The learning-experience should be more comfortable that reading the manual.

3 - Skip option (first-time user)

  • As a first-time user who wants to explore the user interface by simply trying it out, I want to easily dismiss anything that stands in my way.

4 - Customisation (support employee)

  • As a support employee I want to provide easy digestible, custom guidance for my users so that my support efforts are kept low.

Note: We also plan to have a ❓ next to elements that need more explanation: #6590

Your more technical questions are better addressed by @kulmann and team 💪

@elizavetaRa
Copy link
Member Author

@tbsbdr The stories sound good to me

I like the "?" idea. We would need customization/injecting options :)

@kulmann
Copy link
Member

kulmann commented Apr 8, 2022

First of all, really nice! Fully agree with @tbsbdr

Regarding implementation:

  • the lib that you chose makes a good first impression. license is compatible as well (MIT).
  • you or us (or both, needs discussion/planning, collaboration would be nice) could implement the tour in the web runtime
  • however, regarding the contents of the tour I think a hybrid approach would make sense. Like with the theme.json which is allowed to come from within the bundle or to be loaded via an external endpoint I'd like to have the same for the tour contents. Default content somewhere in the repo (e.g. in packages/web-runtime/tours) and additionally an option for the config.json file to allow externally loaded tours.

What do you think?

@elizavetaRa elizavetaRa mentioned this issue Jun 8, 2022
11 tasks
@tbsbdr
Copy link
Contributor

tbsbdr commented Jul 27, 2022

Maybe the guide ui can be combined with an announcement functionality, ex. when there is a planned downtime, it could be announced via this UI.

@dragotin
Copy link
Contributor

@elizavetaRa is that still used? Very interesting feature this is - maybe we can discuss that with @pascalwengerter during the workshop.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants