I think people are somewhat familiar with pressing the number keys while playing a YouTube video to jump to a timestamp, creating a sampler-type instrument. Well, I wanted to take it to the next step. Inspired by playing around with the Arturia Drumbrute, I built a web-based drum sequencer that uses YouTube videos as input.
32 step sequences, A/B pattern banks, bpm control, save/load pattern functionality, and what I'm most proud of - a page to share your patterns and load in patterns that other people have made.
Very neat, at first I was like ohh it’s going to download YouTube videos and get disabled sooner rather than later, but this is super clean with embed links. It’s definitely a neat project
I actually sample a lot of YouTube videos and it’s a cat and mouse game since YouTube keeps disabling it. Eventually I’m going to have to just grab my old phone with a jack and run an aux cord…
Thank you 999900000999. I think sampling from Youtube is super interesting and I wanted to make it easier to do. Curious what you use to sample from Youtube and to hear your music ~
Good point. I added some default video urls and pad commands. You just have to press load video and press play. You can also instantly load anyone else's pattern into the sequencer on the Share Patterns page!
Hey! Thanks for your feedback. Not beating the bizarre allegations but I do agree with you on the larger play button and I've made it bigger. I also agree about the default project, and I've added default videoUrl and padCommands. I still need the user to press the Load Video button to load it in, unfortunately that's a problem I haven't been able to fix so far. I'm curious, which element of the UI do you think I should remove first to make it simpler? Re: browsing other people's work, yes just go to Share Patterns and sort by Most Liked!
Really creative project! Love how you've transformed YouTube timestamps into a music sampler. The social sharing feature is particularly impressive - it turns the tool into a collaborative music-making platform.
I'm curious about a few technical aspects:
1. How do you handle YouTube video loading latency, especially at higher BPM?
2. Have you considered implementing multi-track functionality, using different YouTube videos as separate tracks?
3. Regarding the AWS free tier expiration, have you thought about using GitHub Pages + frontend caching to reduce server load?
As a suggestion, perhaps adding a "Featured Patterns" section showcasing the community's most popular rhythm patterns could help new users quickly discover the tool's potential.
1. I don't do anything special to handle loading latency, but it doesn't seem to be too much of an issue so far. At each sequencer step I issue the pad command to the YT.Player. If that part of the video hasn't loaded yet, then it doesn't always sound right at first, but Youtube seems to handle it pretty well by caching "where" you've been in the video.
2. Yes, there are 4 sequencers. At each step, for each active sequencer, I call an executeCommand function. Right now, just in a for loop. At one point I tried doing this with a Promise but I think the overhead of creating Promises so many times a second outweighed any benefit in performance and I scrapped it.
3. The AWS free tier expiring is actually a matter of time rather than server load. I have essentially 10 more months of free EC2 usage left. Server stuff is just the pattern sharing which is pretty lightweight, just storing and serving text files. I would have just used MongoDB which would have been free but I wanted to learn EC2, GraphQL, RDS.
4. I don't have a Featured Patterns page but you can go to the Share Patterns page and sort by Most Liked. I do agree that it would be a good idea though, perhaps as the default option of the sorting dropdown. But first I need to get the word out so the community will actually make some rhythm patterns ;)
Readit News
32 step sequences, A/B pattern banks, bpm control, save/load pattern functionality, and what I'm most proud of - a page to share your patterns and load in patterns that other people have made.
I'm a musician (https://sweetpablo.bandcamp.com/) and aspiring web developer (https://andrew-boylan.com/) just hoping to get people using this thing before my AWS free trial runs out! Try it out and add your pattern ~
See this page (https://youtubesequencer.com/about) for an example video.
https://youtubesequencer.com/
I actually sample a lot of YouTube videos and it’s a cat and mouse game since YouTube keeps disabling it. Eventually I’m going to have to just grab my old phone with a jack and run an aux cord…
(Desktop/keyboard only)
Could maybe have a simpler UI by default with an option for advanced as most people would be consumers, not creators.
Could be fun to browse other peoples work if ranked by current popularity.
I'm curious about a few technical aspects: 1. How do you handle YouTube video loading latency, especially at higher BPM? 2. Have you considered implementing multi-track functionality, using different YouTube videos as separate tracks? 3. Regarding the AWS free tier expiration, have you thought about using GitHub Pages + frontend caching to reduce server load?
As a suggestion, perhaps adding a "Featured Patterns" section showcasing the community's most popular rhythm patterns could help new users quickly discover the tool's potential.
1. I don't do anything special to handle loading latency, but it doesn't seem to be too much of an issue so far. At each sequencer step I issue the pad command to the YT.Player. If that part of the video hasn't loaded yet, then it doesn't always sound right at first, but Youtube seems to handle it pretty well by caching "where" you've been in the video.
2. Yes, there are 4 sequencers. At each step, for each active sequencer, I call an executeCommand function. Right now, just in a for loop. At one point I tried doing this with a Promise but I think the overhead of creating Promises so many times a second outweighed any benefit in performance and I scrapped it.
3. The AWS free tier expiring is actually a matter of time rather than server load. I have essentially 10 more months of free EC2 usage left. Server stuff is just the pattern sharing which is pretty lightweight, just storing and serving text files. I would have just used MongoDB which would have been free but I wanted to learn EC2, GraphQL, RDS.
4. I don't have a Featured Patterns page but you can go to the Share Patterns page and sort by Most Liked. I do agree that it would be a good idea though, perhaps as the default option of the sorting dropdown. But first I need to get the word out so the community will actually make some rhythm patterns ;)
I've made a simple beat: https://gist.github.com/tiborsaas/68f5f31f195bdbdf22952f64e5...
https://github.com/eastmountaincode/youtube-sequencer