Looking for the best preloader-screen technique


(Oliver) #1

Hello guys,

I’m looking for a technique to create a fake loading screen. I already spotted the thread about real loading screens, but I need a loading-screen-dummy that shows up even if the content is already loaded.

Action: User clicks on button

Scene 1: The whole scene is fading to 100% white. In the background: The old scene
Scene 2: Loader-Animation
Scene 3: 100% white is fading away. In the background: The new scene (link-target).

My current approach as a beginner to link from webpage 1 to animation to webpage 2:
When the button gets clicked, the timeline “loader” will start. A white layer will fade in and the animation starts.
At the end of the animation I set a timeline action that links to webpage 2. On webpage 2 I recreated a timeline that is basically the state of the last animation keyframe and made this timeline “on scene load”.

I don’t like about this

  1. I’m not able to use this animation between new pages (Let’s say: Webpage 5 to Webpage 6) without recreating the whole thing.
  2. – just solved this problem myself –
    Here is the file:
    Fake-Preloader.zip (21.1 KB)

Thanks for feedback!


(Oliver) #2

I learned a lot the last days, but I still did not figure out how to solve this problem.
Thanks for helping! :slight_smile:


#3

You’re welcome :wink:

fakeLoader.zip (50.1 KB)


(Oliver) #4

Hey Dbear,

Thank you for creating me this template!
I finally had the time trying to apply your code on my scenes.
Unfortunately I am not able to apply it on my project.
Your technique requires buttons with class names, but I need the preloader triggered by a timeline action.

Is there a way to fake a click on a button through a timeline action to make the code work without a click event?

Cheers,

Oliver