Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document the initial animation #967

Open
digitall-it opened this issue Apr 4, 2025 · 3 comments
Open

Document the initial animation #967

digitall-it opened this issue Apr 4, 2025 · 3 comments

Comments

@digitall-it
Copy link

Is your feature request related to a problem? Please describe.
The current site animation looks pretty complex, it seems to use looping animations and 3D objects.

Describe the solution you'd like
I would like a tutorial on how it is done in the documentation.

Describe alternatives you've considered
I tried to reverse engineer it via browser tools but it was a bit difficult to do.

Additional context
The loading, presentation and animation of a 3D object is a bit unclear to me

@juliangarnier
Copy link
Owner

Hey, I don't think a tutorial for something that complex should be in the documentation.
But I'm actually thinking about making a course that would basically teach how to recreate this page from scratch, would it be something you're interested in?

@digitall-it
Copy link
Author

If the course directly funds the development of the library I think it may be interesting, especially if it contains more than one fully formed project (from the generation of assets to usage, unit and field testing, and so on).

@juliangarnier
Copy link
Owner

If the course directly funds the development of the library

Yes, this is the idea, I'm still trying to find a way to make this project sustainable, and by seeing so many people asking me how I made this page, making a course is currently high on my list.

especially if it contains more than one fully formed project

I think the landing page can be the backbone of multiple lessons, going from laying out the HTML structure of the page for the main scroll animation, to animating shaders and 3D meshes. I used almost the entire API of anime.js on this page, so it's a perfect project to learn the lib.

(from the generation of assets to usage, unit and field testing, and so on).

That's actually where I'm still not sure how far I should go, especially with the 3D scene, since before getting anything animated, you need to create the 3D models etc...
I used a paid software for creating the 3D model, so not ideal for educational content, but maybe I can skip that part and start with the models already done and suggest other ressource to learn how to make 3D models or simply download free ones?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants