Wizards to Create UI Elements

#1

It would be fantastic to have a shortcut or a page control button that allows users to go through a step-by-step process to provide information (a wizard) and automatically create UI elements. This feature would make TiddlyWiki more accessible for beginners and intermediate users while being a significant time-saver for advanced users.

Examples:

  • Click and answer a few questions to create a View Toolbar Button.
  • Click and answer a few questions to create an Edit Toolbar Button.
  • Click and answer a few questions to create an Editor Button.
  • Click and answer a few questions to create a Page Control Button.
  • Click and answer a few questions to create a global shortcut key.
  • Click and answer a few questions to create a modal.
  • add more …

These wizards would automatically generate all the required tiddlers, fields, tags, and other necessary components.

–

7 Likes
#2

Hi @Mohammad I support this idea. Perhaps we might have an official “customiser” plugin that gathers together tools useful to people customising TiddlyWiki’s user interface.

The wizard framework itself should be part of the core – I’ve long wanted to have a more full featured startup wizard for the empty edition. The focus would be on setting up the appearance of TiddlyWiki: palette, background image, font, font size etc. We could also explore using a wizard to simplify the presentation of the “Getting Started” tiddler on tiddlywiki.com.

9 Likes
#3

Lovely! A “customizer” plugin, fantastic name :wink:
I would be eager to help with testing and documentation and WikiText scripting.

Is WikiText script sufficient, or do you think JavaScript code should be used?

As a crude idea, I thought of using modals and WikiText script.

1 Like
#4

Hi @Mohammad, that’s a good idea! Especially shortcuts can be annoying to set up, with various tiddlers that each have their own part in the process. I have not used modals much (at least not the core flavor), but I assume there are various pieces and steps required in that process, too.

For buttons, I will usually just clone a button that is close to what I need (like a popup, or formatting some text, or any action). I would imagine that this is at least as effective as having an “empty” button. An advantage of this method is that I do not need to think about all the details (like labels, icons, descriptions and whatnot) beforehand, but just use the cloned data. A wizard of course could fill in generic data where none was entered explicitly. That would probably be at least as good.

For my own purposes, where I don’t need language tiddlers and such, the clone method is probably the quickest. For beginners, a wizard might be more approachable, though.

1 Like
#5

Thanks, @Yaisog! That cloning method sounds efficient and practical. I appreciate you sharing your insights.

Like you, I usually clone something very close to what I need! I think a wizard can help create such UI elements smoothly without much hassle.

A similar case:
You might use templates; before I learned about templates, I used to create tiddlers and then add tags and fields one by one, sometimes I forgot correct tags or field names—a tedious task. However now, with an editor button, I can apply a template to any new tiddler to automatically add all the tags and fields, populating them with some default values.

#6

I think wikitext should be OK, but I personally do not like modals, especially on mobile. It should be OK to have one tiddler with several questions to create one UI element.

5 years ago I did create a rudimentary GettingStarted tiddler for empty.html, which did contained 5 different simple workflows for 5 different UI elements.

  1. Show Home Button
  2. Show Journal Button
  3. Create Table of Contents
  4. Create a Basic ToDo List
  5. Change the Story Layout

These elements could be separated into 5 different Wizards as you named them. Every wizard would do only one thing — one thing well. There could be some additional documentation, that explains what’s going on. IMO every wizard could link to a video, that shows, how it should be used.

GettingStarted.json (4.9 KB)

Just some ideas
-m

PS: May be the testcase-widget or something similar could also be used as a wizard-framework. So the wizards-plugin should not interfere with the main wiki.

3 Likes
#7

Thank you for sharing this example and your insights. Yes a simple tiddler is enough, no need for modal. I will try to create a tiddler wizard and share it here.

2 Likes
#8

Wonder where he got that from? :slight_smile:

https://giffmex.org/gifts/Customizer/customizer.html

3 Likes