ELH Challenge #179: Learning a Language

When I was an English teacher (11-16 year olds!) my main “competitor” was definitely the Latin teacher who had the classroom above mine, who taught using Cambridge University Press’s famous Latin books. There was something about the continuing ongoing story of a Pompeiian family that really grabbed my students and led to all kinds of in-jokes. Apparently the books are something of an institution, having been used since the 70s. There’s even a Doctor Who episode which seeks to remedy the inevitable fates of the characters when it’s time for “volcano day”!

When I remembered that the books are available online in PDF form now (You can find the first one here!)  I knew that I had to use them in this week’s challenge.

The demo below uses hotspots and triggers to play audio when characters are dragged into a particular area of the screen.

There weren’t any suitable backgrounds in the book so I broke out my graphics tablet and tried to draw something in a similar style and add some watercolour paper overlays to match the tone of the original 70s illustrations.

The audio is just Google’s voice for Latin text-to-speech, and I really couldn’t comment on its accuracy (pretty sure it’s normally Kai-killy-us not Kai-chilly-us.)

Click the image below to play!

latin

#ELH Challenge 177 + Tooltip Template

Another week, another excellent Elearning Challenge, this time on tooltips, hyperlinks and explorable explanations.

The term “tooltip” originally comes from the early days of applications like Microsoft Word and Paint, where users were greeted by toolbars full of unfamiliar icons. Although the FUN way to work out what everything did was to try every button out, the quickest way was to hover your cursor over the item. A small hover box would appear giving you information about that item without you having to try it out.

(I’m using past tense, but of course tooltips are still everwhere! )

Tooltips in Photoshop, 2017

Tooltips in Photoshop, 2017

For this week’s challenge I decided to take a passage from an encyclopedia and add in tooltips to provide nuggets of additional information.  With websites like Wikipedia I’ll often find myself getting lost as I branch down different pages. One moment I’m reading about the Royal Albert Hall, a few hyperlinks later and I’m reading about the island of Grenada (…it’s true!) With tooltips, it’s easy to get small nuggets of information which add to understanding without taking you too far away from the original topic.

Here’s my example which is all about the mysterious Mechanical Turk, a bizarre and fascinating episode in the history of computer programming:

mechanical turk.jpg

Get the Template

If you’re interested in taking a peek at the Storyline 2 file and adapting it for your own purposes, I’ve created a template which you can download here.

The future of tooltips?

The big problem with tooltips, of course, is that you classically need to be able to hover a cursor to use them – something you can’t really do if you are using a touch screen. It’ll be interesting to see what happens to tooltips and hovering interactions in general in the future. Are they on their way out?

If you’ve enjoyed this or found it useful, do let me know in the comments and find me on Twitter and LinkedIn! 

 

Cells – Now with More Words!

A couple of weeks ago I took part in ELH Challenge #176, creating a course about cells which only used the 100 most frequently used words in the English language.

I liked it so much that I thought I should probably create a version which uses actual terminology, so here it is!

I’ve tried at aim it at an early secondary school age group, since that was when I remember having to learn about cells at this kind of level.

cellsimage3

CLICK HERE TO VIEW THE DEMO

Cells (Using Small Words to Explain How Complex Things Work #176)

This week’s elearning challenge is to design an elearning course explaining something complex . As a long time fan of Randall Munroe, whose book Thing Explainer inspired the challenge, I had to give this a whirl!

I decided to step back to GCSE biology and create a mini course about cells. Mostly because for some reason, “cell” is one of the 1000 most used words on Munroe’s list. Although frustratingly, the word plant isn’t.

wednesday

CHALLENGE ACCEPTED.

Since the challenge was mostly content based and I always like to try to explore a new aspect of Storyline with these challenges, I decided to focus on making the transition between slides as interesting as possible without being distracting. I ended up using the push transition alongside a few animation tricks to make it seem like the learner is visiting different parts of a single scene.

cellsimage2

VIEW THE DEMO HERE

As a bonus which I didn’t end up using in the course, here are all the things an organism must do in order to be considered alive (in only the most used 1000 words, of course.)

  • Things that are living can move.
  • Things that are living can make more things like them.
  • Things that are living can feel other things around them. This could be through seeing, hearing, smelling, touching or in other ways.
  • Things that are living can get bigger by growing more of the blocks that make up living things – cells.
  • Things that are living can get power from their cells. Humans do this by breathing.
  • Things that are living can throw away bad stuff inside them that they don’t need.
  • Things that are living can get power from outside. Humans do this by eating. They can use this power to get better if they are hurt.

Random Number Generator

A little blast from the past. Before the random fortune teller and the random word generator, I started out pairing together Storyline and Javascript with this simple random number generator. It creates a whole integer between 1 and 10.

randnum

Click here to view

How to do this:

  1. Create a variable in storyline called “randnum”
  2. Add a trigger to execute Javascript when the generate button is clicked. Enter in this Javascript:

var randomnumber = Math.floor((Math.random()*10)+1);
var player = GetPlayer();
player.SetVar(“randnum”,randomnumber);

3. Add in a reference to the storyline variable (%randnum%) where the random number will be displayed.

Easy peasy!

Time to Draw, Version 2!

Earlier in the week I used Javascript to create this random drawing prompt generator!

I shared it around social media and it took off more than I expected it to. I got a lot of feedback suggesting that it would be good to have the facility to draw in the web browser.

The only way I could think to do that was by embedding a Flash object, and since I’m no expert I decided to use the code and assets from this really comprehensive tutorial.

Here is the new version:

shyclown

But you don’t want to look at my art!

Not when I’m about to share the great pieces that have been made based on Time to Draw prompts!
I’ve tried to put links to artist’s websites where I could find them. Click on the image to see more of the artist’s work.

9jssfh6

tumblr_otb1m2hkjc1wtm8d9o1_r1_1280

A giggling dragon with a tiny birthday cake

 

mydrawing_by_timelapse11-dbgtphx

A short ghost with a beautiful hat

limpcat

A blue teacher holding a limp pet cat

Fun, fun, fun! If anyone has any more to add, let me know!