Need an idea for this type of interaction

Hi Jigar!

I'm quite new in using the wonderful Articulate software, Storyline 360. I would say I'm enjoying it immensely. So sleek and powerful!

Looking at the interaction you shared, I see that we may use the principles of States, Layers, and Triggers as discussed in this tutorial to achieve the desired outcome.

Allow me to create a story file to demonstrate this. I hope you will find it helpful. Please give me a moment, and I will upload the file.

Thanks!

Eric

Thanks, Eric for your reply, I will appreciate if u demonstrate this. It will be very helpful to me thanks :)

Please find attached story file, illustrating how we can approximate the interactions you shared using Storyline triggers, states, and transitions.

I tried to use the same objects and color schemes in the sample interactions, but used a different transition. Pardon the crudeness of some of the objects in the slides as I needed to take screenshots of some of the objects in the sample to be able to approach a similar look and feel. The hover effects may take more time to duplicate. But I think you'll get the idea on how we can achieve it.

Kindly let me know if you have any questions or concerns, I'll be happy to assist further.

Cheers!

Hi Eric i saw your demo and I m very thankful to you, u have created multiple slides, I want to do this in the single slide with the help of layers and with the same transition, also I need to know how it is possible to have transition on push up when we press down button and push down animation when we press up button.it will be very helpful if u do favor to me.

I'm happy to contribute some ideas!

But the transition in the sample interaction needs more research to replicate.

I tried using Push transition (same with the sample), but the issue I'm having is I cannot replicate the effect where one slide can either have Push-from-top or Push-from-bottom transition - depending on whether the previous slide came from the top or from the bottom.

We can define a transition per slide, but currently I don't know a way to set a transition depending on a certain event or condition.

There is a trigger action called 'Execute Javascript'.

I think this is the key to our dillema  :)

I'll do some more digging on the matter, will let you know what I can find.

Thank you!

Yes, Eric, you have figured out what I need, I will look forward to your reply. Thank you. 

There is no option to trigger different slide or layer transitions via button clicks. Here is a blogpost that describes a possible workaround. It's for a horizontal nav and was done in SL1, but the concept still applies. Here is an example. I guess you could also try up/down motion path animations and execute them, depending on which button is clicked.

Searched for this in E-learning heroes, and there are suggestions to achieve this using duplicate slides with different transitions.

I'll update the story file, see if we can achieve it this way  :)

Be back soon.

Just saw this reply.

Great suggestion, Michael!

Thanks  :)

You may also want to consider this approach, Jigar.

The trick was to duplicate the middle slides. One of the duplicates has a Push-from-top transition, the other one has a Push-from-bottom.

Attached the updated story file.

I have already thought of duplicating slides this way. Yes, That's kind of appropriate for what I need but in this method, I have to duplicate each slide and that's a bit awkward to me is there any other way to do this without duplicating slides?

At the moment duplicate slides or layers is the only way to do it/