Template for spot the mistakes, differences etc
Sep 10, 2012
Hello fellow storyliners,
We are currently working on quite a big mining project, and that forced us to think about ways of working smarter. One of these way is to make internal templates we can re-use for different clients/projects (or even within a project).
We have one specific case in which we want to use a kind of 'spot the mistakes' scenario. In this scenario, a couple of items will pop-up (little more subtle than the piggies I have inserted now), embedded in the timeline. The goal is for the user to recognize and click the correct 'mistakes', or in our case: hazards.Things that are correct don't need clicking, and the user will be penalized for that (that's currently not included, but very easy to make).
I have added also counters, and a feedback layer. I haven't worked in design and kept the exercise itself basic.
I would very much like feedback about this template: do you guys think I can improve certain things, can we maybe use this for different purposes by adding elements?
The template is free to use for others, I've added an 'how-to' text slide. Please let me know if there's anything I need to elaborate on.
Thanks!
Marc
8 Replies
Hi Marc,
Welcome to Heroes. Thanks for sharing the template. Hopefully others will get a use out of it.
Very much appreciative,
Adrian
Hey Marc, that's really cool.
I like the idea of using moving, fading targets. I was helping someone the other day who was trying to create something similar using two photos or illustrations.
The images were placed side-by-side and learners were asked to recognize differences. Using your example, I did a quick mockup:
Demo
Source
I really like your use of progress meters to track correct and incorrect attempts.
Great example!
Thank you!!
Hi David,
That's really neat! I'm going to use that in future modules.
One thing that I added in other projects (ill post some in the next weeks) is to add an extra hotspot (invisible) between the background picture and the objects. This will disable the mouse going back to 'normal' (i.e. pointer instead of hand), this way the user really has to guess where things are located (otherwise the hand will give it away)
in my example above I have triggered that invisible hotspot to the 'false' response counter.
ciao!
Hi Marc,
Would you mind posting your updated example with the extra hotspot preventing the hand from appearing? I'd love to see that.
Hi Jamie,
Sorry I might have mis-phrased that: Instead of preventing the hand from not appearing at all, the extra layer makes sure that the hand icon constantly appears. I could check if there is an option to disable that, the trick is just to do it on all clickable objects.
I'll see what I can do
Ciao!
So in essence, you're putting a clickable object behind the correct clickable areas and just having it do nothing except act as an object that can be clicked?
Well, the area behind the clickable objects also serve as an input for the 'false' counters, so every time you click on that zone, an extra red button will be colored
So to summarize: it serves two functions: one to make the hand not look like a normal mouse pointer when the user moves from a correct item to the 'rest' of the scene, and two: to catch false click
This discussion is closed. You can start a new discussion or contact Articulate Support.