Forum Discussion
Need help
I am creating a course on performing a diagnostic test using a microscope. In the course, I will have an image of the microscope slide and I want to make it realistic by having the image start blurry and then come into focus using the fine focus on the microscope. Is there a way to make a photo go from blurry to clear, I cannot find an effect, animation, or trigger to make this happen. I tried changing the state from a blurry picture to a clear picture but that didn't work either. Thanks!
One option would be to cross fade the blurry pic and in-focus pic on the timeline. In other words, have the blurry pic fade out while the in-focus pic fades in. If you need that to happen when the user clicks something, a trigger could pause the timeline just before the cross fade happens, and then another trigger would resume the timeline to allow the cross fade to happen.
Or the pics could be on different layers, and triggers could hide or show the layers as needed.
Or you could animate a change between a blurry state and an in-focus state. This post is about how to do that: https://community.articulate.com/discussions/articulate-storyline/tip-animate-the-change-between-character-poses-photos-or-other-objects
You could even have multiple states, from really blurry to in focus, and trigger the changes by turning a dial. For that, triggers could change the pic to a given state when the dial variable changes based on the value of the variable.
Here's more info from User Guide:
- https://community.articulate.com/series/articulate-storyline-360/articles/storyline-360-working-with-the-timeline
- https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-add-and-edit-states
- https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-work-with-dials
- https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-work-with-triggers#conditions
- https://community.articulate.com/series/articulate-storyline-360/articles/articulate-storyline-360-user-guide-how-to-work-with-variables
See this thread for some ideas. Look for my entry for an example of a way to do an adjustable blur. You really only need a couple of lines of JavaScript to read a variable and apply a blur to an image.
https://community.articulate.com/articles/blurred-backgrounds-in-e-learning-course-design-366
