Having recently had to change hard drives and re-load all my software I had my first chance to upgrade to Adobe Captivate 2017. With all the talk in e-learning about fluid boxes that had to be my first stop. I have to say it was quite easy to get my head around designing with these boxes and handy when duplicating slides to stick with layouts and themes etc The break points bar was an improved feature too.
I wanted to keep this example short and sweet (think micro learning) a quick google and wikipedia and voila! A photography 101 on the rule of thirds
Quick turn around
I set myself another challenge to see if the fluid boxes speed up the design to delivery stage. In short yes they do
Time taken from concept to finish
Approx 1 hour
View it here: https://goo.gl/mVAqZp
If you’ve seen a movie or watched t.v. in the last twenty years you’ll be familiar with the production or channel video intro’s before the actual viewing.
The Creation/ Inspiration
I’ve been playing around with html5 animations recently to put in my e-learning courses. Then the idea came to me about creating my own intro video. The movie Trainspotting has a great intro sequence made to look like your stood in an underground tube station as a train whizzes by. THAT’s the look I was after
Once I was happy with the html5 animation I had to find some music to put to it the excellent http://www.freesfx site has a good selection of piano snippets to choose from but one stood out.
Check out my efforts below
E-learning Heroes Challenge #105
This week’s challenge was to find creative ways to show dialogue in e-learning. Which lit my creative side
I had plenty of ideas for this challenge but I had to whittle it down to one.
Ticker Tape – scrolling dialogue at the bottom of the screen
Translation – Two sentences in different languages
Subtext – Speech bubble for dialogue. Loose text for the thought.
But the winner was
Subtitles- The type you see on T.V. for the hard of hearing.
I set myself an extra challenge which was to shrink the working area by using a mobile phone template. With space at a premium the dialogue had to be snappy. A busy workplace setting sprang to mind. I used text and audio to set the scene.
I coloured the text for each character to help the reader identify who is saying what and used left and right placement to reinforce this.
Having the text pop-up also helped with identification and reading.
Click the image below to view the sample
This post will show you how I created an interactive elearning module from a fairly dry and overlong Powerpoint Deck.
To view the finished sample: http://chilp.it/9b90c7f
The source deck
I found this Powerpoint on the web and thought it could do with some TLC. The presentation is 65 slides on health & safety in the workplace. The subject matter is important but the style and design of the presentation had me sliding down my chair at around slide 30.
I took the main information from the aim of the deck (awareness of hazards in the workplace) and started to design an interactive module. PowerPoint delivers information a linear fashion, but I wanted the learner to have choices on how to view the course information, but NOT to skip any. I used Adobe Captivate to create this decision branching effect.
The development tools
I wanted to keep the info and some images in PowerPoint then use the interactive power of Adobe Captivate to create an engaging learning experience. I customised a Powerpoint template from the excellent Elearning Heroes community. I added the following elements from within Adobe Captivate
Text to voice
Insert a You Tube
Drag and drop
This is a lot to add in to a six slide module, but I wanted to show how you can ‘lift’ a boring slideshow into an interactive and engaging elearning experience.
view it here : http://chilp.it/9b90c7f
Re-using Powerpoint slides when creating elearning can be a valuable way of saving time and reducing costs, especially when you’re on a deadline. This is especially true if your course requires some animation or motion paths to liven up your content (and which Instructional Designer doesn’t want to do that!). I also think this is a particular handy way of setting common themes for modules within an elearning course. The learner gets used to seeing the animation but is not bored by it as it has changed.
I’ve done a short screen capture explaining how quickly animations and Motion Paths can be changed for reuse.
Click to see You Tube video
The excellent Articulate elearning community was set a challenge #95 to create a video background for an elearning course. I looked at the awesome examples done by the community and was inspired to have a go myself.
One of the videos entered was a cinemagraph. (A short GIF type video that repeats. But you can set only part of the whole image to move and freeze the rest) This is what I wanted to create
I wanted to do something original and I am currently creating a course for a local business forum and decided to incorporate the cinemagraph of a local market scene. The shoot went perfectly coming back with a few decent choices. I used a Canon digital camera that can shoot movies and a tripod (which I heartily recommend). I wouldn’t set any auto-focus either you lose the first few seconds whilst the camera zoom settles down.
This was the fun bit, selecting which portion of the image to freeze and which to move and repeat. I recommend having a bout 7-10 seconds as you want the viewer to find what NOT moving and what is and then take in the effect.
Here’s my attempt
Hi, creating your own infographics when creating an e-learning course gives you great creative freedom. You will no longer have to waste time searching through stock catalogues to find a suitable image that fits what your trying to get across.
Click image to view the You Tube
With all this in mind I’ve created a short You Tube video to share how I created my own infographics using the excellent Libre Office Impress.
Libre Office Impress!
Yes, most Instructional designers will use Microsoft’s PowerPoint. But Libre Office Impress has much of the same functionality and after viewing a few other You Tubes, you don’t have to press as many keys to get the same thing done.
I hope you enjoy the tutorial
This morsel of a post was inspired by Articulate’s excellent weekly e-learning challenge #77 which was to communicate using visuals only, no words allowed. Accepting the challenge, I quickly decided I could utilise something from the most popular visual communication; art. Inspiration for the actual finished sample came from a popular t.v. game show ‘Catchphrase’ which uses visuals to convey information and the famous Dutch painter, Van Gogh, whose surname I could spell out using two visuals. Universally Understood In order for this type of information to be effective there has to be a level of understanding of the image being used. If you don’t know what a speed sign looks like, you’ll never know what the maximum speed is, for example. This is why I choose these examples, art is a universally understood communication and Van Gogh is one of the most famous painters’ whose work is easily recognised. The slides The intro slide practically worked itself out. I decided a simple Drag and Drop interaction would aid engagement and ‘buy in’ to the art theme. And the completion of a word using letters and an image would give the learner a quick reward challenge, which always increases engagement. The second slide would see the quiz factor cranked up, turning into a fun art quiz without words. Can you see a famous painter’s surname in the image below? Hope you liked what you saw and get inspired to visualise more for your next project.
This morsel of a post came about when I was creating a E-learning Heroes challenge (Help learners polish their grammar #75). I wanted to visualise a sentence to help the learner understand the power a comma can have on its meaning.
To enhance the learning experience I wanted to play a sound and move a graphic simultaneously.(Move the fly and play a fly buzz). I needed to create an advanced action that played the audio and ran the motion path effect. Here’s how you do it.
To accomplish this you:
- Create the motion path: Select the object/ Right-click/ select Apply Effect/Add Effect/ choose your effect and save the xml file.
- Create the Advanced Action: If you’re new to Advanced Actions have a look at https://helpx.adobe.com/captivate/using/advanced-actions.html
- Insert the effect in Advanced Action: In Action choose Apply Effect/ choose the object with the motion path/ on the drop down Select Effect menu choose Custom/ now select your saved XML motion path.
- Save the Advanced Action and insert into your chosen object
Here’s what my sample looks like: (Click on image to launch)
Advanced Action sample
This morsel of a post was inspired by the Articulate community’s weekly elearning challenge to create a Math(s) based game.
For this challenge my inspiration fell at my feet as my daughter was born November 23rd (11/23) I had to chose the Fibonacci Sequence (1,1,2,3,5,8..)
I took an image that has the ‘golden spiral’ and turned it into a jigsaw. This involved using my preferred image editor GIMP (an Open Source alternative to Photoshop) and I cut out the pieces to the exact Fibonacci size (13,21,34)
The next step was to turn these images into a jigsaw using Adobe Captivate’s drag and drop feature and creating individual actions that reveals the next number (13,21 and 34) of the sequence when placed (dropped)
Lastly an action for drag and drop was needed to show the complete image when the last ‘drop’ of the jigsaw was done.
This was a fun exercise for me and done in the shortest time for an Elearning heroes challenge.
Have a go at the sample below