Coding Challenge #151: Ukulele Tuner with Machine Learning Pitch Detection Model

Channel:

The Coding Train

Subscribers:

1,740,000

Published on October 3, 2019 4:44:32 PM ● Video Link: https://www.youtube.com/watch?v=F1OkDTUkKFo

Duration: 35:55

83,115 views

2,404

In this challenge, I attempt to create a Ukulele tuner in JavaScript using p5.js, ml5.js and the pre-trained machine learning model CREPE: A Convolutional REpresentation for Pitch Estimation. Can you make one with a more elegant and creative interface? Code: https://thecodingtrain.com/challenges/151-ukulele-tuner-with-machine-learning

🕹️ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/8io2zvT03

🎥 Previous video: https://youtu.be/vEetoBuHj8g?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 Next video: https://youtu.be/nSYw9GrakjY?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
📝 ml5.js: https://ml5js.org/
🧠 CREPE: A Convolutional REpresentation for Pitch Estimation: https://github.com/marl/crepe
🎨 Hannah Davis: http://www.hannahishere.com/
📂 How to turn any GitHub repo into a CDN: https://gomakethings.com/how-to-turn-any-github-repo-into-a-cdn/
🔊 Online Tone Generator: https://www.szynalski.com/tone-generator/
🔴 Coding Train Live 183: https://youtu.be/1b9-O7pnUcg?t=5911s

Related Coding Challenges:
🚂 #41 Clappy Bird: https://youtu.be/aKiyCeIuwn4
🚂 #147 Chrome Dinosaur Game: https://youtu.be/l0HoJHc-63Q
🚂 #153 Interactive Drawing with SketchRNN: https://youtu.be/ZCXkvwLxBrA

Timestamps:
00:00 Introduction
01:04 Import the ml5 library
01:34 Pitch detection using ml5
02:24 The CREPE model
05:07 Using the CREPE model in the web editor
07:19 Create a pitch detector with ml5
11:57 The new keyword: constructors vs functions
13:26 Get a frequency value from the microphone
14:48 Make sure the microphone is ready first
15:33 ml5 callbacks are error-first
17:12 Checking the frequency continuously
18:05 Drawing the frequency in the canvas
19:46 Tuning the A string of the ukulele
25:08 Improving the graphical interface
27:06 Tuning the other strings of the ukulele
28:44 Figure out which note is the closest one
31:51 Debugging and fixing the code
34:51 Wrapping up this coding challenge

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

🚂 Website: http://thecodingtrain.com/
👾 Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
🚩 Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
💡 GitHub: https://github.com/CodingTrain
💬 Discord: https://thecodingtrain.com/discord
💖 Membership: http://youtube.com/thecodingtrain/join
🛒 Store: https://standard.tv/codingtrain
🖋️ Twitter: https://twitter.com/thecodingtrain
📸 Instagram: https://www.instagram.com/the.coding.train/

🎥 Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

🔗 p5.js: https://p5js.org
🔗 p5.js Web Editor: https://editor.p5js.org/
🔗 Processing: https://processing.org

📄 Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#machinelearning #pitchdetection #sound #tuner #p5js #ml5js #javascript