Two ?s: tracking progress & creating hotspots
May 08, 2015
Hi,
I'm hoping someone can help or point me toward tutorials as I try to hash out two issues with a Storyline project.
The first issue: I'd like to award stickers to learners when they complete each section, and show them their sticker sheet so they can see their progress. I'm sure there's a tutorial for this somewhere, but the only things I've been able to turn up so far have been about keeping a numerical score. Help? :-)
Second: we have an exercise where we allow learners to move shapes on top of each other to create a goal image. However, whenever we make the transparent pngs of the shapes into interactive objects/hotspots, the entire rectangle of the transparent image becomes live, not just the visible shape itself. This causes confusion when the shapes overlap and clicking on one shape picks up the invisible rectangle around another shape. I tried breaking up the images into smaller images but once they were grouped together, the live area was again a too-large invisible square. Is there any way to make this work, short of drawing the shapes using Storyline's drawing tools? (We'd rather avoid that since the results tend not to be very attractive.)
Thank you for any help or pointers you can supply!
9 Replies
Hi AJ,
The first issue sounds like something you'd want to talk to your LMS about in terms of tracking their access throughout the course and any set up in terms of how they're tracking the course and then able to share the results with users in terms of a sticker or similar.
In regards to your second issue, there isn't a way to force only the visible area, or clickable area to be seen - the entire border/outline of the image becomes active, so if you needed to only use a set portion you may want to look at editing the image in another program and adjusting that to reflect the clickable area.
Hi Ashley,
Thanks for your response!
I'd prefer not to rely on an LMS to make this work. Everything I want to reward and track is all in one Storyline file; is there any way to make it work using variables or other Storyline functionality?
For the second issue, could you suggest another program that would let me edit the image in the way you describe?
Thanks again!
Hi AJ,
You could show it within the Storyline course, using a basic quiz and results slide perhaps? The stickers could be assigned as a part of the results slide - so you may want to begin by reviewing the information here on using results slides.
I'm not an image/photo expert, so I wouldn't know of another program to use outside of the standard ones discussed such as Photoshop. You may want to search for some free programs or something that would fit within your budget.
I'm a little confused how Photoshop would solve the problem I'm describing. I can make a transparent gif or png in Photoshop that only shows the shape I'm trying to display with the rest transparent, but when the image is made into a hotspot, the entire image is live, including the transparent parts. Are you suggesting that I use Photoshop to create some kind of vector shape?
Hi AJ,
Since the image still includes transparent elements, Storyline will pick that up as a part of the area to click on. I'm not well versed in editing photos, but if you could create a customized size to just include the visible elements that's what I'd look at importing into Storyline.
Can you use a freeform hotspot and have the actions trigger off that instead of the image?
Hi Michael,
I'm not sure if you're suggesting this as a solution to AJ or as a question...but you could associate triggers with a hotspot - such as the user clicking on it or the user hovering over it.
Sorry. Yes, I was suggested it as a solution.
No worries - just checking. ;-)
This discussion is closed. You can start a new discussion or contact Articulate Support.