Afinador de l'Albert (2025)

Afinador cromàtic per a instruments de corda amb un cercador d'acords per veu integrat. Tot s'executa al navegador: cap backend, cap clau d'API, cap dada d'àudio surt del dispositiu.

Desplegat com a PWA instal·lable a afinador.albertsarle.com i empaquetat també com a aplicació Android nativa (no publicada a Google Play, encara).

Què fa?

Dues coses:

• Afinar l'instrument: com el qualsevol app per afinar però sense anuncis ni registre ni res..
• Buscar acords amb la veu: no recordes un acord? digue'l amb la veu i et mostra el diagrama de l'acord principal i les variants. Molt més ràpid que buscar a les apps de acords.

🎸 Afinador cromàtic

• Detecció de to en temps real amb l'algorisme YIN, executat en un Web Worker perquè el processament d'àudio no bloquegi la interfície ni les animacions.
• Suporta guitarra (afinació estàndard i Drop D), baix i ukelele.
• Dial visual de precisió amb indicador per corda: tocant-ne una sona la nota de referència corresponent.
• Freqüència de referència A4 ajustable entre 432 i 445 Hz.
• Visualitzador d'espectre opcional i mode clar/fosc.
• Avís d'èxit (so + modal) quan totes les cordes queden afinades.

Dial de precisió afinant la corda Fa

El mateix dial responent a la corda Re

Avís visual quan totes les cordes estan afinades

🎤 Troba l'acord, dient-lo en veu alta

• Botó de "prem i parla": dient un acord en veu alta (p. ex. "Re menor set" o "Re menor séptima") es mostra el diagrama de digitació per a guitarra.
• Reconeix català i castellà en el mateix diccionari de veu.
• Diverses posicions per acord (oberta, amb cejilla...) navegables.
• Historial dels acords cercats recentment, persistent entre sessions (localStorage).
• Requereix un navegador amb SpeechRecognition (Chrome, Edge, Opera, Samsung Internet, Safari 14.1+/14.5+); als navegadors sense suport —notablement Firefox— es mostra un avís amb la llista de compatibles en lloc de fallar en silenci.

Diagrama de digitació generat en dir "Si menor sèptima"

Arquitectura tècnica

Detecció de to: YIN en un Web Worker

El nucli de l'afinador és una implementació de l'algorisme YIN (autocorrelació amb correcció d'error acumulat), que processa blocs de 4096 mostres a 44,1 kHz per estimar la freqüència fonamental del so captat pel micròfon. Aquest càlcul s'executa dins un Web Worker (workers/pitchWorker.ts) perquè l'anàlisi d'àudio, que corre diverses vegades per segon, no competeixi amb el fil principal que dibuixa el dial i les animacions.

Veu → acord: un parser lingüístic fet a mida

services/chordParser.ts converteix la transcripció de la Web Speech API en un acord estructurat ({root, quality}) sense dependre de cap NLP ni servei extern: és una funció pura, testejable sense micròfon. El primer mot ha de ser una nota vàlida (do, re, mi, fa, sol, la, si), la qual cosa resol de manera senzilla l'ambigüitat de "si" (nota vs. afirmació). Les frases de qualitat ("menor set", "menor séptima", "disminuït"...) es comparen ordenades de més a menys paraules (longest-match-first), perquè "menor set" es reconegui abans que "menor" sol deixi "set" penjat. El mateix diccionari cobreix català i castellà alhora.

Motor de teoria musical i base de digitacions

services/chordTheory.ts defineix les 9 qualitats bàsiques (major, menor, 7, m7, maj7, dim, aug, sus2, sus4) com a taules d'intervals i en deriva les notes de cada acord. data/chordFingerings.ts és una base de dades estàtica amb 108 combinacions (12 tòniques × 9 qualitats), cadascuna amb una o dues posicions (oberta i, quan cal, amb cejilla), adaptada de @tombatossals/chords-db.

De PWA a aplicació Android nativa

L'app es construeix com a Progressive Web App amb vite-plugin-pwa (manifest, icones i service worker amb actualització automàtica en segon pla), instal·lable directament des del navegador. A sobre d'aquesta base, s'ha empaquetat també com a app Android nativa mitjançant una Trusted Web Activity (TWA) generada amb Bubblewrap: signada amb keystore pròpia, verificada amb un fitxer assetlinks.json que confirma al sistema operatiu que l'app i el domini afinador.albertsarle.com són del mateix propietari, i acompanyada d'una pàgina de política de privacitat pròpia (requisit de publicació a Google Play).

Stack tecnològic

• React 19 & TypeScript
• Vite 6
• Tailwind CSS
• Web Audio API
• Web Speech API
• vite-plugin-pwa
• Vitest
• Docker & Nginx
• TWA / Bubblewrap (Android)

Prova-ho tu mateix: https://afinador.albertsarle.com

Digitacions d'acords adaptades de @tombatossals/chords-db 0.5.1, Copyright (c) 2016 David Rubert, llicenciat sota la Llicència MIT.