Patatap Clone 🎶🎵
Hi Everyone!
Hope everyone is doing well. Today The last couple of days Ive been making this. It is a patatap clone! if you don't know what patatap is, check it out here! It's a really cool website and has some pretty impressive animations! Anyways this is a clone of that. The animations aren't quite as impressive as the original, but still cool. I had a lot of fun making this! Also each letter key has an animation and its own sound. There are only three animations, so each row of letter keys has its own animation!
Thx :)
If you liked this, go ahead and upvote!
Hey @JDOG787, this is great - well done!
@rjlevy Thanks :)
@JDOG787, have you thought of implementing the filter property? If you used it with transitions you could get some great effects. Something like this filter: blur(10px) hue-rotate(180deg) opacity(0.5);
@rjlevy Well I used js to make the animations (gasp) but I should still work. Thanks for the suggestion, ill have to look in to it. :)
@JDOG787, ah OK. I thought you were using CSS on it's own. I haven't heard of gsap. It looks really good 👍
@rjlevy Oh ok. yes its easy to use. You should try it sometime :)
@JDOG787 thanks, I'll check it out. Also, I haven't heard of howler
Nobody
Me using this program to make a song
WHAT IS THIS!!!!!!!!!!!
I have NEVER EVER seen something so nice made out of HTML, CSS and JS! :)
@Muhammad_SJC thx! xD
Wow I love the animations and music, noice!!!!!
@EpicGamer007 Thx! :)
this is so cool! i could use this to make a beat for a song :)
do mqmqmq
cool!
Hold down W.
@CarlosRosiles Ahh my ears xD
Hold down E (makes gun sounds) @CarlosRosiles
Cool!
WOAH!!!!!!!!!!
Interesting...
Good job!
This is awesome! One issue, some keys play the same sounds. Other than that, great website!
@Vandesm14 Thx! I forgot to change the sounds after I copied and pasted lol. fixed now though!
can someone post a link with the sound files, to lit to be left alone
@JDOG787 do you have a url that points to the files, or are we going to have to manually download them through repl.it
@nightKnight0 ohhh ok. well there might be a url but you can just download them here!
Such a cool idea. I love the sounds it makes
Yay this was featured on Zwacc's post good job jdog!
@HahaYes I KNOW! thx!
@JDOG787 and he upvoted!
@HahaYes wait what?
@JDOG787 zwacc voted lol
@HahaYes wow :D
@HahaYes I saw
Hey, as a piano player, I honestly think this is the best game I've played in the 11 years of my life. I wish I could upvote more than once! :)
Just one suggestion: Other than the drums (Which I LOVE) I really like the sound of the letter "k" if you know what I mean. Could you make it all the same key, so that it will create harmonic music? Thanks!
@DJWang Hi! thx! glad you like it. Also I can't really do that cuz there are only enough sounds for each letter key and thats isn't really the point(more about the unique sounds with animations). But maybe sometime I will take this idea and make a piano app. thx!
Man, i dont know whether is it on pourpose but whenever i keep pressing the same key, it kinda crashes the sound a little bit. To solve this issue you might wanna change the JS event from keypress to maybe keydown or keyup. I found really interesting your code, i literally just passed the past 30 minutes typing things into it. Hope i could help you on to improving this issue.
@PeidoMolhado Yeah I noticed that too. Not much you can do other than what you said which is easy but I don't know that you can hold the button down then which, sometimes even thought it doesn't sound quite as good, its cool. But thx anyways :D
It would be awesome if you could somehow encode a word (or a phrase) in its equivalent sounds. Great work!
@DevTony wdym? also thx
wow, cool!
Its so good!!! You should probably include the numbers as well if you can for more sounds
@hihitherethere Thx! also the there are only sounds for the letter keys. patatap only uses the letter keys. :)
Do d u dd uu d u dd uu (it sounds like the beginning of all star by smash mouth)
@AJDevelopment holding down h sounds horrifying
@AJDevelopment tuning instruments while hyper be like gsgfrufyhgryjujrheopirkuuhgqyuygcvelhkjhcvkejhgfegjhbenmjhcgvnbmnfbvhckjhbcwdjnbvdcgnjdbvghk
@AJDevelopment lol nice
someone help
@iArc49 you need someone to help you on this post???
make an ask post!
@iArc49 anyway line 12#include "studio.h"
not #include "studio,h
@iArc49 Hi, can you pls not ask here? If you need help make a post on the ask board. Thx!
Although I find this quite pointless GOOD JOB!
@JosephSanthosh its to waste time :D lol. THX
Exactly. @JDOG787
Me spamming my keyboard:
Creates harmony:
Wow lol
@Bookie0 LOL
@Bookie0 lol
@Bookie0 LOL
@Bookie0 lmao same