The project is finished

Changes made:

• Made intro cards responsive
• Made all players section same and more responsive
• Made hof cards responsive
• Made popping animations better
• Fixed gapping issue between hof cards
• Added highest world ranking of second and third players
• Added favicon

I thinks that’s all. I really loved how this website turned out to be. If someone’s reading this. Hope you’re have a great day. ♥✌

The ui got better. Yay!! I have majorly worked on the first-player ui. After writing this devlog I will be making the second and thiird player ui same as the first-player. I really like the dash line along the stats and higest world ranking. Also I added the world ranking cuz there was empty spaces before. It also makes the ui better. Also I have worked on the responsiveness of the website. Now I will fix a bug in the intro animation and also make the second and third player ui same as the first player. Atlast I’ll try to make the img-card also responsive.

Almost done with the website

Changes made:

• Changed images from hero, first and hall of fame section
• Made website somewhat responsive
• Added loading screen

I’m almost done with this project. I’m going to deploy this project now and then I will fix some bugs and try make the ui better. This time the coding was mostly done by the ai because I don’t have much time due upcomming boards exam and also I didn’t know how to make gsap website responsive. It took me a whole day even with ai to make the website somewhat responsive. I also created the loading screen but ai helped me to sync it with the current animations. This is the only time in this project I have used ai so heavily but on looks wise it made almost no difference.

I’m feeling better now. Yay!! This time there isn’t much to talk about. I have complete the third and final section with animations, images, info and stats. Now I will probably work on the achievements section. Rn I’m fighting against time cuz of my upcomming exams, so I’m trying to finish this project asap. That’s all for this devlog. If you’re reading this love you ♥.

I’mm sickkk rn 😭😭. Still I’m trying my best to complete this project as soon as possible because my boards exams are comming.

Here are the changes I’ve made:

• I’ve added back the background color change only for the transition from hero to first section (Very subtle)
• Changed ui of first player info and stats
• Added the info and stats in second section

I tried messing with the first section info and stats but nothing was working so at last I chose white background. Idk if I will change this in the future. I have also added the player info and stats to the section now it’s time for the third section to be completed.

The website is coming along nicely. It’s now starting to look like a website rather than a mess. Still so much more work needs to be done.

Here are the change:

• Added icons to each stat in the first section
• Changed background color of hero section
• Added animation to the secondary hero text
• Changed the font of secondary hero text

That’s all for this devlog. Peace ✌

Let’s go another devlog!! I don’t know how it’s been 3 hrs almost but here we are.

Changes made:

• Added animations to the first player info stats section
• Made the ui of first section player stats better
• Still experimenting with the hero section

The player info and stats section is looking much better than before also I have experimented with the hero section but it still doesn’t look right. I do love the animations in the player stats section. Now I work on making the ui of both hero and player stats much better.

Yoo!! Let’s see what has changed with my project.

• Added player info and stats for this first section.
• Made progress bar component for stats
• Added progresss bar functionality
• Changed the img container to be dynamic.

I think that’s all for this devlog. The img container looks fine on my device but looks bad on others which I need to fix. Also I will add animations to the stats bar which I think shouldn’t be that hard. One last note I am right now working on project under final exam pressure hope I can study and code at the same time. And that’s all. Peace✌

It’s time to lock in now!! Now I am straight aiming for macbook air m5. It sounds crazy with the amount of cookies I have now but I must try. I have changed the idea for the website. It’s going to be a table tennis players stats showing page with stunning animation.

What I’ve changed:

• Changed the different color background to be just plain white
• Changed the hero text
• Added a new pop card
• Slightly changed the timing of cards collasping
• Added a new animation on intro
• Made cards expand and retract on scroll

I’m really happy with how this project is going but time will tell how it will look. I will probably improve the ui of the intro cards by tweaking their sizes.

The was really frustating to figure out and I was going to give up on this project but after giving it another shot it worked somehow. I’ll be honest, I have used ai to figure it out but I’m happy that it just works now. Without the help of ai I wouldn’t have been able to figure it out. Now the hall of fame has horizontal scroll with cards and text.

Hey, I’m really frustrated right now. I have been stumbling across various gsap bugs. I tried to build hall of fame in this devlog but I just couldn’t. I think I need a break from this project right now. I’ll probably work on my futsal project now. I thought I had fixed the card popping animation but now it’s 100% fixed and I commented out have commented out the hall of fame section for now. I have also change the names here and there. Also fixed the xupername text.

Ahh the card popping animation works fine on scroll but bugs out when scrolling backwards. I tried to fix it as best as I could. Rn it does work on scrolling backward but sometimes it stills bugs out. I have also added lenis package for smooth scrolling. Now the scroll feels buttery smooth. Lenis broke the scroll lock during the first animaition but now I have fixed that.

New devlog!! I have made the code much cleaner now. The code was very messy before, I was spamming scrollTrigger every where and wasn’t grouping the same animations. Now it’s much better. Also now I have made it so that when user reloads they scroll all the way on top of the screen and only after the hero animation is complete then you are able to scroll. As I can’t show that using image so I am just going to screenshot the xuxin section and put it here.

I thought I had uploaded a devlog but idk why happened. So let me tell you what happened. Last time I had added the collapsing of images animation on scroll. Now I have done the card popping animation with background color transition between pags. The card popping took some deep thoughts and eventually I got it. Everything isn’t as I want it to be but I will fix that now.

Stared a new project. This project isn’t going to be too intense as the previous projects of mine. I am going to just create a animated website with elements of table tennis cuz I love table tennis. This is just going to be a fun project for me to just enjoy and be more familiar with gsap. I’ve just written the text and images but the animations are looking cool (although you can just see an image). I think I will have fun with this project.