2

I want to provide a suggestion list via list-box, it is not a search-suggestion.

User can choose an item from suggestion list which will then copied to a input textbox. How to make it clear to user that a list is pre-defined suggestion list and user can click on it which will then copied to inputs fields?

For example

enter image description here

Edit: A list of suggestion will be fixed list by us (HQ), not by the user reseller.. User (reseller) can not add Template. when user click on Add button, it will close the dialog popup and show a list of added entries on the main page. "Add" button is not for adding into to Suggestions list.

Updated UI, does this make more sense to user?

enter image description here

2 Answers 2

1

You can do it by naming the suggestions box something like "Template" and at the bottom (or top) add one suggestion that makes it plain that this is an entirely free-form template where the user can enter anything they like.

Another way of doing it would be to name it along the lines of "Recent".

EDIT: When having selected from the "Template" box, move focus to the "Name" box, with the dialog being able to be closed by pressing "Return".

The first time this happens, have a hovering tool-tip that describes that the user can change the contents of the "Name" and "Description" fields, even after selecting a template.

Let the "Name" and "Description" fields have a hint-text (the kind of text shown in gray that disappears when you start writing) that says "Type Name/Description, or select Template".

7
  • 1
    Renaming Suggestions to "Template" is a good idea. A list of suggestion will be fixed list by us (HQ), not by the user reseller.. User (reseller) can not add Template. when user click on Add button, it will close the dialog popup and show a list of added entries on the main page. "Add" button is not for adding into to Suggestions list. Mar 18, 2016 at 11:38
  • I have added new UI, check it out on my Question. Mar 18, 2016 at 12:02
  • I like it. Is it intended that the user shall be able to fill in/modify the fields themselves?
    – MichaelK
    Mar 18, 2016 at 12:07
  • Yes, if user select from template, they can fill in/modify the fields themselves. Or they can ignore the selection from Template (None is selected) and fill in the form and then press Add and dialog will be closed. It does not add to template list. Mar 18, 2016 at 12:12
  • Very well, I would then — on a selection being made — move focus from the template box to the "Name" field and add a floating tool-tip / instruction (at least the first time it is used) that the user may now modify the fields. Alternatively put in text between the template selection box and the "Name" field that indicates this fact. Also the "Name" and "Description" fields should have Hint texts that says something like "Write a Namn/Description, or select from template above".
    – MichaelK
    Mar 18, 2016 at 12:15
1

Templates need previews!

It bothers me is that there is no preview of the template, leaving users to guess if they want to use that template or not.

Also when you select a template from the list and edit the content, the selection is still shown. What if I decide to start over and apply the same template again? I will have to select something else first before selecting the same template again. A button for applying the template would be a solution. But when the content gets edited the name of the template is still shown above it and may not be accurate anymore, this could be confusing.

Solution: introduce steps

Step 1: Choose a template
Include a “Blank” option and a “Next” button. Provide a preview of the template so one knows what it contains. Since there is only a select box there will be enough space under it for the preview.

Step 2: Edit the contents when needed
Add a “Back” or "Choose template" button to go back to the template selection.

The two steps also make it less easy to accidentally switch the template and risk losing input.

3
  • Very good point, what about having a preview in a dropdown rather than introducing steps? For example like this: comtek4u.com/sites/default/files/images/backup-templates.jpg Mar 18, 2016 at 14:34
  • Well, steps have a few other advantages as I mentioned, but if this change is a bit too drastic, yeah go for the preview in the dropdown. It will be better than no preview at all.
    – jazZRo
    Mar 18, 2016 at 14:41
  • Also if you prefer a single step approach, add an "apply template" button instead of applying it directly, and a warning message when it will overwrite the modified content. Another idea is to add "modified" to the template name, like: [ Template A (modified) ]. It will solve most of the issues I mentioned.
    – jazZRo
    Mar 18, 2016 at 14:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.