1 dépôt
Real-time alteration of element dimensions and shapes based on audio data.
Distinct from Dynamic Border Animations: Focuses on modifying properties like font size and border radius via audio, not map geometry or coordinate calculation.
Explore 1 awesome GitHub repository matching user interface & experience · Dynamic Geometry Modification. Refine with filters or upvote what's useful.
Rythm.js est un framework d'animation JavaScript conçu pour synchroniser les éléments d'interface visuelle avec la lecture audio ou l'entrée d'un microphone en direct. Il fonctionne comme un outil de manipulation DOM qui mappe les données de fréquence audio en temps réel aux propriétés CSS, permettant aux éléments web de pulser, bouger et se transformer en réponse au son. La bibliothèque se distingue en fournissant un mappage granulaire des bandes de fréquences, ce qui permet aux développeurs d'isoler des plages spécifiques comme les basses, les médiums ou les aigus pour déclencher des réponses visuelles ciblées. En s'intégrant avec la Web Audio API, elle traite les signaux audio pour piloter des modifications géométriques dynamiques, telles que des changements de position, de rotation et d'attributs stylistiques comme la couleur ou l'opacité. Le moteur principal utilise une boucle de rendu haute performance pour garantir que les mises à jour visuelles restent alignées avec l'horloge audio et les taux de rafraîchissement de l'affichage. Il prend en charge à la fois le branchement d'éléments multimédias externes et le traitement de flux de microphone en direct, permettant un large éventail d'applications de design réactif.
Adjusts layout properties like font size and border width in real time based on detected audio frequency levels.