Custom reCAPTCHA

Hi there,

I’ve designed some sort of google’s (old) reCAPTCHA. A user needs to pass some sort of image verification test in order to send an email - but in this case on a static website and with your own images. Unfortunately I didn’t find enough time to make a detailed youtube tutorial to explain the logic. If you are interested in you can contact me anytime.

frahmworks.engineering@gmail.com

Have fun.
https://drive.google.com/open?id=1xhh0sTH1YeMwKIsOu48S65Owhco-Ycyt

5 Likes

Very cool!
Thanks for sharing…

-Matt

1 Like

Okay, you got me… how did you do this?

I assumed you either would have javascript to check timeline states or a timeline that “accumulates” correct/incorrect answers until a specific state is reached, but I cannot find this. I even skimmed through elements looking for inner html and I could not find any. Yet it does appear to work - the ordering of clicks doesn’t matter and a single bad tile prevents access. What did I miss?

1 Like

looks like its a number of shield elements dropping down to reveal the email button underneath them.

Controlled on the button timelines
Each click swaps out a tile and if correct also drops a shield.
If you then re click the same spot you are clicking the swapped in tile which reverts the timeline and resets the related elements back thus putting one of the sheilds in place.

The wrong selections work the same but shields work in reverse.

05

2 Likes

Thank you very much for the feedback Jonathan.
I need to say my goal was to set it up without any line of code to use the full potential of Hype.
I’ve used a little javascript function but only to prevent the email address from getting stolen by bots.
Like @MarkHunte said there is some forth and backward movement basically - but maybe I can do some detailed video in the future.

1 Like

Ah, I missed the animations on the good/bad elements that would act as cover ups for the email link. Very clever!

1 Like