Rethinking Input Paradigms
Voice is fundamentally different from typing. When we set out to design Whisp, we knew we couldn't simply translate keyboard-centric interfaces to voice. We needed to rethink the entire interaction model from first principles.
Core Design Principles
Our design philosophy centers on several key principles:
- Invisible When Needed: The best interface is one you don't notice. Whisp should feel like a natural extension of your thought process, not a tool you have to manage.
- Confidence Through Feedback: Users need to trust that their words are being captured accurately. We provide subtle visual feedback that confirms recognition without being distracting.
- Forgiving Corrections: Mistakes happen. Our interface makes it easy to correct errors without breaking flow, whether through voice commands or quick keyboard shortcuts.
- Context Awareness: The interface adapts to where you are and what you're doing. Writing an email feels different from taking notes, and our design reflects that.
The Floating Pill Bar
Our signature interface element is the floating pill bar—a minimal visualization that provides essential feedback without dominating your screen. The amber visualizer shows audio levels in real-time, confirming that Whisp is listening without requiring you to look away from your work.
The pill bar's position was carefully chosen to be visible in peripheral vision while staying out of primary focus areas. It gently pulses during active dictation and remains still when idle, using motion to communicate state without text or icons.
Typography and Readability
For transcribed text, we chose EB Garamond for headings and clean sans-serif fonts for body text. This combination provides excellent readability while feeling warm and human—important for content that originated as speech rather than typing.
We use a cream color palette (#FDF8E8) for light sections that reduces eye strain during long dictation sessions, paired with deep black (#0a0a0a) for dark mode that's easy on the eyes in low-light environments.
Motion and Animation
Animation in Whisp serves a purpose beyond aesthetics. Our animations are designed to:
- Confirm actions without requiring reading
- Guide attention to relevant changes
- Create a sense of responsiveness and life
- Smooth transitions between states
Cross-Platform Consistency
Whisp feels like Whisp whether you're on Windows, Mac, or iPhone. We maintain consistent design language across platforms while respecting platform conventions. The core experience transfers seamlessly, but platform-specific interactions feel native.