Resource centre and help bubble¶
Resource centre¶
A resource centre is a panel that gathers help in one place. Create one with New content, then Resource center. It has three tabs, each of which can be relabelled and switched off.
| Tab | What it shows | Where the content comes from |
|---|---|---|
| Help | The sections you add, each a titled list of walkthroughs, processes and resources (documents, links, videos, FAQs, contacts), plus "What's new" announcements that wait for the help bubble | Sections in the editor |
| Tasks | One or more task lists with their progress | The lists you add or pick under Tasks. With none, the first published checklist whose own pages match, unless it is shown as a launcher |
| Search | Matches for what the reader types (see Search) | Everything in a visible section, plus the tasks in the checklists Tasks shows |
For a step-by-step walkthrough of Tasks and Search with screenshots, see Tasks and Search, step by step.
Typing in the search box jumps to the Search tab. The search box is hidden when the Search tab is switched off. Search never lists drafts, disabled content or anything you did not link. Segments do not filter the centre.
Search¶
Everything stays on the reader's device and nothing about searches is collected.
What is indexed
- The name, summary and keywords of each walkthrough, process and resource in a visible section.
- The task labels of the checklists shown in Tasks.
- The step titles of a walkthrough and the stage labels of a process (read when the reader types their first letter).
- For a document, link or video, the host name and the file name of its address.
Not searched: step text, announcement text, tip text and the contents of documents.
Keywords. Resources, walkthroughs and processes each have a Keywords field in the studio (comma separated). A walkthrough or process with no keywords uses its tags.
How matching and ranking work
- Every word the reader types must match the start of a word, so "claim" finds "Claims" but "laim" does not.
- Capitals and accents are ignored, so "cafe" finds "Café".
- Per word, a hit in the name counts most, then keywords and synonyms, then summary, step titles and the link name.
- An item that belongs to the current page ranks higher: its section is limited to this page, or its own page patterns name it. Other items still show.
- There is no typo tolerance.
Search card in the editor
| Setting | What it does |
|---|---|
| Synonyms | One group per line, words or phrases separated by commas, for example FNOL, first notice, new claim. Any of them finds items that match any other. A literal name match still ranks above a synonym match |
| Popular items | Shown under "Popular" in the Search tab before the reader types. You choose them; no usage is tracked |
| Hidden from search results | Items that never appear in search. They stay listed under Help |
| When nothing matches | A line such as "Contact support" and an optional https or mailto link, shown under "Nothing matches that search." |
Keyboard. The search box is a combobox. Down and Up move into and through the results, Enter opens the highlighted result (or the first one if none is highlighted), the first Esc clears the box and the second closes the centre. Screen readers hear the result count. The placeholder, count, empty and Popular texts can be translated with the centre's UI strings.
Later versions. Step text, announcement text, typo tolerance and links from a result to a particular step are not part of this version.
Tasks¶
Under Tasks in the editor, press Add task list to create a list without leaving the centre. It starts as a checklist named Tasks that shows in the centre. Press Add task for each task: give it a label, an optional one-line description, an optional Show me target (a walkthrough, process, announcement or resource) and Done when, which includes Manual for tasks the reader ticks by hand. Order tasks and lists with Up and Down.
- Pick an existing checklist adds one you made elsewhere. Remove from center only takes a list out of this centre; the checklist stays in your library.
- A task ticks itself when the real action happens (a click, a filled field, a page reached), even while the centre is closed. See Checklists for the goals.
- Ticks are kept when you publish. A list can opt out with "Start every reader's ticks over when this list is published".
- Add the number of open tasks to the help bubble badge counts unfinished tasks next to unseen announcements. It is off by default.
- Publishing the centre also publishes its task lists that are new or changed, so the Tasks tab is never empty because a list was left as a draft. Checks says which lists will go out, and a list with a problem blocks the publish and is named.
Tab names and languages¶
Each tab can be relabelled in the editor. A label you type is shown as typed. A tab left with its default name uses the Translations table of the centre (ui.help, ui.tasks, ui.noTasks and the task button labels), so a French reader sees French.
Link existing documents¶
Create the document first (a Resource, with a URL or an uploaded file). Then open the resource centre, add a section and tick the document under "Include". Only walkthroughs, processes and resources can be listed. To make a document findable without listing it under Help, set the section's "Shown in" to "Search only".
Page patterns¶
The centre itself has "Pages it shows on". Each section has "Pages this section shows on", and Tasks has "Pages Tasks shows on". A section or Tasks is hidden on any other page, in Help and in Search. Leave a list empty to follow the centre. Patterns are the same as everywhere else, for example /claims/*.
Auto suggest¶
With "Suggest content for the current page" ticked, the items of every section whose page pattern matches the current page are also shown at the top of Help under "Suggested for this page". It only has an effect on sections that have a page pattern.
Open the centre from the help bubble, from a launcher with the open-resource-center action, or from a walkthrough trigger of type resource-center.
Help bubble¶
The help bubble is the button that opens the resource centre. It is controlled per application, in app settings: enabled or not, its corner and an optional offset. The player reads App.helpBubble at run time.
| Position | Look |
|---|---|
| Bottom right, bottom left | The round 44 px button at the bottom of the page |
| Top right, top left | A compact 32 px header button in the top corner, for applications where a floating button at the bottom is in the way |
If the host page has controls in its top corner, move the header button in with Move it in from the side and from the top (pixels). A top banner announcement is drawn at the top of the page too, so check the two together.
Resume chip¶
If a user leaves a walkthrough part-way, a resume chip appears after the next page load. It sits inside the viewport and clear of the help bubble, resumes at the saved step, and can be dismissed.
Worked example¶
- New content, Resource center. Name it "Claims help".
- Enable the help, tasks and search tabs. Add a section containing the intake walkthrough and a handbook link, and tick the "Getting started" checklist under Tasks.
- In app settings, keep the help bubble enabled at
bottom-right(or choose a header corner). Publish. - Reload the app. The bubble appears; open it to see the content.
Gotchas¶
- The help bubble corner is
bottom-right,bottom-left,top-rightortop-left. A bottom corner toast is lifted clear of the bubble, but custom CSS variables that change sizes should be checked on a narrow screen. - Segments do not filter what the resource centre shows in the MVP.
- A section can belong to Help or Search only. Tasks is for checklists, which carry progress and goals.
- A checklist you add under Tasks shows even if its own page patterns do not match; the Tasks page pattern controls where it appears.
- A listed checklist that is not published is skipped by the player. The editor warns, and publishing the centre publishes it.
- The panel is 400 px wide and capped to the viewport width minus 32 px on narrow screens.