https://github.com/rohitumbare/doze-studios

Doze Studios has been reimagined with a dynamic, cutting-edge visual experience. Using frame sequence animation & GSAP for smooth, scroll-triggered transitions, the website now offers more immersive and engaging interaction. Every scroll uncovers new visual layer, creating a seamless flow that captivates users and enhances the overall storytelling.
https://github.com/rohitumbare/doze-studios

canvasapi css gsap html javascript lenis preloader

Last synced: about 1 year ago
JSON representation

Doze Studios has been reimagined with a dynamic, cutting-edge visual experience. Using frame sequence animation & GSAP for smooth, scroll-triggered transitions, the website now offers more immersive and engaging interaction. Every scroll uncovers new visual layer, creating a seamless flow that captivates users and enhances the overall storytelling.

• Host: GitHub
• URL: https://github.com/rohitumbare/doze-studios
• Owner: rohitumbare
• Created: 2024-11-05T08:41:32.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-11-06T04:36:00.000Z (over 1 year ago)
• Last Synced: 2025-02-07T13:27:26.112Z (over 1 year ago)
• Topics: canvasapi, css, gsap, html, javascript, lenis, preloader
• Language: CSS
• Homepage: https://rohitumbare.github.io/Doze-Studios/
• Size: 87.7 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Doze Studios

🚀 Exciting Project - "Doze Studios"! 🎉

I am thrilled to announce the completion of my latest project - Doze Studios! 🌟

🎯 Project Details :  


Doze Studios has been reimagined with a dynamic, cutting-edge visual experience. Using frame sequence animation and GSAP for smooth, scroll-triggered transitions, the website now offers a more immersive and engaging interaction. Every scroll uncovers a new visual layer, creating a seamless flow that captivates users and enhances the overall storytelling.




💡 Key Features : 


✅ Frame Sequence Animation:  


I’ve integrated an interactive animation using the Canvas API, where a series of images seamlessly transition as users scroll, bringing the content to life in a unique and engaging way.


✅ GSAP Integration:  


GSAP (GreenSock Animation Platform) is utilized to ensure smooth and sophisticated content transitions. This enhances user experience by giving the website a fluid, polished feel as users interact with the page.


✅ Preloader: 


A custom-built preloader ensures that all media assets are fully loaded before the content is visible, providing a smooth and uninterrupted browsing experience.


✅ Responsive Design:  


The website is fully optimized for all screen sizes, ensuring that both the animation and content adjust perfectly to desktops, tablets, and mobile devices.


✅ Smooth Scrolling with Lenis:  


Integrated Lenis for an ultra-smooth scrolling experience, which complements the visual transitions and adds a layer of elegance to the navigation.


🛠 Technologies Used : 


   HTML, CSS, JavaScript, GSAP, Lenis, Canvas API 


   🧐 Technical Details : 

   

  🧩 HTML & CSS: For modern, semantic structure and sleek design.
 

  ⚙️ JavaScript: Used for dynamic interactions and scroll-based animations.


  ⚙️ GSAP: For smooth, high-performance animations and transitions.


  ⚙️ Lenis: For optimizing scroll behavior and performance.


  ⚙️ Canvas API: To create the frame sequence animation and custom visuals.

🎓 Learning Experience : 


This project was a fantastic opportunity to deepen my understanding of animations and visual storytelling on the web. The combination of Canvas API and GSAP opened up new possibilities for me in terms of interactive design. I also gained valuable experience in optimizing performance across different devices, which is crucial when working with heavy animations.

 📝 Conclusion : 

With Doze Studios, I’ve pushed the boundaries of web design by combining artistic visuals with technical performance. This project highlights my ability to create responsive, interactive, and visually compelling websites that provide a rich user experience.

📢 I'd love to hear your thoughts!

🤝 Contributions are welcome! Feel free to submit issues and pull requests.

🔍 Looking forward to your feedback and support as I continue my journey in the world of development.

😊 Happy coding!💻