Features
Microphone Tester Feature Prompt
A feature prompt for the Microphone Tester component which I still want to implement for my pheripherals tester tool.
🔌 Input Devices
- List all available microphone inputs with labels.
- Let user switch between them dynamically.
📈 Live Feedback
- Show:
- A live waveform
- A gain meter
- Red “clipping” zone indicator when volume is too loud
####🧠 Mic Optimal Range Feedback
- Display message based on average gain level:
- ✅ “Perfect distance”
- ⚠️ “Too far, speak up”
- ❗“Too close, lower your voice”
- Visual feedback using icon + text
- Adjustable thresholds optional (for dev mode)
🔊 Live Playback
- Toggle to hear your own mic in real-time (feedback loop warning).
- Respect input/output device choice.
🎛️ Recording Controls
- Start / Pause / Resume / Stop buttons
- Timer:
- Starts at 0
- Pauses timer on pause
- Resumes timer from paused value
🧾 Track Visualization
- After stop:
- Show full waveform with zoom out
- Playback control with:
- Click-to-seek
- Forward 5s / Backward 5s buttons
- Playback speed toggle:
- Faster: 1.25×, 1.5×, 1.75×, 2×
- Slower: 0.75×, 0.5×, 0.25×
📝 File Management
- Title (editable). Default =
recording-TIMESTAMP
- Delete track button
- File size preview (estimated)
- Download MP3
📦 Persistence
- Multiple recordings allowed
- Persist via
localStorage
- Sync across browser tabs
- Optional Postgres support (via Drizzle ORM)
🚫 Permission States
- If no access:
- Show empty state with info + retry
- If denied:
- Show persistent error with instructions
♿ Accessibility
- Labels for all controls
- Live regions for timers
- Keyboard navigable
Keyboard Tester Feature Prompt
Build a Keyboard Tester Component in a Next.js App Router app that mimics a VIA-style interface, designed for user interaction and input visualization. No storage in localStorage or PostgreSQL is required, but a toggleable settings system should be implemented (can use URL params, Zustand, or context).
Webcam Tester
Build a Webcam Testing Component in a Next.js App Router app with the following capabilities, UI behaviors, and data model. It should function independently but follow the same structure as the microphone testing feature.