Étude de cas · Application web sur mesure

BirdSignal

Une application web qui analyse le son pour identifier l'oiseau qui chante, et transforme chaque écoute en carte à collectionner géolocalisée. Imaginée, nommée, dessinée, développée, mise en ligne et hébergée en France.

Idéation Naming Identité graphique UX / UI Développement 3D temps réel IA embarquée Hébergement

Sans magasin d'applications

Elle s'installe sur tous les téléphones, gratuitement

BirdSignal est une application web. Elle s'ouvre dans un navigateur, puis s'installe d'un geste sur l'écran d'accueil : son icône, son écran de lancement, son fonctionnement hors ligne. Aucun magasin d'applications, aucun compte, aucun téléchargement payant. Une seule adresse, et le même produit sur Android, sur iPhone, sur ordinateur.

  • Gratuit
  • Android
  • iPhone et iPad
  • Windows et macOS
Raccourci BirdSignal sur le bureau de Windows, avec son icône
Installée depuis le navigateur, elle se range sur le bureau comme un logiciel.
6 522espèces
2langues
137tests auto
0octet audio envoyé

Points clés

Ce que j'ai réalisé

  • Idéation, positionnement et naming de l'application
  • Création du logo, du système d'icônes et de l'identité graphique complète
  • Conception de l'expérience, des parcours et de l'interface, en deux langues
  • Développement intégral, front et back, et intégration d'un modèle d'intelligence artificielle
  • Rendu 3D temps réel des cartes, avec gyroscope sur mobile
  • Mise en ligne, sécurisation, hébergement en France et documentation

Le cœur de l'application

Tout part d'un son

L'application enregistre quelques secondes de chant, en construit le spectrogramme, et soumet cette image de fréquences à un modèle d'intelligence artificielle de 6522 espèces. Le tout dans le navigateur, en moins de temps qu'il n'en faut pour ranger son téléphone. Ce qui défile ci-dessous n'est pas une illustration : c'est l'analyse d'un vrai enregistrement, une rue de Toulouse à six heures du matin.

Spectrogramme de quarante secondes enregistrées à Toulouse à six heures du matin : chaque trait vertical clair est une vocalisation d'oiseau.

Enregistrement réel

Le temps en abscisse, la fréquence en ordonnée, l'intensité en couleur. Chaque trait vertical est un oiseau ; la bande claire du bas est la ville qui se réveille. Activez le son pour entendre ce que vous voyez.

1. CapterMicro ou fichier importé, rééchantillonné à 48 kHz.
2. Voir le sonTransformée de Fourier, spectrogramme, découpage en segments de 3 secondes.
3. ReconnaîtreModèle BirdNET exécuté en WebAssembly, filtré par le lieu et la saison.

Design produit

Le son devient un objet

Chaque analyse conservée devient une carte numérotée, avec sa photo, son spectrogramme, sa date et son lieu. Elle se retourne en 3D et s'incline au gyroscope, de sorte que le reflet suit le poignet comme sur une vraie carte.

Les quatre rangs

Le rang change la matière de la carte, et il se mérite. Passez la souris sur les poinçons : ce sont exactement ceux frappés au verso des cartes.

Uc Non classéeAucune espèce reconnue
Sd StandardArgent
Or AuthentiqueCaptée sur place, localisée
Dd DiamantIrisé, le plus rare

Le point fort

Votre collection raconte vos sorties

Chaque carte retient l'endroit où le chant a été capté. La collection devient une carte de vos promenades, et surtout une carte des espèces : on voit où elles sont, et où elles ne sont plus.

Représentation de principe. La position n'est enregistrée qu'avec l'accord de l'utilisateur, et elle est arrondie avant tout partage.

Identité graphique

Un signe qui se lit à 16 pixels

Un oiseau et une lettre dans la même forme. Une seule couleur pour le signe : une identité qui a besoin d'un dégradé pour exister ne survit pas à une impression en noir. Le favicon, lui, existe en deux fichiers, parce qu'un gris clair disparaît sur une barre d'onglets blanche.

Méthode

De l'idée à la mise en ligne

01

Idéation et positionnement

Définir ce que l'application fait, ce qu'elle refuse de faire, et à qui elle s'adresse.

02

Naming

Un nom qui tient dans une icône, se prononce en français comme en anglais, et dit quelque chose de vrai sur le produit.

03

Logo et identité graphique

Du croquis au vectoriel, décliné en favicon, icônes d'application, thème clair et thème sombre.

04

Architecture et UX

Parcours, écrans, arborescence, et une architecture choisie pour tenir sur un hébergement mutualisé français.

05

Développement

Interface, API, traitement du signal audio, IA embarquée, rendu 3D temps réel et tests automatisés.

06

Mise en ligne et suivi

Sécurisation, hébergement en France, application installable et hors ligne, documentation et mises à jour.

Ce que cela veut dire pour vous

Un seul interlocuteur, du premier croquis à la mise en ligne

Application web sur mesure

Outil métier, configurateur, application mobile installable. Conçue, développée et hébergée.

Identité et design produit

Naming, logo, système d'icônes, interface et déclinaisons, pensés pour tenir à toutes les tailles.

3D, AR et expériences immersives

Configurateurs 3D temps réel, visualiseurs, réalité augmentée, directement dans le navigateur.

Vous souhaitez faire appel à mes services ?

Parlons de votre projet. J'interviens sur l'ensemble de la chaîne, ou sur la partie qui vous manque.