Experimental Animations Comic style

Animation
1

Good morning everyone, I hope my topic is in the right place. I'm working on a project that combines design in ΙnDesign, In 5 plugin and Hype animations and interactions. Doing research on similar projects, I saw this
https://www.carlosvk.info/andeansky/page-01.html

I wonder how easily we can do something like this in Hype.
So I have 2 questions for the moment...

  1. I can display images or blocks action by doing mouse scroll down?
  2. When a block is displayed how the action is activated at that time and not from the top of the page?

Let me mention that my knowledge in programming and coding is minimal...but i am a good designer!!!

2

Hype offers the behaviors for enter and leave regarding the viewport.
so yes, you can start animations using those behaviors

more advanced ... @MaxZieb had a project on this topic: Hype ScrollKit (Scrollama, Intersection Observer and more)

1 Like
3

Yes, that is actually an ideal extension for a project like the one seen in the link. Haven't thought of it for a while. Needs more documentation.

1 Like
4

Documentation from me? Give me some time to check your files guys and I will be back. Thanks for help!

5

Hi again. I'm trying to understand (and I think i do) the concept of use of timeline in this example. Normally it should go back and forth with my mouse wheel scroll. In my example it doesn't revert to the first image. Why?
MouseRunOn Load.zip (1.6 MB)

6

Probably are the places where the code says:

hypeDocument.currentTimeInTimelineNamed('Main Timeline') > 2

Specifically where this code came from was only allowing scrolling in reverse to the 2 second mark, and no earlier time. You could change that to a 0 or perhaps in your case a 0.76666 (since the animations start at frame 23 of 30).

7

The code is not using Scroll Kit, but code from Bjarne Bülow.
It reminds me of this approach:

1 Like
8

Thank you both. I will work on the example of Max and I come back with possible questions...