You shall not pass!? A short story of customizable login experiences

Whether we’re there or only know it from the media, sometimes bouncers guide entry, e.g. to a club or a conference. “You shall not pass” is a quote you might have heard of. Our web application might also have bouncers - granting entry to projected pages or not. However, this is not the typical authentication journey you might expect: Join me on a small but delightful journey to train the bouncer by using a customized authentication - from the eyes of the developer building it. Customizing login experiences doesn’t need to be a drag, after all.

Transcript

1. A short story about customisable login experiences
4. . You shall not pass!
6. The persuable bouncer
9. Custom
12. Train the bouncer
13. Train the bouncer Bouncer‘s POV
14. Requirements to be granted access
15. Requirements to be granted access Use cases
16. From which country!?
18. Are you a robot!?
19. Vue ReCAPTCHA
20. Vue ReCAPTCHA
21. ... <div class="hidden"> <label class="sr-only">Don’t fill this out if you're human: </label> <input v-model="bot" name="bot-field" placeholder="only for the robots."/> </div> ...
22. Codepen
23. Codepen
24. Did you accept the new Terms of service!?
25. Many dependencies Steps in between Break in Looks Leaving my own application
31. Tell me about you!?
32. Onboarding ⬇ Progressive Profiling
35. You shall pass.