Category: eLearning

  • eLearning for Everyone

    The guiding principles around accessible eLearning come from what’s known as the Web Content Accessibility Guidelines or WCAG (in the US the guidelines for accessibility are known as Section 508). Following these guidelines will make our content accessible to a wider range of people with disabilities but they’ll also often make our content more usable to everyone in general which is really what we need to be thinking about.

    As I travel around the country delivering Storyline 2 training, I usually ask whether people are factoring in accessibility in their eLearning module design. From the responses I get, those working in the corporate environment either don’t know much about accessibility or aren’t required to do anything about it and for those working in government it’s something they need to include as part of the design.

    WCAG 2.0 is a stable, referenceable technical standard comprising of 4 principles and to comply with WCAG, anyone producing online content must ensure that it is:

    Principle 1: Perceivable – This means that users must be able to perceive the information being presented – it can’t be invisible to all of their senses.

    Principle 2: Operable – This means that users must be able to operate the interface (the interface cannot require interaction that a user cannot perform).

    Principle 3: Understandable – This means that users must be able to understand the information as well as the operation of the user interface (the content or operation cannot be beyond their understanding).

    Principle 4: Robust – Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

    To help remember these principles, think POUR.

    There’s also 12 guidelines that are organised under these principles and for each guideline, there are testable success criteria, which are at three levels: A (the minimum), AA (more enhanced), and AAA (advanced compliance). The guidelines and success criteria lay the foundation necessary for anyone to access and use Web content. They’ll help you to ensure that everyone can access your learning experience.

    There’s two factors that contribute to creating accessible eLearning. The first is the authoring tool itself and generally can do things like:

    • Allowing content to be navigated by using the keyboard
    • Allowing us to put alternative text on our images
    • Allowing for the screen objects to be read by a screen reader

     

    But in addition to that, and more importantly, our design decisions impact heavily on the level of accessibility (and therefore useability) of the module, for example:

    • The types interactions we include
    • Colour combinations we use
    • Fonts/typefaces we use
    • What we use for alternative text
    • The language we use and the way we write
    • The layout of our screens

    After all, authoring tools don’t build eLearning by themselves they require human input and design. So many of our decisions can impact on accessibility for our users.

    Accessibility is a big area and there’s lots to learn and I’ve certainly learnt a lot about it over the past 18 months. Here’s some resources that contain practical advice on incorporating accessibility into eLearning design (click on a title to view):

    Quick reference guide: How to Meet WCAG 2.0

    A guide showing all of the principles and guidelines and what you need to do to meet them.

    It’s Not Just About Compliance: Accessibility in eLearning by Jane Bozarth

    In this post from Learning Solutions Magazine, Jane points out that accessibility goes beyond those with disabilities.

    6 Best Practices for Designing Accessible eLearning (ebook)

    This ebook comes from Articulates E-Learning Heroes Community and provides some practical steps you can incorporate into your eLearning design.

    Do’s and Don’ts on Designing for Accessibility by Karwai Pun

    This post contains 6 posters developed by Karwai showing the dos and don’ts of designing for users with accessibility needs including autism, blindness, low vision, deaf or hard of hearing, mobility and dyslexia.

    Making eLearning Accessible for Everyone (video – 31mins)

    This was a presentation I gave at LearnX where I spoke about accessibility and some things you can do in Storyline 2.

     

    An organisation called WebAIM (Web Accessibility In Mind) has lots of useful articles and tools to help create accessible eLearning:

    Fonts

    Colour Contrast Checker

    Alternative text

    If you have any more useful resources or tips on creating accessible eLearning, please share them in the comments below.

    Crowd of people

    Image source: Shutterstock

  • Learning About Screencasting

    A few months ago David Anderson started a new type of E-Learning Hero Challenge – creating screencasts (which are short ‘how-to’ video clips). I mentioned in an earlier blog post that one of the areas I wanted to build knowledge and skills in was screencasting so these new challenges would be a great opportunity to get started.

    Another reason why these challenges appealed to me is that most of my role at B Online Learning is about teaching others – how to use Storyline 2 and the process of creating an eLearning module – so the challenges also seemed like a good fit in that regard just a different way of teaching and sharing what I know and a way to help develop my communication skills.

    Creating these short how-to videos is something new for me so these early ones were a bit rough but I figure they’ll get better over time. Anyway, here’s a few of things I’ve learned so far when creating my screencasts:

    Planning

    I’ve found that the recording works better if you plan what you’re going to record and have a run through to make sure that things work the way you want them to and you know where you want to click. I don’t have a word for word script but I like to think through what I’m going to say as I do the practice. I tried off-the-cuff but it didn’t work for me.

    Sound quality

    I record my screencasts in my office at home and I shut the door and window to reduce any background noise. Initially I found the audio still wasn’t that great but I was using an old headset with a mic. I do have a USB microphone (Audio Technica) but when I tried it, it seemed to pick up ambient noise. So, I went to JB Hi-Fi and I found a Skype Headset (it has a USB connection and a noise cancelling microphone) and I’m much happier with the quality.

    Recording Window Size

    I use Articulate Replay to record my screencasts as it came with my SL2 licence and meant that I didn’t have to buy another program. It’s easy to use and I’m happy with the output. When you open up Replay you can set the size of the recording window to whatever size you need and initially I was recording at about 1000 x 700 but I found that when I looked at the recording on a larger monitor that it became a bit blurry and I think it was because the recording was being enlarged to fit on a bigger screen? Anyway, I asked my friend Veronica (another regular screencaster) what size she used and she said was using around 1430 x 860. Hers looked cleaner so I increased the recording size and it seems to have helped in the latest recording – ‘Using Master Slides’. So I’ll keep experimenting.

    Click on the image below to see my most recent screencast and you can see all the recording that I’ve created in the Videos section of this site. Let me know what you think.

    Screencasting

    If you’re wondering about the circle animation that you see in my recordings, it’s a setting on your computer. Go to the Control Panel > Mouse > Pointer Options tab > select Show location of pointer when I press the CTRL key > Ok. That’s it!

    To see all of the screencast challenge topics, click here.

    If you’ve done any screen recording before please share any tips you have in the comments below.

  • Looking Back at 2015

    Well another year has just about come and gone and at this time of year like many folks who write blogs I like to look back and reflect on the posts I’ve written. Blog writing is a personal thing and everyone has their own style and approach which makes the diversity between writers and topics both interesting and thought-provoking. If I had to sum up where I’m at with my blogging and the style of posts I write in one word, it would be Practicality.

    I read a lot of posts and tweets that are critical of eLearning modules (some for good reasons) and I often tell people that an eLearning module is a learning solution it’s not always the learning solution. But it does have a purpose, so instead of constantly bagging it out, my approach is: Why don’t we do something about improving the standard of eLearning?

    So that’s why I like to share posts that explain how to do something and allow the reader to take something away and maybe use in their own course development. Sure, at the moment there’s a focus on using the tool which is important but I intend to expand this next year because eLearning is much more than knowing how to use an authoring tool.

    I’m learning stuff all the time so why not share the knowledge and put it back into the community so here’s my posts from the year that was, grouped by topic area. Click on a title to view the post.

    Storyline 2

    These posts are about things I’ve learned about or discovered in Storyline 2:

    More than One Way with Storyline 2 – How I updated a slider-based interaction to a button and number variable interaction.

    Template Facelift – How I redesigned my ‘Meet the Team’ interaction.

    Spinning Around with Storyline 2 – How I created a carousel-style interaction using a slider and layers.

    3 Things I’ve Just Discovered in Storyline 2 – I’d just started a new job and my colleagues made me aware of these three handy features.

    E-Learning Heroes Challenges

    These posts take a behind-the-scenes look at how I created some of my challenge demos. I used to call them ‘Showing My Work #x’ but I didn’t think it was helpful to the reader plus it sounded a bit wanky so I started to give them a catchy name:

    Pushing My Buttons – ELH Challenge #89: Creative Button Styles.

    100 Not Out – Celebrating 100 ELH Challenges.

    Bingo Time! – ELH Challenge #98: E-Learning Bingo Games.

    Making Videos Interactive – ELH Challenge #94: Interactive Video.

    Showing My Work #11 – ELH Challenge #18: Using Characters in E-Learning.

    Showing My Work #10 – ELH Challenge #52: Using Interactive Sliders in E-Learning.

    Showing My Work #9 – ELH Challenge #71: Teaching Math Concepts with E-Learning.

    Theoretical

    These posts delve into the area of information processing and cognitive load which are important areas to know about when creating eLearning:

    Designing Effective Multimedia Lessons for Learning – a university essay I wrote about the Cognitive Theory of Multimedia Learning and research-based principles that will improve eLearning design.

    The Human Memory System – a university essay I wrote about human cognitive architecture.

    Reflective

    Sometimes I just reflected and put down my thoughts and ideas. I’d like to do more of this next year:

    Half-baked Ideas – a few random thoughts that may become posts of their own in the future.

    Looking Behind the Façade – my thoughts on showing your work and working out loud.

    Evolution – about how my career has changed for the better.

    Practice and Sharing: The Keys to Success – an older post with my two takeaways from LearnX.

    Flipped Networking – about how it’s becoming more common meet people online via social media before in person at a conference.

     

    Thanks to everyone who has read or commented or liked or shared something from this site, I really appreciate it. I’d like to wish you all the best for the festive season and for the new year ahead.

    Who knows what 2016 will hold…

    Ideas for 2016

  • More than One Way with Storyline 2

    Sometimes I like to experiment with ideas for eLearning interactions and a few months ago one of these experiments led me to creating this carousel-style interaction (you can click the image to see a demo):

    Carousel slider demo

    I wrote about it here but essentially it uses a slider to show layers with each image in a different position. I also posted the demo to an E-Learning Heroes Community forum and someone asked if the same effect could be created using buttons instead. The short answer is yes and here’s how I did it.

    I started by making a duplicate of the current slider-based interaction as the layers and positions of the images are set up correctly. I deleted the slider and created a couple of buttons (one for left and one for right) using a square shape and an arrow image that I had on file.

    Button breakdown

    Then I needed to figure out a way to make the layers show (creating the spin effect) depending on which arrow was being clicked. I wanted to make the images spin in the same direction as the arrow that was being clicked.

    The solution I came up with was to use a number variable. Variables are great because they ‘remember’ information and the same variable can be used many times anywhere in your project. You can then use this information to make things happen. The slider interaction uses a number variable but it’s created when you insert the slider. For this interaction, I created my own number variable.

    First, I added my variable via the ‘Manage project variables’ area…

    Manage project variables

    …and called it ‘Count’.

    Count variable

    Then I added two triggers (one for each button) the add 1 to Count if you click the right arrow or subtract 1 from Count if you click the left arrow.

    Add to count

    Then I needed to do something with the Count information – instead of the layers showing when the slider was in a particular position, they’d now show when the variable Count had a certain value.

    show layer trigger

    Remember, clicking the buttons changed the value and so a different layer would be shown each time.

    Because you can’t keep spinning the images around and around, I added some change of state triggers on the arrow buttons that change their state when you go as far as you can in either direction. As a bonus, I also found that by using the buttons instead of the slider, it freed up some space in the middle of the slide that allowed me to add a small amount of text (if required).

    Often there’s more than one way of building something in Storyline 2 and this is another example of this as well as the power that variables can bring to your project.

    To view the updated interaction click the image below:

    Carousel

    You can access the .story file from the Downloads page of this website.

  • Template Facelift

    A few months ago I created a demo for ELH Challenge #18 which was called ‘Using Characters in eLearning’ (you can see a recap here). For this one I did a ‘meet the team’ style interaction that was based on something I’d seen a few years ago. The idea is that you have some people and some questions and you pick a person and a question you’d like to ask them, then their response is shown. You can try the demo by clicking on this image:

    Meet the Team demo

    I was happy with it originally and it works fine but I’ve felt for a while that the design could be improved because the screen is quite full and there’s not a lot of flexibility in the layout. What I mean is, say I wanted to add another person to ask a question of, I’d need to make the other four people smaller or totally move things around to fit it all in. Also, the response area is quite large and the person giving the answer is shown twice which is unnecessary. So I set about playing with some ideas as to how I could overcome these problems.

    For the people on the slide, I wanted to be able to have as many or as few as needed. I figured that using one image that had a number of states (which would be images of different people) would be a good way to achieve this. I just had to make sure each image of a person was placed in a similar position and was about the same size (there was some trial and error getting that right):

    Using different states

    Next I needed to work out a way of moving through the people. I thought of using buttons – one to go forward through the people and another to go back but then the whole interaction would be clicking. So then I thought a slider might be worth a shot. I inserted a slider, kept the design simple and added change of state triggers e.g. change the state of ‘Person’ to state ‘Person 2’ when the slider moves and equals 1 (and so on for the others states). I tried it out and it worked great. So I now could have two people or 20 and they all fit in the same space on-screen.

    Now for the questions. I left the number of questions to three as I reckon that you wouldn’t need any more than three (you’d probably use less). In the original, the space for the question was just a rectangle with a glow to indicate when it’s selected. It looked more like a button, so this time I used a caption and changed the selected state to a black solid fill:

    Question states

    Tip: I created a button set with my questions which only allows one question to be selected at a time. Doing this creates a selected state so I could then change this state to what I described above.

    As in the original demo, the responses by each person to each question are placed on layers. But this time it was a combination of one question being selected and the slider being in one of 6 positions:

    Show layer trigger

    I repeated this trigger for all the combinations, the ‘copy and paste trigger’ buttons came in very handy!

    The space where the responses are shown is still a good size and I made use of this space on the slide (base layer) by using it to hold the instructions which aren’t visible when each layer is showing:

    Instructions

    For the responses themselves, I again used a caption-style shape (it’s actually a combination of a rounded rectangular caption and a triangle) and because I placed this near to the image of the person I didn’t need to show the person twice on-screen.

    The last thing I did was to apply some colour coding to each person and layer so that there was a visual indication as to which answer belongs to which person:

    Question and answer

    Tip: You could use videos on the layers of the person giving the answers or add audio if you didn’t want to use text responses.

    If you’d like to see a published version of the updated interaction, click on the image below:

    Meet the Team Interaction

    If you like to download the source file and use it yourself, just click here.

    Overall, I’m happy with the improvements and I was able to try a few things and experiment. The new version is more customisable too. But best of all, going back to something I’d already created meant that I didn’t have to start from scratch. I could apply some things that I’ve learned since the original was created and I learned a few new things while working on the update allowing me to continue building skills.

    This template is one of a few that I have on my new Downloads page.