The Rapid Elearning Blog

Archive for the ‘Articulate Storyline’ Category


custom video in PowerPoint

PowerPoint’s one of my favorite multimedia applications. It’s easy to use, almost everyone has a copy so it’s easy to share what’s created, and it does more than create presentations.

In fact, I regularly use PowerPoint to create the graphics and custom assets for my e-learning courses. Here are a few examples:

As you can see, PowerPoint is great for all sorts of multimedia production especially when combined with great e-learning software.

Create a Shaped Video

Recently someone in the community asked how to create a circle-shaped video for an e-learning interaction in Storyline.

circle video in PowerPoint

A real easy solution is to create an image with a circle hole in it and then place the video underneath only allowing the video to show through the circle hole. That’s fast and doesn’t require any editing of the video.

PowerPoint circle hole over video

If you want a circle-shaped video, you can create one in a video editing application. However, this requires having a video-editing application that allows you to do that and also having the expertise to use the video editor (which most of us don’t have).

And this is where PowerPoint comes in handy. It’s a tool most of us have, and it can do exactly what you need with minimal effort.

Here’s a video tutorial that quickly walks through the steps outlined below.

  • Customize slide size. A circle has a 1:1 aspect ratio. Change the custom slide size to 1:1 (something like 10″ wide and 10″ high). That should give you a video that’s almost 1000×1000 pixels.
  • Insert a video. Choose your favorite video.
  • Crop video to 1:1. Most likely the video is 16:9 or 4:3. You’ll need to crop it to 1:1 to get a perfect circle.
  • Scale the video to fill the slide. You want the video to be as big as possible inside the slide.
  • Save the file as video. Select .mp4. If you have an older version of PowerPoint you may have to save as .WMV. That’s OK, you can still use it in Storyline and Rise. You won’t get a circle video. The video is still going to be rectangular. But inside the rectangle will be the custom-shaped video.

Bonus tips:

  • Play around with some of the video formatting options in PowerPoint. There are lots of neat things you can do.
  • Same thing with animations and transitions. Anything you create in your PowerPoint slides can be save as video.
  • The corners are not going to be transparent. You’ll want the video background to match the course background to get a seamless experience.

Hope that helps and is something you can use in an upcoming e-learning course.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





no LMS

Generally, delivering e-learning courses is a two-step process: 1) create the course in your favorite e-learning software and 2) host the course in a learning management system.

There are many small organizations that don’t use formal learning management systems; however they want simple tracking of the courses. I had someone ask how they could track people in their organization who have taken a compliance course. He didn’t have a lot of learners and wanted something simple.

Here are two quick solutions that work well. They don’t require a lot of work to set up and they’re mostly free.

This solution assumes that the user gets a URL that links to the course. We have no identifying information so we need a simple way to collect who they are and track their completion.

Create a Form

Create a form using a hosted service. In these examples I am using Google Forms and Jot Form. However, you can use a different service if you want (or create your own form on a server). It doesn’t matter. The main thing is you have a way for the person to share info and send it your way.

form no LMS

Embed the Form

Once you have the form, you’ll embed it into the course. In these examples we’re using Rise’s embed block. If you use Storyline, the web object works perfectly for this.

Embed form no LMS

Create a Gate to the Form

The goal is to only expose the form when the course is complete. There are many ways to do this. For these demos, I’ll show two ways. In the first, I use a continue block that is locked until the learner affirms completion of the course and agreement with the content. In the second example, I use a quiz to serve as the gate.

no LMS two options

Examples of Embedded Forms

These are simple examples to show how the form looks embedded in the course and how you could create a gate to get to the form.

  • Jot Form Example: the course has free navigation and user affirms completion to unlock the the gate
  • Google Form Example: the course is locked and passing the final quiz unlocks the certificate of completion

Jot Form offers a bit more control and looks more integrated with the course. I colorized the block to match the form’s color.

JotForm example no LMS

On the other hand, Google Forms has that enormous header space and scrollbar. I removed the header image and filled it with white to avoid the Frankenform look but it still looks like something pasted into the course. It would be nice to have more control over the look, but it still works fine for what we need and it’s free. Also, the integration with Google Sheets saves a few steps later.

Google fomr example no LMS

Upload the Course

Since we’re not using an LMS, we need a place to upload the course. I use Amazon S3 which I showed how to set up in a previous post; but it could also be Google Storage. But it can be any web server.

no LMS Amazon S3 free

Track Course Completion

The form collects the data and sends it to the service. Jot Form displays a table with the option to download. Google Form sends the data to a Google Sheet.

Google Sheet no LMS

Of course, there are many other ways to do something similar to avoid using an LMS, especially if you have programming skills.

At a previous place, we used the course URL to drop a cookie on the person’s computer. At the end of the course, we inserted an .ASP file via a web object. The .ASP file collected the info from the cookie and sent it to the database. Thus we knew who took the course, when they completed it, and their minimum passing score.

Do you have any other ways you use to track the course without using an LMS or paid service? Please share in the comments.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





technical support & troubleshooting tips

I’m really proud of the e-learning heroes community. It’s active and filled with so many helpful people. I’m always amazed at how willing they are to answer questions and how quick they are to respond. It’s a testament to the outstanding people in our industry who are eager to share and help (which is probably why they’re in our industry in the first place).

Many e-learning developers are small teams of one or two people, so I see the community as an extension of the team. It’s like having a helpmate in the cubicle next door.

Today, I’d like to offer some time-saving tips that will help you troubleshoot your projects when asking for help. This way you get the right help and get it in a timely manner.

Become Fluent with the Software

It all starts with what you know. The more you know about the software and how to use the features, the better you’re able to find solutions or troubleshoot your courses. At a minimum, watch the tutorials. They do a good job going through the basic features and many of them have downloads with practice activities. In fact, many of the questions I see asked in the community are answered in the basic tutorials.

Articulate 360 subscribers have access to Articulate 360 Training. Every month we do a getting started series for Storyline and Rise. Those are great to learn the basics.

Use a Descriptive Question Title

troubleshooting tips e-learning

Most people scan the titles to figure out where they can best help. If your title is “Help with course, please,” it requires the person to click on the link. However, if the title is more descriptive, it is easier to discern what help is required.

“Variables don’t change when I click the button,” provides enough information for the person who’s looking to help.

Name Your Timeline Objects and Layers

It really slows things down when every slide is filled with the generic default titles. When I help with the files, I start by titling the objects and layers so that I can follow what’s happening. My guess is most people who want to help don’t have the time to do that.

troubleshooting tip title objects

You’ll get faster help if your file makes sense and is easy to parse.

It takes a little extra effort to name objects and layers; but it pays off in the long run when it comes to troubleshooting your course. This is especially true for the person in the community who’s trying to make heads or tails out of your slides.

Share What Version You Use

I am part of a swimming pool forum. They ask that all members have a signature file that includes pool size, type of pool, equipment used, etc. This ends up in every post and eliminates a lot of back-and-forth questions between people looking for and giving help.

It’s a good idea to do something similar when asking for help in the community especially since there are different versions of software which have various updates and different features. Share what version you have, type of PC or Mac, etc.

Keep it Simple

Ever have someone send you a video to watch and it’s 15 minutes long? Do you watch it? Or there’s that one friend on Facebook who’s never learned to create a paragraph break so you just see this massive block of text. I have the same friend and I just skip over what he writes. Who has time to read a book?

Two quick tips here:

  • Be liberal with paragraph spacing so it’s easier to scan and read. And use bullet or number lists.
  • Keep your question to a point or two. If you ask for too much, chances are that people will skip over what you ask. It’s not that they don’t want to help, it’s just that it’s either too hard to parse or too much to work on at one time.

Show What’s Happening

I find it’s easier to do a quick screencast and share it than it is to type a lot of text. This allows a person to see what you’re doing and what’s happening. If you’re using Articulate 360, take advantage of Peek. You can record a screencast which is automatically uploaded to Articulate 360 and generates a URL for you to share.

peek for screencasting

If you don’t use Articulate 360 yet, there are all sorts of other screencasting options that are free or low-cost. In fact, the newer versions of PowerPoint have a built-in screen recorder. Once the video is on the slide, just right-click and save the media as .mp4.

In either case, you can eliminate a lot of going back and forth in the chat by showing what you have and what’s happening. With that in mind, keep it simple and get to the point quickly.

Share a File or Demo

Without seeing the file, it’s often tough to diagnose the issue. Usually the first response to a question is whether you can share a file (or published version of the course) so that we can see what’s happening. So why not share a source file to start?

Here are a few tips that help when sharing files:

  • There’s no need to share the entire course, especially if it’s a 400 MB download. Try to isolate the issue and get rid of slides that aren’t required.
  • Tell people where they should look, especially if there’s more than one slide.
  • Save the file you share as a copy. If the content is proprietary, you can still share the source file. Make a duplicate and either remove the content or replace it with gibberish.

Keep in mind, community members are all over the world and in different time zones. The more you share upfront, the easier it is to get help and a quick answer.

Focus on What You Want and Not Trying to Fix What You Have

It’s easy to get pulled into fixing an issue that is better resolved with an alternative approach. If the desired outcome isn’t clear we end up on a rabbit trail fixing something that had an easier solution. That’s why I usually ask people what they’re trying to do before I start helping to solve the issue they have.

When you ask for help, clarify what you’re trying to do. Sometimes you end up with some good production tips.

It’s Volunteer Time

Keep in mind that e-learning heroes is a community of your peers. Many of them share source files, record tutorials, and show demos. What they offer is offered for free and on their own time.

Be respectful of their time. In fact some of these tips will make it easier for them to help you.

Share the Solution

If you get help and it works, let us know in the forum thread. That helps the next person.

Bonus Tip

Make a goal to pay it forward. I try to answer five questions a day. I find it fulfilling to know I’m helping someone. I also find there’s a lot I don’t know so I end up learning things either by testing ideas or seeing the responses from some really smart people in the community. A side benefit is that it builds your reputation and credentials in our industry.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





e-learning templates made simple

E-learning templates are a great way to save time. This is especially true for those of us who work with repetitive content and courses. And it’s even more true for those of us who aren’t graphic designers since the e-learning templates provide nice looking visual design.

However, working with templates can be a challenge. Sometimes they present too many choices (which can debilitate). Another challenge is that to modify templates often requires a more involved understanding of the authoring tools. This isn’t easy for the person just getting started.

Here are a few ideas to help simplify working with templates.

E-Learning Templates Are the Second Step

Figure out what you need before you build first. A big time waster is not knowing what you want in the course but building it, anyway. Then realizing it’s not what you want, you tear down and rebuild. Or worse, you move forward with a bad idea and let it dictate the rest of what you’re doing because of the time already invested.

I like the weekly e-learning challenges to play around with ideas and to see what others do. The challenges help develop fluency with the software and build awareness around ideas that can be implemented before you work on a project.

ACTION ITEM

Let the Content Determine the Right Template

Templates are great, but don’t let the template dictate your content. This is one of the biggest issues with templates. We like a template because it has sixty cool layouts and then we force our content to the template. Or we think we have to use all sixty layouts so we have similar types of content but it all looks different throughout the course because we mix and match the layouts.

ACTION ITEM

  • Review your templates and the various layout options. Then determine when you use them and why. Even if you have a lot of great layouts, it’s a good idea to reduce the layouts you actually use. This provides visual consistency; and repetition is key to good visual communication.

Keep E-Learning Templates Simple

Templates don’t always need to be big all inclusive files with dozens of layouts. It helps to have single purpose templates like just one tabs interaction. The more single purpose the template is, the better you can use it. It’s also easier to customize one slide to match your course than it is to customize an entire template.

e-learning templates

One of the most under used features in Storyline is saving the files as templates. This makes the slides available for the next course. You can insert a single slide(s) or the entire file. The new teams feature in Storyline 360 makes it even better because the slides can be shared with the team and easily inserted in other courses.

In Rise, you can build lessons and save them as templates. Once inserted, they can be modified to meet the course objectives. And they don’t need to be big lessons, you may just want to customize some blocks for easy re-use.  This is especially helpful if you want to use a multiple colors or change the text sizes.

rise e-learning templates

ACTION ITEM

  • Create single slide templates in Storyline and save them as templates. If you’re on a team account, share them with your team.
  • Learn to create and save templates in Rise. I like to create branded blocks where I add different colors and text sizes.

Learn to Edit the E-Learning Templates

Inevitably you’ll need to modify the template. There are some things you should learn about the software so that when you need to change the template it doesn’t take forever (otherwise you lose the time-saving benefit of the template).

ACTION ITEM

Templates are a real time-saver. But to really save time with them, plan ahead so you’re content is prepped; and then learn to use the authoring software used to build e-elearning courses.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





Years ago I developed a hierarchy for course design. I used it to help manage my team and allocate our limited resources.

Rapid E-Learning Ruled

Back then, most e-learning was custom-built in Flash. Those courses took more time, required special skills, and cost a lot more to produce. However, with Articulate Presenter and PowerPoint we could build about 80% of what we needed. It was fast and easy. So our default was Articulate Presenter unless we could justify why it didn’t meet our needs.

 

PowerPoint Meets Flash

PowerPoint had its limits. But when we needed custom interactivity, we‘d build just those pieces in Flash and insert them into our PowerPoint-based courses. That meant we got fast development and custom interactivity: a win-win.

Save Resources for Expensive Development

There were courses where PowerPoint or a hybrid approach just didn’t work. As a final option we custom built our courses in Flash. Because this was the most expensive and time-consuming option, we tried to limit this and do most of our custom development using the hybrid approach.

It made no sense, to custom build Flash when we could do the same thing faster and less expensive with PowerPoint. So we always started with rapid e-learning and only moved to more expensive development when we could justify doing so.

Today, we have a similar challenge. Let‘s revisit the hierarchy of course design for a new generation of rapid e-learning designers.

The Updated E-Learning Course Design Hierarchy

Both Rise and Storyline are part of Articulate 360. Often, I‘ll get questions about when to use Rise and when to use Storyline. To answer the question, I lean on the same strategic approach I used years ago.

Operate at the Speed of Business

A large part of e-learning content exists because of regulatory and compliance requirements. Those courses are more explainer content and less interactive. Thus, it makes sense to use the easiest tool and quickest production process possible.

And this tool is Rise. It‘s super easy to use and getting courses (especially simple ones) out the door is a breeze. On top of that, whatever you build can be saved as a template, saving even more time. And as far as interactive content, there are a number of interactive choices that come with Rise (and those get updated frequently). Rise is also fully responsive which is perfect for today’s mobile workforce.

 

Hybrid Development is a Win-Win

The reality is that not all content is explainer content and often there needs to be more custom interactivity than what you get out of the box in Rise. That’s OK.

When Rise doesn’t provide the content type you need, use Storyline. Build single slide interactions and then insert them into your Rise courses with the Storyline block.

With this approach, you get easy authoring for the majority of the content in Rise and custom interactivity when you need it in Storyline. It‘s a good balance between speed of production and providing the appropriate level of interactivity. That’s a win-win.

Manage Resources for Custom Interactivity

There are times when working directly in Storyline makes more sense than working in Rise. For example, if you need to build complex interactions, adaptive learning paths, variable-based navigation, or complex interactive scenarios then it makes sense to build them in Storyline. Although, Rise also offers an interactive scenario block, so that is still a better starting option. Storyline gives you a lot more flexibility because you start with a blank screen and build from there.

This doesn’t mean working with Storyline is complicated. It‘s still easy to learn. It means that for simple content, Rise is usually a better solution.

Want a tabs interaction? In Rise you select the tabs interaction block and add your content. You‘re done. Building the same thing in Storyline requires time to think about what it will look like and how it will function. Then the construction begins by adding the objects, layers, and triggers. It‘s easy enough to do, but just a bit more time-consuming to do it. And time is money.

So when people ask which tool to use, I suggest using the hierarchy. All things should start with Rise. If you can’t build it with Rise, explain why. If you need custom interactions, build the core content in Rise (you have a lot of options with the various blocks) and add Storyline interactions when necessary. And if your course requirements are more complex and they can’t be met with Rise, then by all means, use Storyline.

The main thing is you‘re managing your limited resources.  If you spend a week on something in Storyline when you could have built it in one day with Rise, you‘re not being a good steward of your resources. And when you need more time for custom work, you won’t have it because you spent it on simple content.

That’s where the content creation hierarchy comes in handy. It‘s all about managing resources and delivering a viable product on time and within budget.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





variables to save time

Here’s a time saving tip when working with variables in your e-learning courses. This is helpful when testing your course as you work on it.

Create Reference Variables

During your production process when working with variables it’s always a good idea to create a reference to those variables. This is a text box that shows the current value of the variable. Thus when testing your course and making adjustments that change the value of the variable, you can see it displayed.

add a reference variable to the slide

If you don’t use a reference of the variable how else will you know the variable value changed? You have to assume that the course is working correctly, which may not be the case. Being able to see the variable helps in troubleshooting issues you may have when using them. For example, if the variable changes then you know something else is the issue.

Where to Put Reference Variables

The reference variables are only visible during the construction and testing of the course. Once it’s ready to go live, they need to be removed from the slide.

Everyone has their own production method. Here are a few options:

  • Delete them when you’re ready to publish the course. This gets rid of them, but if you need to go back and edit the slide, you need to recreate the references.
  • Move them off the slide. This works, but then you have to move them back on when you do edits. Seems like a lot of extra work.
  • Keep them on the slide, but hide them on the timeline. This means they’re always there, and just require a simple click to make them visible.
  • Put them on the master slide. I like this approach. I can turn them off on the master slide and they’re off on all the slides. And then if I need them available, I only need to turn them back on once rather than doing it slide by slide.

Additional Variable Resources

Here are a few quick tutorials and previous articles on working with variables:

Tutorials

Articles

What tips do you have when working with variables in your e-learning courses?

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





next generation rapid e-learning

Ten years ago, the e-learning industry was still mostly Flash-based. That meant organizations either had to buy e-learning courses, have them custom-built, or hire a Flash programmer to build them. The cost for doing so meant most organizations didn’t have access to the world of online training.

That all changed when the PowerPoint-to-Flash tools like Articulate Studio, emerged. It democratized the world of online training because it put e-learning into the hands of anyone who wanted to build a course. If you came from that world where building Flash courses took more time and cost more, everything was rapid. Thus, the term, rapid e-learning.

The Evolution of Rapid E-learning

Flash required special skills which made authoring in PowerPoint so attractive. With some creativity, one could build engaging and interactive e-learning courses in PowerPoint. However, the reality is that PowerPoint has a ceiling and doesn’t offer all of the interactive capabilities required for many e-learning courses. I outlined that in this post on why PowerPoint isn’t the right choice for interactive e-learning.

PowerPoint isn't the best for interactive rapid e-learning

  • Interactivity is mostly limited to click-and-reveal.
  • It requires a lot of redundant production which gets exponentially more complex.
  • You can’t use variables to create adaptive training or branched interactions.

When Storyline came out in 2012 it really changed the rapid e-learning industry. For the first time, one could build highly interactive content with PowerPoint comfort and without a background in programming. That was an exciting time for first-generation rapid e-learning developers.

Second Generation Rapid E-Learning

I’m often asked where is the rapid part of rapid e-learning? For those who are entering the industry today, it’s a bit different.

Storyline is still a killer application. However, there is an opportunity for those who want a new type of authoring, or what could be called rapid(er) e-learning. Welcome to the world of Rise.

In a sense, Rise is to Storyline what PowerPoint was to Flash. It offers even easier authoring that allows for quick development and delivery. It’s fully responsive and works great on mobile devices.

Comparing Rise to Storyline

Rise courses are constructed using pre-determined blocks. Choose a block, add content, and publish. Whereas, Storyline is a freeform slide that requires a bit more work.

new rapid e-learning example insert tabs interaction Rise

A great way to see the difference is by looking at how to insert a tabs interaction (one of the most common interaction types). In Rise, select a tabs interaction block and insert the content. That’s it.

In Storyline, it’s relatively easy to build a tabs interaction, but it requires more steps. Decide how it will look and work. And then from there build custom tabs, add layers, and then connect triggers.

As you can see, Rise is a whole lot faster and easier. It’s the new and improved rapid e-learning.

Combining Rise and Storyline for Powerful Rapid E-Learning

The cool thing is that when you want some custom interactions, build them in Storyline and add them to the Rise course. Thus you get the best of both worlds: fast, easy authoring in Rise combined with custom interactivity of Storyline.

rapid e-learning Articulate Rise example

Click here to view the Rise demo.

Above is a quick demo where I modified one of the Storyline templates in Content Library to work in Rise as a simple interaction.

Other Examples of Rapid E-Learning Courses in Rise

And for those wondering what you can do, here are few Rise demos:

other rapid e-learning examples in Rise

If you haven’t tried Rise, give it a go. Let me know what you think. Eventually, this e-learning stuff will get so easy we’ll just be sitting at home watching Netflix and eating bonbons.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





interactive video

This is part two of the series on working with 3D models and interactive video. In the previous post, we looked at how to create a video using 3D models in PowerPoint. Today, we’ll discover how to use them to create interactive videos in Storyline. And then of course, once you have an interaction you can also insert it into a Rise course, which is what I did in this Rise lesson.

Create the Interactive Videos in PowerPoint using 3D Models

If you want to create a different kind of interactive video, you can apply what you learn here. The process is similar. For this demo, make sure you understand how the video is created and how it plays all the way through because we’re going to add a trigger to pause it before it completes.

For this demo, I created a video where the object rotates in and then rotates back out. It was built using a three-slide PowerPoint file and exported as a video.

Tutorial: how to create a three-slide video using 3D models in PowerPoint.

A Teardown of the 3D Model Interactive Videos

There are a few nuanced steps in this process. Let’s review what happens and then we can look at how to create it in Storyline:

Interactive video in Storyline using 3D models in PowerPoint

  • User clicks on the side tab which shows a layer.
  • The layer plays the video we created in PowerPoint.
  • Since the 3D object in the video rotates in and out, we set the video to pause when the object is rotated in.
  • Then we add a trigger to resume the timeline (with a hotspot or button) which continues to play the video and shows the object rotate out as the video completes.
  • The completion of the media (the video) triggers the layer to hide which takes us back to the base slide with the side tabs.

Create the Interactive Videos in Storyline

The video I create in PowerPoint is the exact same aspect ratio as the Storyline file. For the most part, 16×9 is fine. But if you change the aspect ratio of your .story file make sure you do the same on the PowerPoint slide.

  • Go to slide 1 in PowerPoint and save it as a .PNG image. This image will be what the user sees on the base slide in Storyline and perfectly aligns with the videos that will be on the layers.
  • In the Storyline slide, insert the slide image from PowerPoint.
  • Create the appropriate number of layers based on how many interactive elements you have.
  • On each layer add the appropriate video. Each video should play automatically. I also recommend putting a hotspot over the video so the user can’t click on the video to start/stop it.
  • On the video layer, add a trigger to pause the video when it reaches either a certain time or cue point. I like to add cue points so I can nudge them without modifying the trigger. The video should pause at the apex of the object rotation.
  • Add a trigger to unpause the video. It could be a simple button or perhaps a hotspot.
  • Add a trigger to hide the layer when the media completes. This should take you back to the base slide.

Click here to view the tutorial on creating an interactive video.

That’s basically it. Of course, there’s a lot more you can do to decorate the layer or add additional content. It just depends on your needs. Practice the technique first and once you have it set, see what you can do.

If you do create something, please share it with us so we can see it.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





e-learning instruction screen interactive start screen

It’s common that when getting to a new web service or starting a new application you see some sort of instructions or start screen. Basically, the screen freezes your interaction with the site until you’re oriented and then lets you continue. Some force the interaction and others allow you to opt-out.

Those are not much different than the gate screens I’ve written about in the past (with free downloads). The gate screen sort of does the same thing. It stops your progress, provides instructions, and lets you continue.

Examples of Start Screens

Here are some examples of different instruction screens I’ve seen online. I’m sure you’ve seen something similar.

instruction screen

examples of interactive start screen

How to Create an Interactive Start Screen

Today I’ll walk through the process of creating an interactive start screen. Below I highlight the main considerations and you can watch the video tutorial to get the details.

  • Is the screen mandatory or can the user click away at any time? I prefer the freedom to leave, however, there may be times where it’s important the person is exposed to all of the instructions. Sometimes people tend to skip out and they may benefit from not doing so, especially when it comes to matters of compliance training.
  • Does the instruction only move forward or does it go backward, as well? Probably more a matter of preference, but if they can go back make sure you build the navigation to work properly. You’ll also notice that one of the images above offers a single “continue” button thus limiting it to forward movement only.
  • Do you need the progress dots? Many of those instruction screens have dots. They’re good for progress indicators. You’ll notice that some of the screens display numbers or timelines. If you do use dots, are they clickable? Do they need to be?
  • How are the instructions displayed? Are they on cards, which seems to be the most common. Or are they displayed fullscreen? Fullscreen gives you more real estate. Cards are usually laid over the main screen with some sort of lightbox design.
  • Is the content animated? There are some nice effects you can create with entrance and exit animations. But sometimes when building these types of screens, the time it takes to make them look right, may not be worth the value you get.
  • How do the instructions end? Some disable the navigation buttons and others offer a “get started button.” The main consideration is what is the next step? If they need to continue, make that clear. Or if all they need is to close the screen, then make that clear, as well.

How-to Tutorial

Here’s a tutorial where I build a quick prototype and discuss some of the considerations and approaches you can take building an interactive start screen.

instruction screen e-learning interactive start screen tutorial

Click here to view the tutorial.

There are a lot more considerations, but those are a good start. And when you actually start to build the screens for your course, you’ll find there are many different ways to do so.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





At a bookstore, you’ll see all sorts of books covering all sorts of content. But one thing you’ll notice is that while they may have different content and even look different they mostly share a similar structure.

What’s in a Book?

What do books have in common?

  • Cover images
  • Title Page
  • Author Information
  • Table Contents
  • Version
  • Chapters
  • Index
  • Appendix

Despite the topic, at some point, the publisher assembles the book and puts it into a structure similar to what’s listed above.

What’s in an E-Learning Course?

E-learning courses are very similar to books. While they cover a range of topics, there are elements that are common to most courses. What are they?

e-learning templates common structure

  • Course Title Screen
  • Table of Contents (as a menu)
  • Instructions Screen
  • Course Objectives Screen
  • Section Title Screen
  • Gate Screens
  • Resource Screen
  • Summary Screens
  • Quiz Instructions Screen
  • Exit Instruction Screens

Since you know those screens are in most courses, why not pre-build them and make them part of your starter template? It’s also a great way to work in the company brand without messing with the content screens.

e-learning templates teams in Articulate 360

Also, if you’re using Articulate 360, you already have a bunch of templates that have a lot of that structure. So it’s a great starting point and big time-saver. And as an added bonus, if you’re using Articulate 360 Teams you can add those slides to your Teams account and everyone on your organization’s team can access those slides. This is a big time saver and lets you maintain the quality and consistency many organizations require.

What pre-built screens would you add to the list?

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





e-learning tips

One of the e-learning tips I give at workshops is to be intentional about your e-learning course design and production. Many course developers start with the default settings and then make changes later. However, that could impact the course and cost time and money.

So today, I’m sharing three things you should do before you start working on your e-learning course.

E-Learning Tip: Determine Your Course Size

It’s important to determine your course size before you start working on the slide. If you do some work and then change it later, you may skew things on the slides and have to do a lot of adjustments. Also, popular screen sizes today aren’t what they were a few years ago. Computer screens are wider, more pixel dense, and a lot of course developers like to step away from the default player.

e-learning course size settings e-learning tips

Here are a few considerations:

  • By default the course size is a 4:3 aspect ratio set at 720×540 pixels. This is a good aspect ratio and the course can be set to scale with the browser, so pixel width isn’t as big of an issue.  The image below shows the 4:3 aspect ratio with a sidebar menu.

e-learning tips 4x3 aspect ratio

  • You may want to go with 16×9 since most screens are widescreen. And that looks nice on mobile devices in landscape mode. Although newer phones are going to 18:9. The image below shows the 16:9 aspect ratio with a sidebar menu.

e-learning tips 16x9 aspect ration

  • Are you using a sidebar menu? If yes, I like the 4:3 aspect ratio. The more squared slide fits nicely with the sidebar. However, if you go with a 16×9 aspect ratio, having the sidebar makes the course look wide. In that case, get rid of the menu, or set it as a drop down from the top. And that’s what I show in the image below. You can see the menu drop down on the player. It’s there, but doesn’t consume screen space.

e-learning tips drop down menu

E-Learning Tip: Determine the Color Scheme & Create Theme Colors

Before you start working on your course make sure to determine the colors you are going to use. There are a few ways to get the right colors for the course:

  • Company brand: many companies have branded colors. Even if you don’t have the official colors, you can go to the website and do a color pick of the main colors used.
  • Single color: find one color and use a color schemer to create other colors.
  • Color picker: I like to pick colors from images inserted on the screen. Or I’ll use the main company color from a logo or official image and then build out my color scheme from there. Here’s a link the color picker I like to use.

Once you have determined the colors, build a color theme and only use the theme colors in your course. Generally, you have black and white and the six accent colors. There’s no pre-defined use for the accent colors. Basically you get six options. I’d use them consistently, though. For example, accent 1 is the main color. Accent 2 may be the secondary or complimentary color. And you don’t need to have six colors. Some people just use two.

theme colors e-learning tips

If you stick with theme colors you can always change themes and all of the theme colors will change with it. If you don’t, then you have to go through the course slide-by-slide to make color corrections.

E-Learning Tip: Determine the Font Pairs & Create Theme Fonts

Same as the theme colors, determine your font pair prior to building your course. And then create theme fonts. You’ll have a title font and body font.

When you insert text on the screen, stick with the theme fonts only. Don’t go digging through the font list to find that one cool font. I’ll state it again, when you insert text on the screen, stick with the theme fonts only.

theme fonts e-learning tips

If you need to make changes to your fonts, all you need to do is apply a new theme and the text that uses theme fonts changes in the entire course and on the master slides. However, if you insert text from the font dropdown list, you’ll need to change those fonts individually. That’s why you want to stick with theme fonts.

theme font selection e-learning tips

So there you go, three e-learning tips before you start building your e-learning courses:

  • determine the size of the course
  • create theme colors
  • create theme fonts

Doing those three things up front will save you lots of production time while building your e-learning course.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.





e-learning mars rover demo

I created a demo course in Rise for a workshop. One of my goals with the demo was to show off different ways to add content and how the various blocks work and look in a real-ish project. This produced a lot of questions in the community on how I built it.  So I’ll try to answer them here.

First, I’ll have to admit that I didn’t really do all that much because Rise did all of the heavy-lifting. There is one custom piece in lesson 6 where I inserted a Storyline interaction. But for the most part, I just opened Rise and added my content. Then Rise did the rest.

Of course, some of the assets are colorful and eye-catching, but I didn’t create those. I used the information from the NASA site (which by the way is pretty darn cool). Check out what’s in the works for Mars 2020.

[If you haven’t worked with Rise, here’s a good overview video.]

Visual Design

Like I mentioned earlier, the actual assets in this demo module are from NASA, so they get all of the credit. However, I will add that when you create e-learning projects, it is important to have consistency in image quality and the assets used in your courses.

Just because you can add content easily into the Rise courses, doesn’t mean you need to. Like any e-learning module, you want to be intentional and avoid the Frankencourse.

One thing that does really catch your eye in this particular demo is the animated .gif cover screen. I think it looks cool and gives the module some personality. That’s a key first step in engaging learners. You’ll also notice animated .gifs in some of the other lessons.

Lesson 1: The Mission

For this lesson, I opted for a full-width image. I think it anchors the content well. This works best with higher resolution images. By not having margins, it kind of forces your eyes down the page.

I also added a hyperlink to the text body.

Lesson 2: Learn More…

I wanted to show a way to create an easy branching structure to direct people to specific lessons. This feature could also be used for simple branched scenario interactions.

e-learning branching interaction

I also added a disclaimer using the Notes block. It’s a great way to draw attention to important points.

Lessons 1 and 2 are the pre-content. The lessons after those are broken into three distinct groups and you’ll notice I used Section Titles to show those groups.

Lesson 3: The Trip to Mars

I leveraged the image carousel and the captions to provide more information about the trip to Mars. This content could be presented in a number of ways, but I like to give the user a way to touch the screen and this is a good interaction type for that. I also increased the size of the caption text.

e-learning image carousel interaction

Lesson 4: Fun Facts & Trivia about Mars

This lesson includes a lot of features. There’s a clickable image gallery. Again, the animated .gifs look nice and pull you in. Click on the thumbnail to zoom in and see the entire image.

I attached some additional content and you can download a PDF.

The Mars Trivia section includes a couple of dividers. One just holds back information until the user is ready and clicks. And the other forces the user to complete the interaction before advancing.

e-learning lock navigation

The trivia section includes two different types of knowledge checks: traditional quiz question and one that requires watching a video before answering.

Lesson 5: Did You Know?

There are a few different ways to insert videos into a Rise lesson. This is the pre-built lesson block which is full width and contains no additional content.

If you want to add additional content like text to the video block, you’ll need to create a custom block and insert the video that way. That’s what I did in lesson 8.

Lesson 6: Explore the Rover

This is the lesson that generated the most questions (and will require an additional blog post and tutorial). One of my favorite features is the Storyline block in Rise. In this lesson, I create a single slide interaction in Storyline, the 3D Rover, and inserted it into Rise.

For the Storyline module, I created a transparent player and got rid of the player features so it sits in the block and looks like it’s part of the Rise lesson and not something inserted into it.

e-learning interactive Mars Rover

This block gives me the best of both worlds: fast and easy production in Rise coupled with custom interactivity from Storyline. I’ll do a more detailed write up on how I created the 3D Storyline interaction in an upcoming post.

Lesson 7: Access Mars – Virtual Reality

This only works in the Chrome browser.

This is a webpage inserted into Storyline as a web object. And then the Storyline slide is inserted into Rise. It lets you navigate Mars in virtual reality.

e-learning Mars rover virtual reality 360

For course developers, this means you can insert all sorts of interactive web content into your Rise courses using web objects and the Storyline block.

Pretty cool, huh?

Lesson 8: Rover POV – Five Years on Mars

This is a different way to insert a video. In lesson 5, I inserted the video as a video block. In this lesson, I inserted it using custom blocks. The advantage of the custom blocks is being able to combine more blocks with additional content, interactions, and knowledge checks.

Lesson 9: 3D Ride Along with Rover

This is yet another way to insert a video. In this case, the video comes from YouTube and it’s also 360 so you can move around the screen. This really opens up what you can do with your videos, especially as the 360 video production is becoming more affordable. Look at how inexpensive the cameras are currently.

e-learning insert Youtube Mars rover 360

I did notice that the 3D doesn’t work on my smartphone iPhone 6 (it did work on my Android Pixel 2XL), which is something to keep in mind when adding media content to your courses: be sure to test different devices.

Lessons 10: Free Posters

Just another image gallery. Secretly I just wanted to point to the free posters. They’re pretty cool. I did use an animated .gif for the title image.

Again, those animated .gifs just add a lot of pop to the course content.

Lessons 11-13: Inserted Web Sites

Adding resource links is pretty common. These lessons are are the URL/embed blocks. As you can see Rise pulls in the metadata from the site to make the link more interesting. You can turn that off if you want.

e-learning Mars training program ASU

So there you have it, a really quick run through of the Rise Rover demo module. From the Rise perspective, it’s super easy to build. It’s just a matter of collecting your content, determining the lesson structure, and then dropping it in. Just don’t tell your boss how easy it is.

What I think really wowed people was how nice the content looks. Part of that is the way Rise handles lessons and makes everything nice and clean. And the other part is that I had great assets from which to work.

I’ll do a followup post on the 3D rover interaction in Storyline. Let me know if you have any more questions about this module and go check out all of that great content on the Mars site.

Events

Free E-Learning Resources

Want to learn more? Check out these articles and free resources in the community.

Here’s a great job board for e-learning, instructional design, and training jobs

Participate in the weekly e-learning challenges to sharpen your skills

Get your free PowerPoint templates and free graphics & stock images.

Lots of cool e-learning examples to check out and find inspiration.

Getting Started? This e-learning 101 series and the free e-books will help.