dvjsharma / Drawn2Shoe

Drawn2Shoe is a user-friendly e-commerce platform. It offers customers the ability to purchase and personalize their shoes. The platform's intuitive interface ensures seamless navigation and usability across a variety of devices.
MIT License
26 stars 44 forks source link

Add Preloader #106

Closed AsmitaMishra24 closed 2 months ago

AsmitaMishra24 commented 3 months ago

Describe the new feature A preloader is an essential feature for enhancing user experience by indicating the progress of loading content. It helps in keeping the users engaged while the main content is being fetched or rendered. Implementing a preloader can significantly improve the perceived performance of our application.

Describe the possible approach Design and Appearance:

  1. A simple and visually appealing animation.
  2. Should match the overall design language of the application.
  3. Customizable options for color, size, and style to fit different themes.

Functionality:

  1. Should display during the loading of heavy components or data fetching processes.
  2. Must cover the main content area that is being loaded.
  3. Option to show the preloader globally (entire screen) or locally (specific component).

Performance:

  1. Lightweight and optimized to prevent additional load times.
  2. Should not interfere with the loading process of the main content.

Implementation:

  1. Should be implemented as a reusable component.
  2. Easy to integrate with different parts of the application.
  3. Must include appropriate documentation for usage and customization.

Describe any alternatives

  1. Skeleton Screens: Instead of a preloader animation, skeleton screens can be used to display a placeholder for content that is loading. This approach can be less distracting and provide a more seamless experience.
  2. Progress Bars: Another alternative is to use a progress bar that shows the percentage of content loaded. This can provide more detailed feedback to users about the loading process.
  3. Lazy Loading Indicators: For sections of content that load as the user scrolls, implementing lazy loading indicators can also serve as an alternative to a full preloader.

Additional context My Previous Work:- https://github.com/dvjsharma/Drawn2Shoe/assets/146121869/175ff458-54a0-4b1c-b9a0-ce6d4b71aa08

dvjsharma commented 3 months ago

Would be good @AsmitaMishra24. Go ahead.