storyline 360
311 TopicsStoryline 360: Adding Alternative Text for Screen Readers
Storyline 360 supports alternative text (alt text) for slide objects so your courses are accessible to learners with screen readers and other assistive technologies. In this user guide, you'll learn best practices for writing alt text and three ways to add alt text in Storyline 360. Best Practices for Writing Alt Text Using the Media Library Using the Focus Order Window Using the Size and Position Window Best Practices for Writing Alt Text Non-text content needs alternative text (alt text) to describe its meaning to learners using assistive technologies. Add alt text to objects that convey meaning or context to the learner. Purely decorative images and shapes can be hidden from accessibility tools to prevent unnecessary announcements that can fatigue screen reader users. Our on-demand webinar, How to Write Alt Text for E-Learning, offers more specific strategies. The following tips for writing good alt text can help you get started: Be descriptive and specific. Clearly describe the content, function, and context of the image. You should have enough detail that someone who cannot see the image will still understand its purpose. Don’t include repeating phrases like "image of" and "graphic of.” Screen readers announce this by default. Keep it short. Aim for brief descriptions that convey the essential information. We recommend that alt text be less than 150 characters. Write clearly. Abbreviations and excessive punctuation marks may confuse screen readers, so use complete words and limit punctuation to guarantee clarity. For example, *** will be read literally as “asterisk, asterisk, asterisk.” Using the Media Library The media library makes it super easy to add alt text to all the images, characters, and videos in your project. Open the media library by going to the View tab on the Storyline ribbon and clicking Media Library. Select an image, character pose, or video in the asset grid on the left side of the window. Enter alt text in the details pane on the right, or click the Generate alt text button to let AI Assistant suggest alt text. Learn more about managing alt text in the media library. Using the Focus Order Window The Focus Order window lets you customize the order in which slide objects are navigated with a keyboard and read by a screen reader. You can also use the Focus Order window to manage alt text for all your slide objects. Here’s how: Open the slide you want to customize in Slide View. Go to the Home tab on the Storyline ribbon and click Focus Order. When the Focus Order window opens, enter text in the Alternative Text column. Click Save when you’re finished. Here are some tips for working with alt text on the Focus Order window: All objects for the slide will appear in the Focus Order window, including objects from layers and slide masters. Although slide master objects appear in the focus order window, you'll need to switch to Slide Master View (press F4) to set their alt text. Right-click each object on the slide master, click each object on the slide master and choose Accessibility. If a non-text object doesn’t have alt text, screen readers will read the name of that object as it appears in the timeline. The alt text for a text object defaults to the content within it. If you don’t want an object to be read by screen readers, select it in the list, then click the Remove button in the lower left corner of the window. (This doesn’t delete the object; it just hides it from screen readers.) If you’re using the modern player, you can add alt text to your course logo in your player settings. Learn more about using the Focus Order window. Using the Size and Position Window The Size and Position window lets you control an object’s height, width, rotation, scale, crop, and location. You can also use the Size and Position window to add alt text to the selected object. Right-click the object you want to edit, then choose Accessibility. Keep the Object is visible to accessibility tools box marked. Enter text in the Alternative text field, or click the Generate alt text button to let AI Assistant suggest alt text. Click Close when you're done. Here are some tips for working with alt text on the Size and Position window: When writing alt text, you’ll see a dynamic character count and a tip not to exceed 150 characters. (While there isn't a character limit for alt text, it's best practice to keep it concise.) If the visibility box is checked for a non-text object without alt text, screen readers will read the name of that object as it appears in the timeline. If the visibility box is checked for a text object, screen readers will read the content within that text object. If you’d prefer to hide the selected object from screen readers altogether, uncheck the visibility box. If you’re using the modern player, you can add alt text to your course logo in your player settings. Learn more about using the Size and Position window.2.8KViews1like0CommentsStoryline 360: Changing the Browser Settings and Player Size
Want your published course to open in a new browser window when learners view it? Storyline 360 has an option for that. You can even choose how the new window looks and behaves on desktop computers. Go to the Home tab on the ribbon and click Player. When the player properties appear, click Other on the ribbon. Then, customize the browser settings as described below. Launching Your Course in a New Window Choosing the Player Size Calculating the Dimensions of Your Published Course Saving Player Changes Launching the Course in a New Window You can launch your course in a new browser window or a new browser tab on mobile devices. This might be necessary if your course has exit triggers. Modern web browsers have security restrictions that prevent windows or tabs from closing themselves unless they were opened from another page. (Note that many LMSs automatically open courses in new windows, so you might not need to use this Storyline 360 option.) In your player properties, mark the box to Launch player in new window (creates launch page). This adds a launcher.html file to your published output. Give learners a link to the launcher.html file rather than the default story.html file. When you launch a course in a new browser window, you also get to decide how the new window behaves on desktop computers. Choose from the following options. These options don’t apply to tablets and smartphones. Display window with no browser controls: Mark this box to display the new window without any browser controls. It'll have an address bar, but it won’t be editable. Uncheck this box to give the new browser window the same controls as the parent window. Allow learners to resize browser: Mark this box to let learners resize the browser window as they choose. Uncheck it to lock the browser at the slide size to fit your course. Browser Size: Choose to open the new browser window at slide size or let it fill the screen on desktop computers. On mobile devices, the browser always fills the screen. Choosing the Player Size If you're using the modern player style, select one of these options from the Player size drop-down list. Scale player to fill browser: This is the default option. It scales your published course to fill the learner’s browser, leaving no white space around the player. Lock player size: This locks the published course at the slide size plus additional width and height for the player frame and features (reference the table below). Even if learners resize their browsers, the course stays at the slide size. Lock player size to fit browser: This scales your published course to fit within the learner’s browser while maintaining the modern player’s aspect ratio. This results in some white space around the player. If you’re using the classic player style, select one of these options from the Player size drop-down list. Lock player size: This locks the published course at the slide size plus additional width and height for the player frame and features (reference the table below). Even if learners resize their browsers, the course stays at the slide size. Lock player size to fit browser: This scales your published course to fit within the learner’s browser while maintaining the classic player’s aspect ratio. This results in some white space around the player. Calculating the Dimensions of Your Published Course The overall size of your published course is slightly bigger than your slide dimensions. The player adds up to 260 pixels to the width and up to 118 pixels to the height, depending on the player features you selected. Refer to the table below for details. For the modern player, features have the pixel sizes below when the browser is set to optimal size. These dimensions can change as the modern player responds to different browser sizes. Player Feature Width Height Player frame* +20 pixels +20 pixels Title +23 pixels One or more topbar tabs +24 pixels Volume controller, closed captioning button, play/pause button, seekbar, or navigation buttons +51 pixels Sidebar +240 pixels Tips: You can turn player features on and off on a slide-by-slide basis, but each player feature adds width or height to your entire course, even if it’s only used on a single slide. The modern player with menus and controls turned off won’t add any width or height to your course. Here’s an example: Let’s say your slide size is 720 x 405, and you enable the navigation buttons and sidebar. The overall dimensions of your published course are 980 x 476. This is also known as the optimal size of your course. Here’s the breakdown: Width Height Slide size 720 pixels 405 pixels Player frame +20 pixels +20 pixels Navigation buttons +51 pixels Sidebar +240 pixels Published Course Dimensions 980 pixels 476 pixels Saving Player Changes When you click OK to close the Player Properties window, Storyline 360 saves your changes in the current project file. If you'd like to use the same customizations in other projects, click Current Player on the ribbon and choose Save. Enter a name for your custom player if you're prompted and click OK. Learn more about the Current Player options. You Might Also Want to Explore: Interactive Demo: Which classic player features are supported on tablets and smartphones?1.2KViews0likes0CommentsStoryline 360: Choosing a Player Style (Modern or Classic)
The player is the frame around your slide content that holds navigation features, such as the menu and seekbar. In Storyline 360, you can choose the classic or modern player. Here's how. Switching Between the Modern and Classic Player Styles Comparing the Modern and Classic Player Styles Switching Between the Modern and Classic Player Styles You can switch between the modern and classic players. Go to the Home tab on the ribbon, click Player, then choose a style from the Player Style drop-down list. New projects automatically use the modern player, but you can switch to the classic player. Projects created before the modern player was introduced will continue to use the classic player, but you can switch to the modern player at any time. Comparing the Modern and Classic Player Styles We’ll explore the modern and classic player styles below, and this article provides more details. How Modern and Classic Players Look The modern player gives desktop and mobile learners a unified experience that’s consistent across all devices, while the classic player looks different on desktop computers and mobile devices. The modern player also makes customizing colors easy. Select a built-in theme or create your own theme, then choose an accent color from the color selector. The classic player requires more effort for color customization. How They Behave on Mobile Devices and Desktop Computers Both player styles are responsive on tablets and smartphones, giving learners the best viewing experience on every screen size and orientation. The sidebar collapses, browser chrome is eliminated, and player controls are mobile-friendly. This gives your slide content more room to shine. On desktop computers, the modern player scales smoothly to completely fill learners’ browsers by default, while the classic player doesn’t. Both player styles have the option to lock the player size or let it adjust to learners' browsers. How the Player Features Work The modern player style boasts more exclusive player features, as described below. Modern Player Classic Player Enable or disable the play/pause button and seekbar independently. Enable or disable the play/pause button and seekbar as a single unit. Make the seekbar conditional so learners can't skip ahead until they've completed each slide. The classic player doesn't have a conditional seekbar. The seekbar appears across the bottom of the screen on all devices and orientations except smartphones in landscape mode. On smartphones in landscape mode, the seekbar is a circular indicator that travels around the play/pause button. When a slide is paused or it finishes playing, the seekbar changes to a line across the bottom of the screen. The seekbar appears across the bottom of the screen on desktop computers and tablets/smartphones in portrait mode. The seekbar is a circular indicator that travels around the play/pause button on tablets and smartphones in landscape mode. The logo appears on desktop computers and tablet devices. Due to limited screen real estate, it doesn't show on smartphones. You can add alt text to your logo so it's accessible to screen readers and other assistive technologies. The logo appears on desktop computers but not tablets or smartphones. The classic player doesn't support logo alt text. You can choose to collapse the sidebar by default, allowing learners to expand it when they need it. On small screens, the sidebar automatically collapses to give your content more room. The sidebar is always expanded on desktop and laptop computers. It’s always collapsed on mobile devices. Topbar tabs are always on the side of the player opposite the sidebar. If your sidebar is on the left, your topbar tabs are on the right. And if your sidebar is on the right, your topbar tabs move to the left. On small screens where there isn’t enough room to display topbar tabs, they’ll collapse into a drop-down menu represented by three dots. To see your topbar tabs, click the dots. You can have topbar tabs on both the right and left sides of the player. On tablets and smartphones, topbar tabs automatically collapse into the responsive mobile player. To see your topbar tabs, just click the menu icon (☰). Quickly turn off all modern player features for a chromeless look by flipping a switch. Turning off all player features for a chromeless design takes more work than the modern player. Details here. Choose a style for navigation buttons. Previous, next, and submit buttons can be icons, text, or both icons and text. Due to limited space on smartphones, they’ll always be icons On desktop and laptop computers, navigation buttons are always text. On tablets and smartphones, they’re always icons. By default, the modern player scales smoothly to completely fill learners’ browsers on every device and screen size. You also have the option to lock the player size or let it adjust to learners' browsers. Details here. Plus, you can add a player toggle to let learners view courses in full-screen mode. You can only lock the player size or let it adjust to learners’ browsers. Details here. Let learners explore at their own pace by choosing a course playback speed between 0.25x and 2x. The classic player doesn't support speed control. The light and dark themes of the modern player meet and exceed WCAG Level AA guidelines for visual contrast and color by default. Details here. Or, you can define a custom background and accent color instead. You can make the classic player meet contrast guidelines by manually customizing the colors of each player component. Choose colors with a contrast ratio of 4.5:1 or higher. Customize your course start page with an image. The classic player doesn’t support cover photos. However, the course start page matches the top and bottom colors you set for Base>Main Background. Increase or decrease the font size for closed captions and player features independently. You can also choose the foreground and background colors and placement of your captions. Increase or decrease the font size for closed captions and player features as a single unit. Choose two colors—one light and one dark—for the accessibility focus indicator so it's visible against any background. Choose a single color for the focus rectangle. If your course has background audio, learners can turn it on or off via the accessibility controls. The classic player supports accessibility controls. However, it doesn't support background audio. All modern player features are supported on desktop computers and mobile devices. All classic player features are supported on desktop computers, and most are supported on mobile devices.1.1KViews1like0CommentsStoryline 360: Working with the Player
In Storyline, the term “player” refers to the frame around your slide content. It holds navigation features, including the menu, seekbar, previous and next buttons, and more. You get to choose which navigation features are added to your player, and you can customize the colors, fonts, and text labels. You can even turn off the player for a chromeless design when you want to use your own navigation buttons. Learn how to customize your player below. Modern and Classic Styles Exclusively in Storyline 360, you can choose the modern or the classic player. The table below gives a brief comparison of the two styles, and this article provides more details. Modern Player Classic Player The modern player gives desktop and mobile learners a fresh, unified experience that’s consistent across all devices. The classic player looks different on desktop computers and mobile devices. By default, the modern player scales smoothly to completely fill learners’ browsers on every device and screen size. You also have the option to lock the player size or let it adjust to learners' browsers. Details here. Plus, you can add a player toggle to let learners view courses in full-screen mode. You can only lock the player size or let it adjust to learners’ browsers. Details here. All modern player features are supported on desktop computers and mobile devices. All classic player features are supported on desktop computers, and most are supported on mobile devices. See this interactive demo to know which classic player features work on tablets and smartphones. How-To User Guides To customize your player, go to the Home tab on the ribbon and click Player. Explore the following user guides to learn how to edit each component of the player. Choosing Player Features Customizing the Menu Attaching Resources Adding a Glossary Choosing a Player Style (Modern or Classic) Hiding the Player Frame for a Chromeless Design Changing the Player Colors, Font, and Font Size Customizing the Text Labels Changing the Browser Settings and Player Size Changing the Resume Behavior Enabling Right-to-Left Language Support Customizing Accessible Player Settings Saving and Switching Players Restricting Which Mobile Device Orientations Learners Can Use7.7KViews0likes0CommentsStoryline 360: Text Box Formatting
This user guide covers the text box options on the Format Shape/Format Picture window. (Visit this user guide for ways to access the formatting window.) Text box options are only available for text boxes, shapes, and captions. They're grayed out for other objects (pictures, screenshots, and characters). Use these options to format text boxes: Vertical Alignment Text Direction Margins Autofit Overflow Handling Text Entry Vertical Alignment This drop-down lets you control how high or low the text sits in an object. Text Direction This drop-down lets you control the rotation of the text in an object. Margins These settings let you control the margins (padding) for text boxes, shapes, and captions. Enter values in pixels or use the arrows to adjust the values. Autofit The autofit property controls what happens when text is too big to fit within the text box, shape, or caption. You'll see different autofit options, depending on whether you've enabled text autofit improvements or not. Find definitions for old and new autofit options below. If you haven't enabled text autofit improvements (they're disabled by default), you'll see the following autofit options: Do not autofit This option allows text to overflow its bounding box. If your text overflows its bounding box, learners will see a scroll bar in the published output when they turn on accessible text. Shrink text on overflow This shrinks text so it fits within its bounding box. This setting can result in small text that's hard to read, especially when the text box includes variable references. To create courses that are accessible to people with low vision, you should avoid shrinking text. Resize shape to fit text This increases or decreases the height of the text box to fit your text. Wrap text When you enable this option, text wraps within the text box, shape, or caption. Upgrade Project Text Click this button to use enhanced text autofit settings and improve accessibility. Text autofit improvements can't be turned off once enabled. However, you can import slides into a new project file to revert to legacy autofit settings if you prefer. Learn more about upgrading text. If you have enabled text autofit improvements by upgrading your project text (in the May 2021 update or later), you'll see the following autofit options: Expand width This turns off text wrapping and allows the text box’s width to expand to accommodate text. Expand height This enables text wrapping and allows the text box’s height to expand to accommodate text. (The width of the text box is fixed.) Fixed size This locks a text box at a fixed size. When locked, you can add a scroll bar to text that doesn't fit or let it overflow, as described below. Overflow Handling Starting with the August 2021 update, the following overflow options are available for fixed-size objects in projects that use text autofit improvements: Add scroll bars This adds a scroll bar to text that doesn’t fit its bounding box. We recommend enabling scroll bars to give all learners a better experience when they use accessible text. Allow text to overflow This lets text display past its bounding box. To preserve legacy autofit behavior, this is the default for fixed-size objects when upgrading project text. Text Entry Optional "multi-line" and “character limit” check boxes display for text-entry fields in new and existing projects, regardless of whether you've enabled text autofit improvements. These settings control what happens to entered text that doesn't fit its bounding box. Multi-line Mark this box to let learners’ input wrap to multiple lines. Character limit Mark this box to enable a character limit on learners’ input. Enter the limit value or use the arrows to adjust it. Note that the character limit you set will apply when you open that project file in the March 2025 update and earlier. To remove the limit, recreate the text-entry field.1.5KViews0likes0CommentsStoryline 360: Working with Data-Entry Fields
Data-entry fields let you collect information from learners, which is stored in variables, can be adjusted with triggers, and displayed on any slide or layer in your course using references. Adding Data-Entry Fields Renaming Data-Entry Fields Renaming Data-Entry Variables Formatting Data-Entry Fields Formatting Data-Entry Text Using Data-Entry Fields to Trigger Actions and Perform Calculations Converting to Freeform Text-Entry Questions Using Variable References to Display Learners' Input Deleting Data-Entry Fields Adding Data-Entry Fields Go to the Insert tab on the ribbon and click Input. Choose either Text-Entry Field or Numeric-Entry Field. Text-entry fields accept alphanumeric characters. You can also set limits on how many characters a learner can enter. Numeric-entry fields accept numbers, decimals, and hyphens (for negative numbers). Use numeric-entry fields when you want to perform calculations. Draw your data-entry field on the slide or layer. Customize the instruction text in the field. When you add a data-entry field, Storyline 360 automatically creates a variable to hold the data and a trigger to set the value of the variable to whatever the learner types in the field. See this in action here. Renaming Data-Entry Fields Storyline 360 gives each data-entry field a default name, either Text Entry or Numeric Entry. We recommend giving them more intuitive names, so they're recognizable when adding triggers and creating freeform interactions. One way to rename a data-entry field is to right-click it, select Rename, enter a new name, and click OK. Another way is to double-click the data-entry field in the timeline to open it for editing, enter a new name, and press Enter on your keyboard. Renaming Data-Entry Variables It's also helpful to rename the variable that's tied to each data-entry field. Here's how: Click the Manage project variables icon in the Triggers panel. Double-click the variable you want to rename. Enter a new name and click OK. Formatting Data-Entry Fields To change the style, colors, and effects for a data-entry field, select the field you want to edit, go to the Format tab on the ribbon, and use the formatting options. The colors available on the Format tab come from your theme colors. Formatting Data-Entry Text You can format the instruction text in a data-entry field and the text that learners enter. Just select the field and use the font and paragraph options on the Home tab. Data-entry fields support these formatting options: Instruction Text Learners’ Input Font Font Size Font Color Bold Italics Horizontal Alignment Font Font Size Font Color Bold Italics Horizontal Alignment Using Data-Entry Fields to Trigger Actions and Perform Calculations Since the data that learners enter is stored in variables, you can use triggers and conditions to perform actions based on that data. If you're using a numeric-entry field, you can even perform calculations on learners input using Adjust variable triggers with mathematical operators. See this user guide to learn more about triggers and conditions. Converting to Freeform Text-Entry Questions You can convert a data-entry field into a freeform text-entry question if you want to track learners’ input in a quiz or survey. See this user guide for details. Tip: Only one data-entry field on a slide can be evaluated as part of a freeform text-entry question. Using Variable References to Display Learners' Input Since data-entry fields store learners' input in variables, you can display the values of those variables anywhere in your course using variable references. For example, you might use a text-entry field to ask learners for their names at the beginning of a course. Then you can personalize content with their names throughout the rest of the course. Just add a variable reference to any text box, caption, shape, or button. Deleting Data-Entry Fields To delete a data-entry field, select it and click Delete on your keyboard. When you delete a data-entry field, its corresponding variable and trigger will also be deleted.3.8KViews0likes0CommentsStoryline 360: Text-Entry Questions
Use Storyline 360's freeform text-entry question to create your own fill-in-the-blank assessments. Tip: You can add multiple text-entry fields to a single slide, but only one can be evaluated in an assessment. If you need to evaluate more than one text-entry field on the same slide, consider this method instead. Insert a Freeform Text-Entry Question Define Acceptable Answers Choose How the Question Will Be Submitted Customize the Question Properties Step 1: Insert a Freeform Text-Entry Question There are two ways to create a text-entry question. If you've already added a data-entry field to an existing slide, you can convert it to a freeform question. If you'd prefer to start from scratch, do this: First, do any of the following: Go to the Home tab on the ribbon, click New Slide, and choose Freeform Question. Go to the Slides tab on the ribbon and click Freeform Question. In Story View, right-click anywhere in the workspace, scroll to New Slide, and choose Freeform Question. In Slide View or Form View, right-click anywhere in the Scenes panel, scroll to New Slide, and choose Freeform Question. When the Insert Slide window appears, use the search field at the top and the filters along the left edge to locate the type of question you want to add. The slide browser includes built-in templates as well as professionally-designed Content Library 360 templates. When you click a thumbnail image for a slide, the right side of the window shows a description of that question type. Click Insert Slide to add it to your project. A new text-entry question will open in Slide View and a text-entry field will automatically be added for you. Switch to Form View and proceed to the next step to define acceptable answers. Step 2: Define Acceptable Answers By default, text-entry questions are graded assessments. To define acceptable answers, switch to Form View and type the answers in the answer grid. If the answers are case-sensitive, mark the Answers are case sensitive box above the grid. If your question doesn't have correct and incorrect responses (i.e., it's a survey question), go to the Question tab on the ribbon and select None from the Score drop-down to make it ungraded. (The answer grid will disappear.) Tips: One way to guide learners toward focused responses is to set character limits on text-entry fields. If you convert an existing slide with data-entry fields into a freeform text-entry question, use the Field to evaluate drop-down to identify the field you want to evaluate. Only one field per slide can be evaluated. Step 3: Choose How the Question Will Be Submitted Learners can click the built-in Submit button on your course player to submit their text-entry responses for evaluation. However, if you're not using the built-in Submit button or you want to provide another way to submit responses, do one or both of the following: Use your own custom submit button If you've added your own custom button or hotspot to the slide that you'd like to use as the submission method, select it from the Submit Button drop-down. Assign submit keys You can assign a keystroke or combination of keystrokes to submit the learner's answer for evaluation. Just click in the Submit Keys field and press the key or combination of keys you want to use. If you change your mind, you can either press the correct key(s), which will update the Submit Keys field, or click the X button to clear the field altogether. Tip: The Enter key always submits a text-entry field for evaluation, so you don't need to define it here. Step 4: Customize the Question Properties After creating a freeform text-entry question, you can customize several of its attributes, including feedback, branching, score, number of attempts, and whether learners are required to answer it or allowed to skip it. To learn how, see Working with the Question Editor. Can I Convert a Freeform Question into a Non-Question Slide? Yes. Go to the Insert tab on the ribbon and click Remove Freeform. When you remove freeform functionality from a question, it becomes a standard content slide. Text and other objects remain intact. Only question-related properties, such as score and feedback, are removed.3KViews1like0CommentsStoryline 360: Using Keyboard Shortcuts
Here’s a list of keyboard shortcuts to help you work even faster in Articulate Storyline 360: Key(s) Function Esc Close a window F1 Help F2 In Slide View, F2 selects all text within a shape after clicking its bounding box. In Story View, F2 selects the slide or scene title after clicking its slide thumbnail or scene panel, respectively, so you can rename it. If editing a 360° image, F2 opens the selected marker or hotspot on the Markers & Hotspots panel so you can rename it. F3 Switch to Slide View F4 Switch to Slide Master View F5 Switch to Feedback Master View F7 Spell check F10 Publish F12 Preview the entire project During preview, F12 launches the built-in console. Shift+F9 Show or hide gridlines Shift+F12 Preview the current scene Alt+F12 Preview an interaction in the 360° image editor Shift+Drag If moving an object, movement is constrained to straight lines. If resizing an object, size maintains aspect ratio. Alt+Drag Move or resize an object with tighter control in one-pixel increments Ctrl+Alt+V Open the Paste Special window (after copying an object) Ctrl+Drag If moving an object, a copy of the object will be created in the new location. If resizing an object, it will be proportionally resized from opposite directions simultaneously. Ctrl+Shift+Drag Duplicate the selected object and move it in straight horizontal or vertical lines Ctrl+A Select all Ctrl+B Bold Ctrl+C Copy Ctrl+D Duplicate Ctrl+E Center align text Ctrl+F Find Ctrl+G Group the selected objects Ctrl+H Show objects on the slide stage when they intersect with the playhead Ctrl+I Italicize Ctrl+J Insert a picture Ctrl+K Insert a hyperlink or trigger Ctrl+L Left align text Ctrl+M Insert a new slide with the same layout as the current slide Ctrl+N Create a new project Ctrl+O Open an existing project Ctrl+P Publish the project as a Microsoft Word document Ctrl+Q Insert a new question slide Ctrl+R Right align text Ctrl+S Save the project Ctrl+T Insert a text box Ctrl+U Underline Ctrl+V Paste Ctrl+W Close the active tab in Slide View If editing a 360° image, Ctrl+W saves changes before closing the editor. Ctrl+X Cut You can also press the Backspace/Delete key on your keyboard to cut objects. Ctrl+Y Redo Ctrl+Z Undo Ctrl+Tab Cycle through Story View and Slide View tabs Ctrl+F12 Preview the current slide Ctrl+Shift+F12 Preview the selected scenes or slides Ctrl+Shift+C Copy object formatting Ctrl+Shift+D Paste object in the same place as the original object Ctrl+Shift+G Ungroup the selected objects Ctrl+Shift+M Insert a Content Library 360 slide template Ctrl+Shift+J Launch the Content Library 360 media browser Ctrl+Shift+S If editing a 360° image, save changes and return to Slide View. Ctrl+Shift+V Paste object formatting Ctrl+Enter Open the Format Shape/Format Picture window Ctrl+Shift+Enter Open the Size and Position window Ctrl+Mouse Wheel Zoom in or out Ctrl+Arrow This moves the selected object. If the snap-to-grid feature is turned off (the default setting), then Ctrl+Arrow nudges the object by the number of pixels in your grid settings. The default is 8 px. If the snap-to-grid feature is turned on, then Ctrl+Arrow nudges the object 1 px at a time. Ctrl+Shift+Arrow This resizes the selected object. If the snap-to-grid feature is turned off (the default setting), then Ctrl+Shift+Arrow adjusts the width or height of the object by the number of pixels in your grid settings. The default is 8 px. If the snap-to-grid feature is turned on, then Ctrl+Shift+Arrow adjusts the width or height of the object 1 px at a time. Ctrl+= Change the selected text to subscript Ctrl+Shift+= Change the selected text to superscript Ctrl+Shift+> Increase the font size Ctrl+Shift+< Decrease the font size C Add a cue point to the timeline at the current playhead position while playing the slide Spacebar Play/pause the timeline Keyboard Shortcuts for Ribbon Commands Press the Alt key to access commands on the Storyline 360 ribbon. Then press the letter for the corresponding tab on the ribbon. Finally, press the letter for the command you want to execute. For example, press Alt, N, V to insert a video. Creating Your Own Keyboard Shortcuts Create your own keyboard shortcuts by adding features you use frequently to the Quick Access Toolbar. Just right-click the button for any Storyline 360 feature, then select Add to Quick Access Toolbar. To execute the buttons on the Quick Access Toolbar via a keyboard shortcut, press the Alt key on your keyboard, and then press the number key that matches the button you want to launch. For example, the first button on the Quick Access Toolbar is "1," the second button is "2," etc.5.2KViews0likes0CommentsStoryline 360: Choosing Player Colors, Fonts, and Button Styles
Personalize the player frame around your slide content with colors and fonts that complement your course design or match your brand. And if you’re using the modern player, you can also choose a button style—icons, text, or both icons and text. Choose Colors, Fonts, and Button Styles for the Modern Player Choose Colors and Fonts for the Classic Player Choose Colors, Fonts, and Button Styles for the Modern Player Here’s how to customize colors, fonts, and button styles for the modern player. Go to the Home tab on the ribbon and click Player. When the player properties appear, make sure the Player Style is set to Modern. (Learn more about choosing a player style.) Click Colors & Effects on the ribbon, then choose your colors, fonts, and button styles. Customize Player Features Select a built-in player theme or create your own player theme. The neutral tones of the dark and light themes allow your content to be the focus of learners’ attention, while the player performs a supporting role in the background. When the “Lock player size” or “Lock player size to fit browser” option is enabled, you can choose a page background color from the color selector. The page background color appears behind your published course, and learners may see it around the outside of your player frame. Choose an accent color from the color selector (the default accent color choices come from your theme colors). The accent color is used throughout the modern player to tie it all together. For example, the accent color highlights the current slide in the menu, identifies the selected tab in the sidebar, and shows the progress of the seekbar. Set two accessibility focus colors—one light and one dark—so the focus indicator is visible on any background. The accessibility focus rectangle lets sighted keyboard-only users see which object is currently selected. Choose a player font and font size for the text that appears throughout the player, including the course title, the menu, and navigation buttons. The size percentage defaults to 100%, but you can choose any percentage between 75% and 200%. If your course has video transcripts, the font and font size you select for all player elements also applies to transcript text. By default, navigation buttons display both icons and text—i.e., arrows and text for previous and next buttons as well as text and check marks for submit buttons. You can switch to just icons or text instead. (Navigation buttons will always be icons on smartphones due to the limited screen space.) Tip: To customize the text for navigation buttons, edit the text labels in your player properties. Customize Closed Captions Change the foreground and background colors of your closed captions. Choose a captions font and font size. The size percentage defaults to 100%, but you can choose any percentage between 75% and 200%. Position captions at the bottom or top of the slide. Choose Colors and Fonts for the Classic Player Note: Classic player colors and fonts only work on desktop and laptop computers—except the captions font, which works on all devices, including tablets and smartphones. Explore this interactive demo to know which classic player properties work on mobile devices. Here’s how to customize colors and fonts for the classic player. Go to the Home tab on the ribbon and click Player. When the player properties appear, make sure the Player Style is set to Classic. (Learn more about choosing a player style.) Click Colors & Effects on the ribbon, then choose your colors and fonts. Choose a Color Scheme Choose a built-in color scheme or a custom color scheme that you previously created from the Color scheme drop-down list. The preview pane on the right side of the window will automatically update so you can see how your color scheme looks. Create a Custom Color Scheme Here’s how to create a custom color scheme. Click Show advanced color editing to reveal additional color options. Choose the portion of the player you want to customize from the Edit item drop-down list. (Download this job aid to identify which player colors affect each player element.) Use the color selector to choose a new color. (If you see top and bottom colors, it means the item is a gradient composed of two colors.) To apply transparency to the item you're modifying, enter a percentage in the Transparency field. (Transparency isn’t available for all items.) Repeat steps 2-4 for each player element you want to customize. If you change your mind and want to undo the edits you made, click the Reset button (it looks like a window icon with a backward-pointing arrow). Save a Custom Color Scheme to Reuse It in Other Projects By default, a custom color scheme is only stored in the project file you’re currently working on. If you want to reuse a custom color scheme in other Storyline projects, just click the Save button, give your color scheme a name, and click OK. When you save a custom color scheme, it appears in the Color scheme drop-down list so you can apply it to any Storyline course you create. A saved color scheme is stored in the current project file and in the following directory on your computer: %AppData%\Articulate\Storyline\360\Frames\StoryFrame\ColorSchemes Delete a Custom Color Scheme To remove a custom color scheme, select it from the Color scheme drop-down, then click the Delete button. (Built-in color schemes can’t be deleted.) The deleted scheme will no longer appear in your color choices. However, if you delete a color scheme that's applied to another course, it won't be removed from that course; it'll just be stored in that particular project file. Choose a Page Background Color The page background color appears behind your published course. Learners may see this color around the outside of your player frame. And if you made the base of your player transparent, the page background color will show through the player. Use the Page background selector to choose a color. The color palette comes from your theme colors. If you don't see the color you want, click More Colors to enter a custom color value. Select Your Fonts and Set the Font Size Choose a Player font for the text that appears throughout the player, including the course title, the menu, and navigation buttons. If your course has closed captions, you can also choose a Captions font. And you can increase or decrease the font size for all player elements and closed captions as a single unit by adjusting the Player font size percentage. It defaults to 100%, but you can choose any percentage between 75% and 200%.1.6KViews0likes0CommentsStoryline 360: Creating and Editing Closed Captions With the Built-in Editor
Create and edit closed captions and subtitles right in Storyline 360 with the built-in editor. Fine-tune imported captions or quickly add new ones with the help of caption placeholders that are already synced with your audio and video content. And here's a bonus! Storyline 360 automatically generates synchronized video transcripts from closed captions. Opening the Closed Captions Editor Exploring the Editor Understanding Caption States Previewing Media and Captions Tabbing Back and Forth Between Caption Placeholders Adding or Editing Text in Caption Placeholders Speeding Up Your Workflow for Adding Closed Captions Formatting Caption Text Using Keyboard Shortcuts Adjusting the Timing and Duration of Caption Placeholders Inserting New Caption Placeholders Deleting Captions Splitting Captions Importing Captions Exporting Captions Translating Captions Closing the Editor and Saving or Discarding Your Changes Showing or Hiding the Closed Captioning Button on the Player Using Triggers to Turn Closed Captions On and Off Opening the Closed Captions Editor Use any of the following methods to open the closed captions editor: Select your media, go to the Options tab on the ribbon, then click Add Captions or Edit Captions. The button will change depending on whether your media clip already has captions. Right-click your media and choose Add Captions or Edit Captions from the context menu. Right-click your media, select Accessibility from the context menu, then click Add Captions or Edit Captions in the window that appears. Follow these steps to open the closed captions editor from the media library. Caption Placeholders Are Created for You If your media clip doesn’t already have captions, the closed captions editor will automatically analyze the audio track to detect units of speech and add caption placeholders to the timeline that are synchronized with your content. All you need to do is type your captions in the placeholders. Background music can interfere with the auto-generated caption placeholders, so you might need to tweak the timing of captions, add more caption placeholders, or split captions into smaller chunks. Note: The closed captions editor works with all narration and videos, except website videos. Exploring the Editor Explore this image of the closed captions editor and the numbered list below it for an overview of the interface. The sections that follow provide details on each feature. # Feature Description 1 Ribbon Commands Use the ribbon to: Preview your media and captions Jump back and forth between caption placeholders Insert new caption placeholders Delete caption placeholders Split caption placeholders Import captions Export captions 2 Video Stage When you’re working with a video, it'll display on the video stage. When you’re working with an audio clip, the video stage disappears and the audio waveform fills the editor. 3 Closed Captions Preview As you type captions into the placeholders at the bottom of the editor, they’ll display on the video stage or audio waveform so you can see how they’ll look in your published output. 4 Timeline and Playhead The timeline shows the duration of your media, and the blue playhead travels along the timeline as you preview your video and audio content. 5 Audio Waveform The audio waveform is a visual representation of the audio track in your media. If there’s no video component for your media, the audio waveform will expand to fill the stage. 6 Caption Placeholders Caption placeholders are where you type and format text. You can also adjust the timing and duration of caption placeholders. If your media clip doesn’t already have captions, the closed captions editor will automatically analyze the audio track to detect units of speech and add caption placeholders to the timeline that are synchronized with your content. All you need to do is type your captions in the placeholders. Caption placeholders have four states, so you know what to expect when creating and editing captions. See the next section to learn about caption states. 7 Time Values The status bar shows you the current position of the playhead on the timeline, the start time of the selected caption placeholder, and the end time of the selected caption placeholder. 8 Zoom Slider Use the zoom slider in the lower right corner to zoom the timeline, audio waveform, and caption placeholders in and out when you need to make precise edits or get a big-picture overview. Understanding Caption States Caption placeholders have four states as described in this table. State Appearance Example Unselected caption placeholder without text Solid light gray Unselected caption placeholder with text Dark gray with white text Selected caption placeholder (with or without text) Blue with white text Caption placeholder in edit mode Dark gray with blue outline, white text, and blinking cursor The closed captions editor may behave differently, depending on the current state of a caption. See the following sections for details. For example, if no captions are in edit mode when you preview, playback will continue to the end of the timeline unless you pause it. However, if a caption is in edit mode when you preview, playback will stop at the end of the caption placeholder. And if you resume playback while the caption is still in edit mode, it'll start from the beginning of the current caption placeholder and stop again at the end. This helps you create captions one at a time, letting you hear a clip as many times as you need while typing. Previewing Media and Captions To preview the entire video or audio track, move the playhead to the beginning of the timeline—before the first caption placeholder—then click the Play button on the ribbon or press Enter on your keyboard. Drag the seekbar on the ribbon or the playhead on the timeline to scrub back and forth through the video or audio track. To preview just one caption, click inside the placeholder so it’s in edit mode. Playback will start as soon as you click inside it and stop when it reaches the end of the caption. To pause the preview, click the Pause button on the ribbon or press Enter. Caption placeholders that have text will display on the video stage or audio waveform during preview. (The size of a caption box and the point at which text wraps could change, depending on the size of the Closed Captions Editor window.) Tabbing Back and Forth Between Caption Placeholders Press the Tab key on your keyboard to jump to the beginning of the next caption, and press Shift+Tab to jump to the beginning of the previous caption. Or, click the left and right arrows on the ribbon to move back and forth between captions. If no captions are in edit mode when you navigate between them, the playhead will simply move to the previous or next caption, but the media won’t start playing until you tell it to. If a caption placeholder is in edit mode when you jump to another caption, the new caption placeholder will also switch to edit mode so you can immediately start typing. Tip: By using the Tab key to move through caption placeholders in edit mode and pressing Enter to play/pause media, you never have to take your hands off the keyboard while typing captions, speeding up your workflow. Adding or Editing Text in Caption Placeholders To add or edit caption text, simply click inside a caption placeholder and begin typing. You can also paste text from external sources, such as text files or Word documents. When you click inside a caption placeholder, it switches to edit mode and your media automatically begins playing. If you need to pause it, just press Enter. To resume playback, press Enter again. If you need to add a line break to a caption, press Shift+Enter. Speeding Up Your Workflow for Adding Closed Captions By using keyboard shortcuts, you can quickly add closed captions to a video or audio track in Storyline 360. Here’s how: When you open the closed captions editor, the playhead will be positioned at the beginning of the first caption placeholder, and it'll be in edit mode. Press Enter to start playing your video or audio track, then begin typing text for the first caption based on what you hear. Playback will stop at the end of the placeholder so you have time to finish typing the caption. If you need to hear it again, just press Enter and it'll start over from the beginning of the placeholder. You can also use Enter to pause playback. Press Tab to move to the next caption placeholder. It'll switch to edit mode, and your media will being playing. Simply type what you hear. Playback will stop at the end of the placeholder so you have time to finish typing the caption. If you need to hear it again, just press Enter and it'll start over from the beginning of the placeholder. You can also use Enter to pause playback. Repeat step 2 to add captions, one placeholder at a time, until you reach the end of the timeline. Formatting Caption Text Bold, Italic, and Underline: Closed captions in Storyline 360 can have bold, italic, and underline formatting. Just select the text you want to format, then use the floating toolbar to make your selections. Or, use these keyboard shortcuts: Ctrl+B = Bold Ctrl+I = Italicize Ctrl+U = Underline Colors, Font, Font Size, and Position: You can choose the foreground and background colors, font, size, and position of your captions in the player properties. Learn more. Voice Tags: The closed captions editor doesn’t support voice tags, but you can identify speakers by typing their names with colons before their statements. (Press Shift+Enter to add a line break between speakers.) For example: Adam: E-learning is powerful. Lucy: And it’s transforming lives every day. If you import a caption file that has voice tags, the tags will be converted to the speakers’ names followed by colons, as shown above. Using Keyboard Shortcuts Work faster in the closed captions editor with these keyboard shortcuts. Key(s) Function Enter Play and pause media Shift+Enter Add a line break when typing text into a caption placeholder Tab Jump to the beginning of the next caption placeholder Shift+Tab Jump to the beginning of the previous caption placeholder Esc Exit edit mode for the current caption placeholder and switch to a blue selected state Ctrl+A Select all the text in a caption placeholder Ctrl+B Bold Ctrl+C Copy Ctrl+I Italicize Ctrl+U Underline Ctrl+V Paste Ctrl+X Cut Ctrl+Y Redo Ctrl+Z Undo Left Arrow If the playhead is at the beginning or end of a caption placeholder and the placeholder is in a selected state, the left arrow key moves the placeholder .25 seconds to the left on the timeline (or less than that if it bumps up against the previous caption placeholder). Otherwise, the left arrow key moves only the playhead .25 seconds to the left on the timeline. Right Arrow If the playhead is at the beginning or end of a caption placeholder and the placeholder is in a selected state, the right arrow key moves the placeholder .25 seconds to the right on the timeline (or less than that if it bumps up against the next caption placeholder). Otherwise, the right arrow key moves only the playhead .25 seconds to the left on the timeline. Shift+Left Arrow If the playhead is at the beginning or end of a caption placeholder and the placeholder is in a selected state, this shortcut moves the placeholder .5 seconds to the left on the timeline (or less than that if it bumps up against the previous caption placeholder). Otherwise, this shortcut moves only the playhead .5 seconds to the left on the timeline. Shift+Right Arrow If the playhead is at the beginning or end of a caption placeholder and the placeholder is in a selected state, this shortcut moves the placeholder .5 seconds to the right on the timeline (or less than that if it bumps up against the next caption placeholder). Otherwise, this shortcut moves only the playhead .5 seconds to the right on the timeline. Alt+Left Arrow When a caption placeholder is selected, shorten its duration by .25 seconds. Alt+Right Arrow When a caption placeholder is selected, lengthen its duration by .25 seconds (or less than that if it bumps up against the next caption placeholder). Shift+Alt+Left Arrow When a caption placeholder is selected, shorten its duration by .5 seconds. Shift+Alt+Right Arrow When a caption placeholder is selected, lengthen its duration by .5 seconds (or less than that if it bumps up against the next caption placeholder). Ctrl+Left Arrow This shortcut moves the playhead to the beginning of the current caption placeholder or the end of the previous placeholder, whichever is closest. This shortcut doesn’t work when a caption placeholder is in edit mode. Ctrl+Right Arrow This shortcut moves the playhead to the end of the current caption placeholder or the beginning of the next placeholder, whichever is closest. This shortcut doesn’t work when a caption placeholder is in edit mode. Ctrl+Mouse Wheel Zoom the timeline in and out Adjusting the Timing and Duration of Caption Placeholders To adjust the timing of a caption, simply drag the placeholder left or right along the timeline. To change the duration of a caption, drag either end of the placeholder along the timeline to shorten or lengthen it. You can also use several arrow keyboard shortcuts in the table above to tweak the timing and duration of caption placeholders. Inserting New Caption Placeholders Although the closed captions editor does its best to create caption placeholders for you that are already synced with your content, there may be times when you need to manually add a caption placeholder to the timeline. Click any space on the timeline that isn’t already occupied by a caption placeholder. The blue playhead will move to that position on the timeline. Then click Insert Caption on the ribbon. New captions are four seconds long by default—unless there isn’t enough space to fit a four-second placeholder, in which case it'll fill the available space. You need at least half a second of empty space on the timeline to insert a new caption placeholder. If there isn’t enough space, the Insert Caption button will be grayed out. Deleting Captions There are three ways to delete a specific caption: Select the caption placeholder and press Delete on your keyboard. Select the placeholder and click Delete Caption on the ribbon. Right-click the placeholder and choose Delete from the context menu. To delete all captions at once, click Delete Captions on the ribbon, then click Yes on the confirmation message. Splitting Captions You can split a caption into two placeholders when you need more control over timing and duration. Just select the placeholder and click Split Caption on the ribbon. Or, right-click the placeholder and choose Split Caption from the context menu. The original placeholder will split evenly in half. And if it has text, the text will split where the cursor is located—everything before the cursor will move to the first placeholder; everything after the cursor will move to the second placeholder. Exception: If the playhead is at the beginning of the caption and the placeholder is in a blue selected state, all the text will move to the first placeholder after being split. Importing Captions If you already have captions typed in a document, you can import them via the closed captions editor. Note that this replaces all the existing captions for your video or audio track. Click Import Captions on the ribbon. Click Yes when asked to confirm that you want to replace the existing captions. Browse to the SRT, SBV, SUB, or VTT file you want to import and click Open. You can also import caption files without opening the closed captions editor. See this user guide for details. Exporting Captions Export closed captions when you need to use them in another project, edit them with a different app, or save a backup copy. Click Export Captions on the ribbon, choose a location where you want to save the caption file, then click Save. When you export captions from the closed captions editor, it generates a VTT file. Translating Captions Export the captions file for each video or audio track in your course, translate it, then import it back into Storyline. Here’s how: If the closed captions editor is open, click Export Captions on the ribbon and save the file to your computer. You can also export captions without opening the closed captions editor. Just select the video or audio track, go to the Options tab on the Storyline ribbon, and click Export. Open the captions file in a text editor or a translation program, replace the captions with translated text, and save the file with your changes. In Storyline, select the video or audio track again, go to the Options tab on the ribbon, and click Import to bring the translated captions back into your course. Closed captions aren’t included when you export text strings from your course for translation. Closing the Editor and Saving or Discarding Your Changes To save your changes, click Save at the bottom right of the Closed Captions Editor window. To discard your changes, click the X in the upper right corner or click Cancel at the bottom right of the Closed Captions Editor window. Showing or Hiding the Closed Captioning Button on the Player The closed captioning button on the course player is enabled by default, but you can disable it if you plan to build your own custom controls. Learn more. Using Triggers to Turn Closed Captions On and Off If the closed captioning button is enabled on your course player (see above), learners can toggle captions on and off whenever they want. However, you can also control captions via triggers. Learn more.7.1KViews0likes0Comments