Preview/tease "page turn" with javascript?

Is there a way to preview, or more specifically tease, a “page turn” scene transition?

Say I have two or more scenes and on mobile and I want to indicate that you can swipe to the next scene by having Hype briefly tease the “page turn” animation about 10-20% of the way, and back again (optimally with a bounce animation)

Is there any way, with code or otherwise, to achieve this in Hype?

the easiest and without coding:
take a screenshot of the next scene and animate this screenshot …

good old handmade :slight_smile:

1 Like

Yes funny you should say that. I just tried it out and it works pretty well. (pretty easy with the “capture current scene” tool)

But the thing is I am trying to make a template for another designer, so something that require less hand-work would be prefferede :slight_smile:

You can do it with code. But that requires a bit of JS knowledge. Take the custom transitions template to start... take a look at this

There’s no built-in ways… you may be able to fake javascript mousedown, mousemove, and mouseup events. (I haven’t tried this though!)

Here you go. It’s based on the mentioned transition template

The code portion I edited is minimal and contained in this section(top, left positions and durations):

Hint: I used the keyword this. Even though it shortens calls you got to know your scopes to use it well. You can also just replace it with hypeDocument