Activity

oggythebuilder01
oggythebuilder01 shipped Newton nightmare
6 days ago

Shipped this project!

Hours: 3.36
Cookies: 🍪 9
Multiplier: 2.65 cookies/hr

I build this for BROKEN UI JAM
Creating “bad” UI actually taught us a lot about good engineering:

Browser Permissions: We learned how to handle navigator.mediaDevices.getUserMedia and manage microphone permissions gracefully (or ungracefully, in this case).

Real-Time Data: We learned how to visualize audio data (the volume meter) by mapping frequency arrays to CSS styles in a requestAnimationFrame loop.

User Psychology: We discovered that “Good UX” is about reducing friction. By intentionally adding friction (physical exertion + precise timing), we realized just how many invisible helpers (like autofocus and auto-save) exist in modern forms to help users succeed.

Limits of the Web: We explored how browsers handle background tab throttling—meaning this app forces the user to keep the window open and active to suffer the full experience.

oggythebuilder01
oggythebuilder01 worked on Newton nightmare
6 days ago
3h 21m logged

It is an authentication interface designed to be technically functional but practically impossible to use. Instead of typing a password, the user must sustain a specific volume level (screaming) into their microphone to generate characters.
The Challenge: If the user stops screaming, the characters delete themselves.
The Trap: If the user screams too loud, the system resets.
The Twist: The system actively fights the user by blurring the screen and changing the password right before completion.
2. What We Made (Technical Implementation)
We built a standalone web application using Vanilla JavaScript (no frameworks) to keep the project lightweight and raw.
Audio Processing: We utilized the Web Audio API (AudioContext and AnalyserNode) to capture real-time microphone data
Signal Analysis: We wrote a loop that calculates the average frequency volume every few milliseconds to determine if the user is “screaming” (inputting) or “breathing” (deleting).
State Management: We created a hostile game loop that tracks “Scream Charge” vs. “Decay Charge” to manipulate the DOM elements dynamically.

Attachment
0
oggythebuilder01
oggythebuilder01 worked on Newton nightmare
6 days ago

I’m working on my first project! This is so exciting. I can’t wait to share more updates as I build.

Attachment
0