X-ray effect


I'm doing a 'sustainability' (environmental) course and want to do something a bit different when it comes to getting people to think about recycling. Basically I want an image of a typical kitchen style trash can,  I'd then like learners to use x-ray style glasses to look at the contents of the trash can i.e. I'd need to show other images (of recyclable items) contained within the bin. I then plan to use a simple drag and drop interaction whereby the learner removes the items that could be recycled.

I have limited picture editing options (Pixlr, Powerpoint 2003, Paint and Office Picture Manager)...

Are there filters that I could use to achieve this effect or is it something I could do in Storyline using states, or a combination of the 2?

Any help much appreciated.



12 Replies
Greg Cannon

hmmm...well I had a go using an "invert" filter in Pixlr. I also used a colour pick/replace function-thingy to make the inside of the bin visible (kinda). 

I then inserted the inverted items into the transparent bin and set this as a state. When you click on the x-ray glasses the state of the original bin is triggered to change to x-ray and hey presto. We have an x-ray sort of effect. 

I think it just about works ok but does need some polishing. Any ideas from the community much appreciated. Story file attached so you can see what I've done...

Christine Hendrickson

Hi Greg,

First, love the idea! You could use layers for the "X-ray" vision. You could also use shadow effects, adjust the brightness or transparency, etc. to add to this view, for a little more adaptability and custom appearance. 

I put together a very quick example and attached it. Please keep in mind that it's nothing fancy

Greg Cannon

Thanks. I stumbled across 'invert' and it seemed to do the job quite nicely. Am having to tweak it so that the items in the bin are drag-able. When added as a 'state' they don't appear in the timeline so am unable to use them as interactive elements. Have simply added them to the main slide and set initial state to hidden. When the learner clicks on the x-ray glasses now I simply change the state of the bin to x-ray and the state of the rubbish items to normal...

Mike Enders


I got stuck on the 3-D glasses visualizations...so went in a slightly different direction with a scanner motif.  But you could adapt it to your needs.  Basically uses a layer to animate a "scan" and triggers state changes in base layer objects.  File attached.

It's a quick rough out, but hopefully it will spark some other ideas.