Jump Layers - and other layers that can jump - are crucial for canvas building. Let's take an in-depth look at configuring our Jump layers.
Jump layers, as the name implies, jump us from one screen to another. These will be one of the most common layers in your canvases- in fact, when you first upload your screens, you will notice that the system automatically puts a jump layer on each screen. We have several configurations you can use to get the most out of your system simulations, so let's jump in.
Jump to Layers
We kept the most important option first. In the jump to field, you will see a dropdown with each screen of the canvas. This allows you to select which screen should appear when a learner engages this jump layer.
By default when you upload your screens, each jump layer will be set to 'automatic jump' to the next screen in order. If you need to skip one or more screens, just change the selected screen on the dropdown.
Checkbox Options
These checkbox options relate to the behaviors of the screen we are jumping to next.
Scroll to Top after Jump- If the screen is a scrolling screen, this option would determine if the next screen will display at the top, or if the scrolling will stay as is. If we had scrolled 2/3 down a page then click the jump layer and we:
Check the "Scroll to Top" box, when we jump, the learner will be at the top of the screen.
Leave "Scroll to Top" unchecked, when we jump, the learner will still be 2/3 of the way down the page.
Automatic Link- The default is for a jump layer to go to the next screen in the canvas, so this box will be checked. This means that the screen will jump to whatever screen is next, even if you re-order your screens.
Caution - Unchecking the automatic link will mean that no matter what edits you make to the order of my screens, the jump layer will always jump to the screen you selected from the dropdown (and this option won't change unless you manually update it). Use this when you want to skip screens and land somewhere other than the next screen.
Highlight First Layer- Selecting this option will automatically put the cursor in the topmost typing-field (input, paragraph, typeahead, etc.) in your Layers list in the canvas. This feature will be off by default.
Tip - We recommend only using this setting when dealing with a keyboard-based or DOS system that does not allow a user to click on fields.
Adding Hotkeys to a Jump Layer
Many softwares have hotkeys enabled to speed up the process. For example, can you hit Enter or F2 to move forward in your software? Those are hotkeys! Bright can recreate these experiences for learners to build the best habits before ever touching the production instance of the software.
Before we talk about how to add in Hotkeys, we'd like to share a bit of background. Bright is web based, and there are certain hotkey combinations that can not be overwritten in a web browser. Some examples are: Control+N (opens a new window in your browser) and Control+S (saves the current page to your files). If your system uses one of these, we recommend omitting it on that particular jump, but you can still call it out in some help text.
Main Key - This is the section to use if you need to add a single key as a jump. Think Enter, F2 or even T. If the combination is a single key, the Combo Key field above Main Key will be left blank.
Combo Key - This is a secondary key required for some hotkey combinations, such as Shift + [key] or Control + [key]. In the example of Shift + P, Shift would be your combo key and P would be your main key.
Tip - If you ever have a system that requires a key combination to continue rather than a click, you can shrink the jump layer and move it off the right edge of the screen. As long as the hotkeys have been set up, the learner will jump when they use the key combination.
Using tab to quickly move through input fields in a system is common, but this is another default behavior in a web browser so you don't need to build that out as a Jump layer. Simply drag your layers into the order you want to tab through with the first layer being the top of the Layer list. By default, when you press your tab key, the cursor jumps to the next learner typing-field (input, paragraph, or typeahead).
Other Layer Types that Can Jump
There are two other layer types that can have a Jump added to them, if the learner enters or selects the correct answer.
Typeahead Layers
When using a Typeahead layer, you can set up a Jump to another screen based on whether the Learner selects a Correct Value. The learner would 1) begin typing, 2) select an Option from the menu that appears below the text input field, 3) [if a Jump is set up] select one of the Correct Values entered and then Jump to the screen set up.
Select One Layers
When using a Select One layer, you can set up a Jump to another screen based on whether the Learner selects the Correction option from a drop-down menu. The learner would 1) select the Correct Value (there can only be one) and then 2) [if a Jump is set up] Jump to the screen set up.
Help Functions for Jump Layers
Help functions are available for all layer types that require learner interaction (input, paragraph, date, select one, typeahead, toggle image, jump) and are designed to help give learners a clear path forward if they get stuck.
Help Text- Help text is what the learner will see if they click the blue "i" icon during the system simulation. If your Help Text is too vague, a learner can get stuck and frustrated without a clear path forward. Good Help Text might read: "Remember to click the client's name to open their account." Help text should always be included on each respective layer the learner needs to interact with.
Click Guide- These are the blinking red beacons that help a learner's attention be drawn to a specific field on the page. When you have this option turned on, you will also have the option to enter text; this text will be visible when the learner has their mouse hovering over the click guide. We recommend using these in moderation. Too many click guides (or using them on all of your system simulations), means that learners aren't tested on their ability to navigate without assistance before they begin their role.
Best Practices + Tips
- When building, always test your canvases on app.learnwithbright.com to see the learner experience and verify the jump is landing and behaving as you intended.
- Be sure to verify jumps if you clone or add screens. By default, if the automatic link is checked, the jump will automatically update where it jumps to when you change the order of screens (including cloning or adding screens).
- You can use multiple jump layers on one screen- maybe on a home page of your system, there is a toolbar at the top and another on the side. If clicking both places in your system gets the user to the same place, you can put 2 jump layers with the same setup (jump to, and checkbox options).
- Don't overdo it... while you can put 8 jumps on the same screen to go to any number of places within the software, all of your system simulation moments are most effective when they are built to practice a single workflow. That means if the learner needs to make a case and mark it as resolved, I do not need a jump on the escalation process.
- Keep Help Text vague. Rather than, "Click John's name to open his account" use, "Click the client's name to open their account." Using vague (but still specific) feedback helps when you will be cloning the canvas to make additional practices for your learners.