FAQ content

Create, edit, and manage interactive tutorials

In this article

In an interactive tutorial, your content is organized into slides—just like a PowerPoint presentation (to a degree). Each slide has two main parts:

  • The slide canvas allows you to display an image (from the Image Manager, an uploaded image, an image hosted elsewhere, or a solid background color) that is used as the background image that the tutorial's interactions are overlayed onto. You can also display a video (YouTube, Vimeo, and direct video links are supported) as a slide, although interactions can not be shown on video slides.
    • Note: You can also embed videos on Image slides using a Widget interaction.
  • Interactions, which can contain annotations/callouts, hotspots, questions, and widgets. Think of these as your narrative for the interactive tutorial—allowing you to highlight specific areas of the image being shown, ask questions to your users as they work through the tutorial, and embed content in the tutorial.

Interactive tutorials are intended to be viewed via their direct URLs. Each interactive tutorial you create will have its own URL that will display the tutorial content.

example interactive tutorial slide
An example interactive tutorial slide with callout, hotspot, and question interactions added.

Each tutorial has its own set of customization options, allowing you to configure everything from user permissions, public visibility, look and feel, and general tutorial options. The purpose of this Springboard is to guide you through the process of creating an interactive tutorial, from customizing its options and content to gathering and analyzing submission data.


Create or copy an interactive tutorial

Tutorials are only available to LibWizard Full subscribers. If you currently subscribe to LibWizard Lite (Forms & Surveys only) and are interested in upgrading, contact our Springy Sales Team for more details.

There are two ways to create a new interactive tutorial:

  • Start with a blank slate: this will create a brand new interactive tutorial with the default settings and an empty workpad. If you want to create a new tutorial from scratch, this is the best option.
  • Start with a copy of another tutorial: this will create a new tutorial based on an existing interactive tutorial's settings & fields (submission data is not copied from the original). If you want to create a new version of a tutorial, or simply use an existing tutorial as a starting point, this option can be a time saver.

No matter which option you choose, you can get started by navigating to Tutorials in the navigation bar and clicking the Create New button.

The Create New button on the Tutorials page

Learn more

[Return to top]


Customize tutorial options

While editing your tutorial, click on the Settings button above the workpad to view and customize your tutorial's settings.

navigating to a tutorial's settings

The panels below correspond to each group of tutorial options you'll find. Click on any panel to learn more about the available settings.

The Basic Info settings allow you to customize your tutorial's title, description, and friendly URL (which allows you to customize your tutorial's public URL to be more user-friendly). You'll also find your tutorial's Public Access Control options, which allow you to restrict access to your tutorial's public page by a password, or by hiding your tutorial outside of a certain date range. You can also restrict access to your tutorial using LibAuth Authentication. This allows you to require users to authenticate before viewing your tutorial's public page.

Each tutorial has its own set of user permissions, giving you control over who owns, can view, and can edit the tutorial. Admin users and a tutorial's owner have full control over the tutorial, its options, its content, and its submission data. Regular users (other than the owner) only have access to a tutorial's public page unless they are granted either Edit or View permissions. Whereas a user with Edit permission can modify a tutorial's content, most settings, and submissions, a user with View permission is limited to a read-only view of the tutorial's settings, fields, and submissions.

In your Tutorial Options, you'll find settings that affect the aspect ratio and maximum width of the interactive tutorial.

Under the Look and Feel settings, you'll find a handful of options that allow you to customize the appearance of your tutorial's public page. This includes the tutorial's font colors & styles; page colors; and text displayed next to required fields. In addition, you'll find options for automatically numbering your tutorial's fields and adding custom CSS code.

LibWizard has the ability to record a user's IP address, browser, and referring URL. When active, this will be stored along with the user's submission data in your tutorial's report. However, you can choose to remove one or all of these user agent fields in your Reporting options.

Under your tutorial's Advanced settings, if activated in your system settings, you will see options for adding custom JavaScript code to your tutorial. You can either add code directly to your tutorial's public page, or include an external JavaScript file.

[Return to top]


Add slides and interactions

In an interactive tutorial, your content is organized into slides—just like a PowerPoint presentation (to a degree). Each slide has two main parts:

  • The slide canvas allows you to display an image (from the Image Manager, an uploaded image, an image hosted elsewhere, or a solid background color) that is used as the background image that the tutorial's interactions are overlayed onto. You can also display a video (YouTube, Vimeo, and direct video links are supported) as a slide, although interactions can not be shown on video slides.
    • Note: You can also embed videos on Image slides using a Widget interaction.
  • Interactions, which can contain annotations/callouts, hotspots, questions, and widgets. Think of these as your narrative for the interactive tutorial—allowing you to highlight specific areas of the image being shown, ask questions to your user as they work through the tutorial, and embed content in the tutorial.

For example, if you were creating a tutorial to help patrons learn how to use your catalog, you could display a screenshot of your catalog in the tutorial. Then, you could add interactions to the slide to highlight areas to click on to initiate the search, add questions to be completed after the user attempts a search (searching the live catalog in a different browser window), and a video slide providing a recap of the overview. You can even add graded questions to assess their search skills!

Slides

Interactions

Welcome slide

Each tutorial has an optional Welcome Slide that can display before users begin the tutorial. You can find this at the top of your tutorial's Slide Area.

You can use the Welcome Slide to provide an introduction or instructions for completing and submitting the tutorial.

Thank You slide & certificates of completion

Each tutorial has an optional Thank You Slide, which you can use to display a message once a user has submitted the tutorial. You can find this at the bottom of your tutorial's Slide Area.

This can be helpful if you want to acknowledge the user's submission, let them know when to expect a response, or other useful information. You can also activate an option allowing users to receive a copy of their submission via email.

In addition, tutorials provide an option for generating a certificate of completion after a tutorial is submitted. This can be useful for providing users with proof they completed the tutorial for employment or professional development purposes. The certificates are customizable and can both be printed, saved to PDF, and emailed.

[Return to top]


Preview & share an interactive tutorial

As you're building your tutorial, it can be helpful to see how the public view will look to users. With Preview Mode, you can view a fully interactive version of your tutorial's public page. This allows you to see how your tutorial's layout, navigation, & customizations will appear to users, while also giving you a chance to test out things like field rules, grading, & submission behaviors. What's more, any time you submit your tutorial while in Preview Mode, the submission data will be kept separate from that of your live tutorial. That way you don't have to worry about your test data affecting your reports.

When you're ready to share your tutorial, you can link to it directly via your tutorial's URL or embed it into another page using the button widget option.

Learn more

[Return to top]


View  & analyze submission data

A tutorial's Reports is where you can view, manage, analyze, and export its submission data.

The View Reports button above the workpad

The following reports are available:

  • Data table: this report provides a table of all submissions, with options to view or delete individual records (depending upon your permission level). You can filter the data table by field values and/or submission dates, with the option to export the current list of records to a CSV file.
  • Field analysis: this report allows you to take an in-depth look at responses to multiple choice fields. For each such field, you'll be presented with a chart and accompanying data table that breaks down the number of responses for each of the field's options.
  • Cross Tab: for reports that have more than one multiple-choice field, this report allows you to analyze the relationship between two fields. For example, if you have a Department field and Status field, the cross tab report would should you the distribution of departments by status.

Learn more

[Return to top]


Manage & delete tutorials

You can browse and manage your tutorials via the Tutorials landing page.

From this page, you'll find options to:

  • View a tutorial's URL and widget embed code
  • See the number of submissions received and view the tutorial's reports
  • See the total number of fields in each tutorial
  • Launch a tutorial in Preview Mode
  • View and manage trashed tutorials before they are permanently deleted.
  • Permanently delete the tutorial and its submission data from LibWizard

Remember: a user's account level and permissions determines which tutorials they can browse, view, and/or edit. Only Admin users and a tutorial's owner are allowed to delete a tutorial.

Learn more

[Return to top]