Variables and Slider Working Together

I also participated in the ELH Challenge #186 with the new Pantone color for 2018. I decided that as part of the challenge, I would feature a Christmas tree with purple ornaments and the background is the new color. I then connected each ornament to some information about the history of the color purple and its various shades. I included in a custom tab Credits where I found my images, video, and history information.

I wanted to have the tree images turn as a slider moved so the right or left side of the tree is shown. I have a purple ornament someplace on each area of the tree as the image moves right or left by the slider. 

I also wanted a way to show the participant that there were 8 ornaments and as they discovered each one they would know how many more there were to go. Each ornament connected to a slide by a lightbox trigger with a different piece of history. I also changed the state of the ornament to disabled so no one could “cheat” and get to the number 8 with only a few ornaments. 

I have used sliders before to show a participant information, but I did not have a way to make them at least open each link. All they had to do was slide to the end and they were done. Connecting each one to a variable and make the Exit button conditional, I realized I at least held the participant to being honest in clicking the ornament. Maybe they did not read the history, but they could not just slide through. 

I also placed a shape on each layer that corresponded to where the slider needs to stop. I knew the participant needed something to help them know where to stop on the image and then search for an ornament. 

I also learned something I did not know about sliders. Since I wanted a vertical slider, I learned that I needed to create it horizontally first and then turn it to the vertical position. When I drew it vertical in the first place, it had a very odd shape and I could not move the slider in preview mode. 

I was also interested in how to put a specific color in a Storyline project. The website for Pantone gave the various codes for the Ultra Violet and corresponding colors and shades. I created a blog post that demonstrate the two methods I used including using the HTML code and the eye dropper approach. 

Last but not least, I am including a link to the story file in case you want to download it and see how this all works.