Skip to main content
Inspiring
April 28, 2017
Answered

"Go Back" on content in the new window?

  • April 28, 2017
  • 2 replies
  • 756 views

Hi, everyone,

I am building a "quilt" full of clickable thumbnails. I've put a click box over each thumbnail (and I've arranged the thumbnails on a large rectangle that looks like a quilt), and clicking a thumbnail takes the user to a video. This is the only way I know to accomplish this:

1. Put a click box over each thumbnail.

2. The click box's action is to play the video in a new window or tab.

The problem is that the only way for the user to get back to the "quilt" to click more thumbnails and watch more clips is to close the window of the movie they just watched. While most younger users may understand this, I am designing this for some folks who may be older. They are likely to click a thumbnail, watch a movie clip, and not know how to get back to the quilt.

Is there a way to put a "go back" on the movie clip they are watching? The clips were edited in iMovie, if that makes a difference. As you can tell, I have limited design experience, just fyi, so I won't have the background to understand if your answer involves coding or something like that.

Thanks!

Kris

    This topic has been closed for replies.
    Correct answer Lilybiri

    Which version do you use? Is it a normal or a responsive project?

    Personally I would put the thumbnail images in a shape button to avoid having two objects (click box + image), but that is off topic.

    I really think that the easiest way would be to have each video on a different slide and use the click box (or shape button) to navigate to that slide. You can use a dedicated master slide for those video slides, on which you have a shape button (no other interactive object is possible on the master slides) that triggers the action 'Jump to Slide' and navigates back to the quilt slide. Label that shape button as 'Back' or 'Back to Quilt' and everything will be very clear to the users. No coding, not even advanced actions. Make sure that all your click boxes (or shape buttons) have their pausing point at the same time.

    2 replies

    Participating Frequently
    April 30, 2017

    With respect to your video display issue,  what I think you are looking for is a way to overlay the video in the same window as your "quilt"  The widely used convention is the equivalent of a "light box" where the background is greyed out,  the video is centered and a "dismiss" button ( typically an "X") is displayed in the top right corner.  when one hits the escape key,  it  also disappears.   

    I haven't tried to implement this directly in Captivate, but is of course is doable in JavaScript.  

    Not sure about Captivate 8,  but in 9 I think what you are looking for is the "insert media" -> video object.  If using adavanced actions, you could have one of these objects per video and have them all start hidden.  At the right time,  you could display the right video object using an advanced action. You could also create a grey filled shape object that sat in front of your quilt but behind the video objects that had a trigger to hide the videos and the grey shape itself.    with advanced actions,  there would be some tedium as you'd need to signal to hide all of the video objects one by one. 

    Lilybiri
    LilybiriCorrect answer
    Legend
    April 28, 2017

    Which version do you use? Is it a normal or a responsive project?

    Personally I would put the thumbnail images in a shape button to avoid having two objects (click box + image), but that is off topic.

    I really think that the easiest way would be to have each video on a different slide and use the click box (or shape button) to navigate to that slide. You can use a dedicated master slide for those video slides, on which you have a shape button (no other interactive object is possible on the master slides) that triggers the action 'Jump to Slide' and navigates back to the quilt slide. Label that shape button as 'Back' or 'Back to Quilt' and everything will be very clear to the users. No coding, not even advanced actions. Make sure that all your click boxes (or shape buttons) have their pausing point at the same time.

    Inspiring
    April 28, 2017

    Thanks! Yes, this is working. I am using Captivate 8 and I chose responsive project because many users will be using tablets or phones.

    I will use images because this is for a local animal shelter, and the pics will be of successful adoptions. People can click on the pic of the cute labrador puppy, for example, and see her adoption story, which will be a brief video of the puppy playing in her new home or whatever. Then they can go back to the quilt and keep watching other clips.

    I just graduated with a master's in instructional design, and I'm building a portfolio of something that's more than just homework assignments. I asked a local shelter if I could construct this for them on their website, and they said yes. It will be my first "real" client project--although I am doing it for free at this point.

    Anyway, thanks again!

    Kris

    Lilybiri
    Legend
    April 28, 2017

    Responsive? OMG, in that case I strongly recommend to replace the click boxes over images by shape buttons filled with the image. It will save you a lot of time and frustration, because having to keep them together on all devices is really a pain that can be avoided that way. Have a look at my article:

    Turn an Image into a Button - Captivate blog

    Do not underestimate the extra time needed to create a responsive project! At least double the time needed for a normal project. Less objects will make it a lot easier.