Étape 4: Code
J’avais initialement l’intention d’utiliser une combinaison de Chrome parole API et traitement pour exécuter le simple croquis qui prendrait en voix d’entrée et faire quelque chose de visuel avec les données. Après farfouillé avec websocket sur le traitement et en omettant de le faire fonctionner, j’ai googlé autour et trouvé ce p5.speech bibliothèque. P5.js est une plate-forme que je suis assez confortable (Merci à ce projet partiel 100 jours de P5.js que j’ai l’automne dernier), plus il fonctionne déjà sur le web, donc il peut profiter du discours Chrome API.
La reconnaissance vocale/mot fonctionne comme par magie. J’ai ensuite voulu prendre les mots et faire un google image search avec eux (comme si l’ordinateur enfant prend dans l’entrée de la voix et il lève les yeux sur l’internet). Déjà cela sur une recherche d’Image Google normale à l’aide de discours (le résultat ressemblerait un typique Google Images résultat de recherche / carrelage), mais obligent l’utilisateur à cliquer sur un bouton chaque fois qu’il/elle veut lancer une recherche. J’ai sérieusement considéré reconfigurer mon système afin qu’il y a un bouton sur le microphone, mais en fin de compte décidé de travailler avec le code que j’ai déjà. Pour ce faire, j’ai besoin essayer de trouver un moyen de rendre l’ordinateur écoute en continu et de travailler avec Google Custom Search API.
J’ai demandé l’aide de mon ami ex-collègue, Kevin Ho, pour m’aider avec cela. L’ensemble API, JSON, JQuery appels étaient un peu au-dessus de ma tête. Il a écrit un sketch super nu os qui tire une image basée sur le discours d’entrée. Ensuite, je fais des réglages peu à faire passer le texte de la requête sur le résultat de l’image avec un arrière-plan noir légèrement opaque.
J’ai dû obtenir ma propre clé API, qui peut être fait par le biais de la Console du développeur Google. Cette clé API est utilisée dans SimpleSearch.js pour attraper le premier résultat de recherche d’image de Google.
![]()
