babyQwerty
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
main.tsx
https://malcolmocean--865648e030fa11f09d7d569c3dd06744.web.val.run
A deterministic baby keyboard where actions have predictable, educational consequences to help babies learn cause and effect.
- Hold to Grow: Keys start growing immediately when pressed, reaching 2x size over 2 seconds
- Progressive Animations:
- 0-2s: Key grows smoothly to 2x size
- 3s: Key starts vibrating while staying large
- 5s: Key begins spinning while vibrating
- Release to Reset: Letting go immediately stops all animations and shrinks the key back to normal
Keys light up with colors that map to their keyboard position:
- A = Blue (bottom-left anchor)
- 9 = Red (top-right numbers)
- M = Green (bottom-right letters)
- Colors smoothly interpolate across the keyboard in an RGB triangle pattern
- Keys to the right of 9 & M show beautiful yellows and warm tones
- Keys are grey by default
- Immediate color feedback when pressed
- White text on colored backgrounds for contrast
- Enhanced shadows and borders when active
- Cause & Effect: Every action has a predictable, visible consequence
- Temporal Learning: Babies learn that holding longer creates more dramatic effects
- Spatial Awareness: Color patterns help babies understand keyboard geography
- Motor Skills: Encourages intentional key holding vs. random pressing
- try to disable more keys (while still having a way to get out)
(maybe there's a better way to do this with a special app-wrapper)
- make full-screen
- turn off alfred cmd-space
- karabiner - turn off caps-lock to hyper so those hotkeys aren't activated
- Settings -> three/four finger swipe to change spaces
- see if I can turn off more of the fn keys