Just curious if there are any resources, plugins that will quickly help \create a short wizard, tutorial or guided tour that prompts users through various menus/buttons in a XOJO app.
So click on floating menu of topics and then it prompts user for each action to complete with pointing/highlighting buttons etc.
Yes… I could build but wondering if there is a generic scripting tool, along with supporting text that can be built as template to reuse portions.
nice a joke?
For something simple, you can use the tooltip class, but it is not native and looks awful on windows.
Easieast way, create a window with no borders, put the text and images there, you can use a single canvas that covers all the window and draw there. Show the window as modal and move it acordingly:
Yes, this means you have to make all the positioning and drawing manually.
If you want momething fancier, use declares to create custom shaped windows.
I create similar guides or transaction checklists in my Xojo Web projects using the Alert controls from GraffitiSuite.
I have a switch on each webpage to toggle on/off assistance/guidance for users.
So for instance if a user is creating a Sales Proposal and the guides are switched on, all steps in process appear as numbered alerts and are dismissed as each step is completed. So Step 1 may be to enter a Project Name - the alert will contain a advice or instructions for completing that step. When a project name is completed based on the rules applied to it, it’s alert will be dismiss (based on a TextChanged event in the related WebTextField.
The Alerts in GraffitiSuite have excellent styling and positioning. I usually push them to the right of the window. Just be careful to include some code to remember where a user is up to in a process if they navigate away then come back (I store incomplete transaction data in the session including the status of the guides).
Since adding the guides support tickets have all but evaporated. It does take some time to implement first time around but you get quicker.
I hope that helps.
Kind regards, Andrew
Ivan… Thanks for feedback!
Andrew… Thanks for feedback!
Are you talking about a web application or a desktop one?
If web, then I could share a library we made do integrate step-by-step tutorials using https://introjs.com/
@Lars_Lehmann, introjs looks very cool. I’d be interested to experiment with your library as well.
Kind regards, Andrew
Here you go:
I actually worked on my own implementation of Intro.js a while back, but had to move on to other more pressing things. Thanks to @Lars_Lehmann for sharing! You should also be wary of Intro.js licensing, as you need to purchase an appropriate license to use it in commercial products.
This is strictly a desktop application.
Yes…I like Intro.js but it is only for web apps.
It would be great if something like it was available for desktop
What OS do you need ?
@Lars_Lehmann, Wonderful! thank you for sharing…
Kind regards, Andrew
Windows for now…
I’ll throw in my two cents,
The only way I was able to achieve somewhat of a guided tour was to have small help buttons placed throughout my application. Then I created “plain box” windows, turned all frame options like Close, Maximize etc… to false so I’m left with just a plain rectangle window and fill it with whatever info the user should need using a label. then I use the mouse enter and exit events to call on the window and close.
Please bare in mind that I am very new to xojo, I hope this helps in some way.
Robin
EDIT, I didn’t see Ivan’s posted above, apologies!
@Lars_Lehmann, @Anthony_G_Cyphers,
I thought it worth mentioning that if you use WordPress for your company and/or product documentation website there is a WordPress plugin for Intro.Js WP Intro.JS Plugin – WordPress plugin | WordPress.org .
Kind regards, Andrew
I was curious if its possible to implement this functionality into the Desktop environment. So I started a little project to port some of the functions of intro.js to a desktop app.
Turns out it is really easy.
I guess I’ll publish it tomorrow.
Allright guys, here it comes:
Took me about 3.5 hours of work. It feels a bit rough due to the fact that there are no animations. If I have time later I’ll implement it with AnimationKit of @Thom_McGrath to smoothen everything a bit.
A Screencast is in the Repo. Heres an excerpt from Github Repo Readme:
messagebox
RectControl, but also Window and ContainerControl is possibleI don’t plan to put much effort into this project. It was a fun little thing which I developed in three hours. But since I’m not really using Xojo desktop, I wouldn’t make use of it in the future.
So feel free to pull the code, extend it and send your improvements in a PullRequest/MergeRequest. It’s now up to you to make this basic thing better.
This should fit the expectations now:
I made some improvements:
I skipped also the thoughts of implementing animations and fading. It’s to complicated and to much work. Maybe some of you might implement it someday?
I was thinking more on something like this:
