Top
Design Studio • V4.2.0 • Patent Pending in USA

UNHEARDOF.AI — Design Studio

A philosophy-first document describing why UNHEARDOF.AI looks and behaves the way it does — with a focus on vertical-first interaction, one-button calmness, and a reading experience that feels native to the web. This document is intentionally non-technical (no code) and is safe for partners, designers, and product teams.

Core ThesisVertical pages deserve vertical controls Design PromiseOne button. Contextual intelligence. No player chrome. PositioningReading engine, not a music player
Vertical truth One‑hand use Context over chrome Motion as meaning Reader is a view

01 — The Problem

What most “read aloud” tools accidentally became: MP3 players taped onto websites.

The old pattern (borrowed from music)

  • Horizontal transport controls (back 15 seconds / play / forward 15 seconds)
  • Horizontal scrub timeline anchored to the bottom
  • Heavy player chrome that competes with the page
  • Assumption: audio is the product, the page is secondary

The mismatch nobody questioned

  • Pages are vertical, semantic, and section-based
  • Reading is contextual: headings, paragraphs, intent
  • Users want “jump to meaning,” not “jump 15 seconds”
  • The UI should feel like part of the document, not a foreign instrument
Diagnosis

The industry optimized for controlling audio, not for navigating knowledge. UNHEARDOF.AI is designed around the document — and treats audio as a service of reading.

02 — The Breakthrough

UNHEARDOF.AI’s foundational insight is simple: if the medium is vertical, controls must follow vertical logic. This is not a style choice; it’s usability physics.

Figure A — The page is vertical. So the controls become a vertical spine.
A minimal “spine” control lives at the edge. The page remains the hero.
UI concept
Why it feels inevitable

Users already learned a universal mapping: scroll down = move forward; scroll up = move back. UNHEARDOF.AI makes playback obey the same mental model.

03 — Product Philosophy

North Star

Reading, not controls. The UI should disappear from the user’s consciousness. The page remains the hero; the control is a calm edge instrument.

Product promise

One primary control that “just works”, plus contextual tools that appear only when they help.

What we refuse to do

  • We don’t ship a horizontal music-player bar for reading.
  • We don’t force “15 seconds” jumps as the primary navigation metaphor.
  • We don’t make users hunt for transport controls while a page is scrolling.
  • We don’t treat the document as a background behind a player.

04 — Design Principles

  1. Vertical truth — The medium is vertical, so transport is vertical.
  2. One-button mastery — The primary control changes meaning with state (Play/Pause/Resume).
  3. Context over chrome — Show the right tools at the right time, then hide them.
  4. Gestures are first‑class — Reduce clutter, increase one-hand fluidity.
  5. Reader is a view — Same identity, same control language, cleaner surface.
  6. Calm clarity — Light, readable, quiet, world‑class restraint.

05 — UI Architecture

UNHEARDOF.AI is a layered system: document first, spine controls at the edge, and contextual overlays only when invoked. The goal is a stable identity across modes (page + reader), without introducing a separate “player app.”

Layering rule

Content is always the primary layer. Controls live at the periphery. Overlays are temporary and purposeful.

06 — Interaction Model

UNHEARDOF.AI is built around a small number of predictable states. The system is stable because users always know what happens when they tap.

Figure C — Reading state machine
A tiny set of states keeps the mental model crisp and the UI calm.
Workflow diagram

07 — Single‑Button UX

The entire product is designed around a single object that stays in the same place and carries the experience. One button removes hesitation: users never wonder which control to press — they just act.

What “single button” really means

  • One anchor — the user always knows where to go.
  • State-aware meaning — tap becomes Play → Pause → Resume depending on context.
  • Gestures replace extra buttons — power features without visual clutter.
  • Consistency across views — the same control language works on both the page and Reader mode.
  • Auto‑retract — when idle, the docked button collapses to a mini footprint; it expands instantly on interaction.

Why it feels effortless

  • Fewer visible decisions = faster start.
  • Less chrome = more trust in the content.
  • Users discover advanced actions naturally (they don’t feel “trained”).
  • It scales: beginners use tap; power users use gestures.
The rule

Add power by adding meaning, not by adding buttons.

Figure P — One button, many outcomes
A single anchor stays stable while its meaning adapts to the user’s state.
UX model

08 — Gesture Language (Long tap → Reader, Double tap → Settings)

UNHEARDOF.AI uses a small, memorable gesture language so advanced capabilities don’t require extra UI. The gestures are designed to be discoverable and directionally truthful.

Core gestures

  • Tap — Play / Pause / Resume (state-aware)
  • Long tap — Open Reader mode (clean reading surface)
  • Double tap — Open Settings panel (preferences & configuration)
  • Drag up / down — Move up/down the document (vertical skip)

Why this works

  • Short list → easy to remember.
  • Every gesture has a “why” (not random shortcuts).
  • No control explosion — the page stays quiet.
  • Users graduate naturally: tap first, gestures later.
Discoverability principle

Advanced actions should feel like discoveries, not like hidden menus.

Figure Q — Gesture map (single button)
Long tap opens Reader. Double tap opens Settings. Drag up/down navigates the document. Tap controls playback.
Gesture diagram
Guardrail

Gestures must stay few and meaningful. If a gesture needs a manual, it doesn’t belong.

09 — Start Reading From Anywhere

UNHEARDOF.AI doesn’t invent a new “selection UI.” It deliberately uses the platform’s native interaction model. Users simply tap‑hold and select any word or sentence on the page (or in Reader mode), then hit Resume — reading starts from that exact point.

Why this feels obvious

  • Zero learning — the selection affordance already exists.
  • Precision — users can start at any paragraph, any line, any sentence.
  • No extra chrome — no popups, no “choose start point” screens.

What the system does

  • Remembers the selected anchor (word/sentence boundary).
  • Maps the anchor to the readable stream.
  • Resumes playback + highlighting from that anchor.
Principle

Use the device’s native UI whenever possible. Add only what’s missing.

Figure S — Start anywhere (selection → Resume)
User selects text using native handles, then presses Resume. Reading starts exactly there.
Interaction flow

10 — No Login Memory (Preferences & Positions)

UNHEARDOF.AI removes account friction entirely. Without signups, it still behaves like a “personalized” product: it automatically saves preferences and reading state on the device, then restores them instantly on return.

What gets remembered

  • Reader mode position (separate)
  • Original page position (separate)
  • Voice choice, rate, pitch (where available)
  • Highlight color + focus style settings
  • Handedness layout (left / right)

Why this matters

  • Users come back and feel “nothing reset.”
  • Reader mode and the page behave like two distinct workspaces.
  • It builds trust: the system respects the user’s time.
Outcome

The product feels persistent and personal — without asking for an email.

Figure T — Memory model (two positions + one preference set)
Reader and Page store their positions separately, while visual/voice settings are shared.
System diagram

11 — Handedness (Invert Layout)

Usability includes reach. UNHEARDOF.AI offers a simple handedness option: users can invert the layout so the button and scrub bar swap sides. Right‑handed and left‑handed users both get an effortless, thumb‑friendly edge.

Figure U — Handedness toggle (swap sides)
Right‑hand mode and left‑hand mode mirror each other: button ↔ scrub bar.
Layout diagram
Usability win

The control becomes truly “one‑hand friendly” — regardless of which hand the user prefers.

12 — Vertical Skip + Vertical Scrub (The Revolution)

Traditional “skip” belongs to music. Pages are not music. UNHEARDOF.AI introduces a document‑native navigation model:

  • Pull up → go up/back in the document
  • Pull down → go down/forward in the document
  • Progress is a vertical mini‑map of the page
Figure D — Gesture mapping
Direction is literal: up means up the page; down means down the page.
UX diagram
The claim

This is a category shift: from “audio player on a page” to “document transport with speech.”

The breakthrough isn’t “a new control.” It’s a new mental model: playback becomes navigation through a document — not time travel through audio. That’s why users instantly “get it” without training: the directions already match their everyday scroll habits.

The inevitability test

If a feature needs instructions, it’s probably fighting the medium. Vertical transport needs almost none — because the page itself already taught the user.

Figure H — Before vs After (why it feels obvious in hindsight)
Most tools borrow from music players. UNHEARDOF.AI borrows from reading.
Comparison diagram

13 — Insanely Great, by Design

“Insanely great” here is not marketing — it’s the result of removing friction until the experience feels native.

What the user experiences

  • They don’t learn a player. They just start reading.
  • Controls never cover the story. The page stays visually dominant.
  • Direction is literal. Up means up, down means down.
  • One button carries the experience — no clutter, no second guessing.
The “why wasn’t it always like this?” moment

The first time a user pulls down and the reading moves down like a real page, the system stops feeling like a feature and starts feeling like the obvious default.

What we deliberately engineered

  • Unintrusive placement at the edge, not the center.
  • Contextual intelligence: surfaces appear only when needed.
  • Semantic reading: reading follows document structure (headings → paragraphs).
  • Zero “player baggage”: no music-player metaphors, no transport clutter.
The purity test

If you can remove something without breaking the experience, you should. UNHEARDOF.AI is the leftover essential.

Figure I — Fewer visible decisions → faster adoption
People don’t avoid read‑aloud because they hate audio. They avoid it because the UI feels like work.
Principle diagram

14 — Before vs After

UNHEARDOF.AI wins because it removes two historic problems at once: (1) player chrome and (2) broken spatial mapping between what you hear and what you see.

Before

  • Controls fight the page for attention.
  • Horizontal skip is arbitrary (15 seconds is a podcast number).
  • Scrub feels like audio time, not document position.
  • Users hesitate because they must “learn a player.”

After

  • Controls become a calm edge “spine.”
  • Gestures match the page direction.
  • Progress behaves like a document mini‑map.
  • Users feel competent immediately — no tutorial required.
Figure J — Unobtrusive footprint
How much content is visually “stolen” by persistent controls.
UX comparison

15 — First‑Run Experience

UNHEARDOF.AI is designed so the first session is successful even if the user never opens settings. The first-run experience is basically: tap → it reads → the page guides you.

Figure K — First‑run success path
A sequence that produces confidence quickly: success → control → mastery.
Journey diagram
Learnability rule

The user should feel like they discovered the interaction, not like we explained it.

16 — Ergonomics & Reach

UNHEARDOF.AI is designed for one-hand use on modern phones. Edge placement and vertical thumb travel are not aesthetic choices — they are ergonomics.

Figure L — Thumb reach zones
Edge spine lives where the thumb naturally rests. The page remains unobstructed.
Ergonomics diagram
Ergonomics rule

Don’t force the user’s thumb to travel across content. Put the control where the hand already is.

17 — Unintrusive by Default

UNHEARDOF.AI is designed to be quiet. Not minimalist for minimalism’s sake — quiet because the document is the product. The UI should never feel like an advertisement for itself.

The control is designed to be present without being loud. When the user is simply reading, the docked button auto‑retracts into a smaller “mini” state, reducing its footprint to a tiny vertical sliver. The instant the user interacts (tap, long tap, double tap, or drag), it expands back smoothly — never demanding attention, always ready.

Figure R — Auto‑retract: Full vs Mini footprint
The docked control collapses to a mini state when idle, then expands instantly on interaction.
State diagram

Default behavior

  • Controls remain thin and edge‑anchored.
  • Overlays appear only when invoked (Reader / Summary / Settings).
  • Reading continues without constant UI presence.

What this prevents

  • Covering important content (especially on mobile).
  • Visual fatigue from persistent player chrome.
  • The feeling of “a widget taking over the site.”
Figure M — UI presence over time
UNHEARDOF.AI reduces “UI time on screen” while maintaining control and confidence.
Behavior diagram

18 — Delight Moments

“Delight” is the feeling that the product understood you. UNHEARDOF.AI creates that through tiny, meaningful moments — not gimmicks.

Delight moments

  • Rubber-band return: confirms the gesture without leaving the button displaced.
  • Resume is automatic: returning users don’t re-learn anything.
  • Highlight alignment: the eye trusts the ear immediately.
  • Vertical mini‑map: progress feels like location, not time.

Why these matter

  • They reduce anxiety (“Am I still in control?”)
  • They increase confidence (“It’s following the page.”)
  • They reduce clutter (gesture replaces buttons)
  • They make the interface feel alive yet calm
Figure N — Delight without distraction
Motion communicates meaning. It never demands attention for its own sake.
Principle diagram

19 — Why It Becomes the Standard

Users adopt UNHEARDOF.AI the way they adopt good infrastructure: quietly, permanently. It becomes the standard because it makes competing designs feel outdated.

Why it sticks

  • It matches existing instincts (scroll direction and document structure).
  • It doesn’t interrupt (no giant bars, no takeover feeling).
  • It scales from simple reading to advanced use without changing identity.
  • It respects the host site with minimal footprint.

The psychological shift

  • From “should I use this feature?” → to “why doesn’t every site have this?”
  • From “audio player controls” → to “document navigation controls”
  • From “tool” → to “default reading behavior”
The standard effect

Once users internalize “up/down to move in a document,” horizontal 15s skip feels like a relic from another era.

Figure O — Confidence builds fast
A simple model produces rapid trust: the user feels in control within the first minute.
Adoption diagram

20 — Reader Mode UX

Reader mode is not a separate product. It’s a cleaner surface for the same experience: fewer distractions, better scanning, and “read from here” as a semantic jump.

Reader principle

Reader mode exists to reduce noise. It must feel like the page, perfected — not like a separate app.

21 — Usability & Accessibility

Usability targets

  • One‑hand reachability on mobile
  • Large touch targets, minimal precision tapping
  • Fast re‑entry (Resume without banners)
  • Controls that do not fight native browser UI

Accessibility commitments

  • Clear semantics for primary control
  • Readable contrast and calm layout
  • Motion respects “reduce motion” preferences
  • Focus mode supports attention rather than visual noise

22 — Motion Philosophy

Motion is not decoration. In UNHEARDOF.AI, motion communicates intent, state, and completion. The signature “rubber-band return” reinforces that a gesture performed an action and the control remains anchored.

Motion rules
  • Short, purposeful, calm
  • Never distracts from reading
  • Explains interaction rather than adding style

23 — Design Workflow

A safe, repeatable loop for improving UX without adding clutter.

Figure G — Iteration loop
Observe → Diagnose → Simplify → Test → Ship → Observe.
Workflow diagram
Workflow rule

Every iteration must reduce friction without adding chrome. If a change adds UI, it must remove complexity elsewhere.

24 — Design Guardrails

Must not break

  • Vertical-first integrity (no horizontal player bars)
  • One-button dominance (avoid control explosions)
  • Contextual reveal (controls appear only when needed)
  • Reader continuity (same product, cleaner view)

Must always hold

  • Controls remain edge‑anchored
  • Thumb-friendly targets
  • Motion is purposeful, calm
  • Page remains primary visual focus
Anti-patterns
  • Adding MP3-player transport UI (15s back/forward) as the main path
  • Persistent large bars that cover content
  • Feature buttons that compete with reading
  • Animations that continuously demand attention

25 — Partner Narrative

UNHEARDOF.AI is not a “player.” It’s a reading layer for the modern web — designed the way documents actually behave.

One-sentence positioning

“UNHEARDOF.AI is the first read‑aloud system designed like the web itself: vertical, semantic, and one‑handed.”

Contrast statement

Traditional tools: audio players pasted onto pages.
UNHEARDOF.AI: a document transport system with speech — calm, contextual, and native to vertical knowledge.