Présentation faite le 11 avril 2015 à Paris pour la HTML5 Game Jam (http://html5gamejam.org).
Web Audio API offre de grandes possibilités pour traiter le signal sonore en JavaScript. Nous allons voir à travers cette présentation les techniques pour automatiser une construction de "stage" pour un DDR (Dance Dance Revolution) : comment la pulsation est calculée pour le placement des flèches.
7. –Boris Smus (Developer Relations, Google)
“The goal of this API is to include capabilities found in
modern game audio engines.”
8. HISTORIQUE DE
WEB AUDIO API
• Spécification commencée par le W3C.
• Premier draft le 1 juin 2010.
• En Working draft depuis 2013.
• Suppression des préfixes webkit mi-2014.
9. FONCTIONNALITÉS
WEB AUDIO API
• Récupérer le son à partir d’une entrée.
• Modifier : filtrer, augmenter/réduire le gain, créer des
effets, compresser…
• Analyser : fréquences, bit rates, pics…
• Diriger vers une sortie : processus déconnecté, audio
output.
17. CALCUL DE LA PULSATION
DONNÉES EXPLOITABLES
1. Récupération des données brutes du fichier.
2. Application du filtre low-pass
3. Calcul des pics par rapport à un seuil variable (90% à
30%, itération de -5%)
4. Conversion des résultats en millisecondes
5. Suppression des doublons + tri croissant
18. CALCUL DE LA PULSATION
FILTRAGE ET RÉSULTAT FINAL
1. Calcul des intervalles des pics + puissance des
intervalles (moyenne quadratique)
2. Filtrage des pics plus hauts que la puissance
3. Intervalle le plus répandue (avec delta d’erreur
acceptable)
4. ♪ BPM = 60 000 (1 min) / intervalle (ms)
19. GÉNÉRATION DES FLÈCHES
• Extrapoler les pics “sûrs”
par rapport à la durée de la
pulsation.
• Une image SVG +
transformation (rotation).
• Animations en CSS.
• Scoring : 1000 / decalage