All files / web/src/components/toys/number-line/constants/demos phiDemoNarration.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
/**
 * Phi (Golden Ratio) Demo Narration Segments
 *
 * Matches goldenRatioDemo.ts: a Fibonacci golden-rectangle spiral
 * is built inside-out. A compass arm sweeps 90-degree arcs, adding
 * progressively larger squares. The rectangle's aspect ratio converges
 * toward phi (~1.618).
 *
 * The demo has NO on-screen text labels — narration carries all the
 * explanation.
 *
 * Progress distribution (exponential decay = 0.8):
 *   Steps 0–2   ~0.00–0.15  Innermost squares, rapid spiral
 *   Steps 3–5   ~0.15–0.35  Early growth, squares getting bigger
 *   Steps 6–9   ~0.35–0.55  Middle growth, pattern becoming clear
 *   Steps 10–20 ~0.55–0.80  Outer squares, settling down
 *   Steps 21–50 ~0.80–1.00  Final convergence, very fast
 *
 * NUM_LEVELS = 50 total arc steps.
 */

import type { DemoNarrationSegment } from './useConstantDemoNarration'

/** Shared voice direction for the golden ratio demo narrator. */
export const PHI_DEMO_TONE =
  'You are a gentle, amazed nature guide for a really smart 5-year-old. ' +
  'Connect everything to shells, flowers, and art. Speak with quiet wonder, like discovering a treasure.'

export const PHI_DEMO_SEGMENTS: DemoNarrationSegment[] = [
  // ── Inner spiral beginning ────────────────────────────────────
  {
    // Seg 0: First arcs — the compass starts spinning
    ttsText:
      "Watch this magic compass! It's drawing a spiral, " +
      'spinning round and round. ' +
      'See how it starts really tiny in the middle?',
    startProgress: 0.0,
    endProgress: 0.12,
    animationDurationMs: 5000,
    scrubberLabel: 'Spiral begins',
  },
  {
    // Seg 1: More inner arcs, colored frames appearing
    ttsText:
      'Each time it turns, it adds a new square — ' +
      'and each square is a little bigger than the last one! ' +
      'See the colored boxes growing outward?',
    startProgress: 0.12,
    endProgress: 0.28,
    animationDurationMs: 5500,
    scrubberLabel: 'Squares grow',
  },

  // ── Growth becoming visible ───────────────────────────────────
  {
    // Seg 2: Pattern becoming clear
    ttsText:
      "It's building a special rectangle. " +
      'This spiral follows a secret recipe — ' +
      'each new piece is the two before it added together! ' +
      'One, one, two, three, five, eight...',
    startProgress: 0.28,
    endProgress: 0.45,
    animationDurationMs: 6000,
    scrubberLabel: 'The secret recipe',
  },
  {
    // Seg 3: Mid-spiral, shape settling
    ttsText:
      'Look at the shape of the box. ' +
      "It's getting more and more... perfect. " +
      'Not too long, not too wide — just right.',
    startProgress: 0.45,
    endProgress: 0.6,
    animationDurationMs: 5000,
    scrubberLabel: 'Perfect shape',
  },

  // ── Outer squares, convergence ────────────────────────────────
  {
    // Seg 4: Connection to nature
    ttsText:
      'You know what? This spiral shows up everywhere in nature! ' +
      'Snail shells curl this way. Sunflower seeds swirl this way. ' +
      'Even hurricanes spin in this same special shape!',
    startProgress: 0.6,
    endProgress: 0.78,
    animationDurationMs: 6500,
    scrubberLabel: 'Found in nature',
  },
  {
    // Seg 5: Final convergence — arcs fly by
    ttsText:
      "Now it's going faster and faster — but the rectangle " +
      'has already found its perfect shape. ' +
      'No matter how many squares we add, it barely changes anymore.',
    startProgress: 0.78,
    endProgress: 0.92,
    animationDurationMs: 5000,
    scrubberLabel: 'Settling down',
  },

  // ── Reveal ────────────────────────────────────────────────────
  {
    // Seg 6: The golden ratio revealed
    ttsText:
      'That perfect shape is the golden ratio — about one point six one eight. ' +
      'People call it phi. ' +
      'Artists use it to make beautiful paintings, ' +
      'architects use it to build beautiful buildings, ' +
      'and nature uses it to grow beautiful shells and flowers. ' +
      "It's the universe's favorite shape!",
    startProgress: 0.92,
    endProgress: 1.0,
    animationDurationMs: 9000,
    scrubberLabel: 'The golden ratio',
  },
]