# План реализации: Алгебра 11 (Беларусь, Арефьева/Пирютко, 2020) **Источник:** `Algebra_11kl_Arefieva_rus_2020.pdf` (276 стр., 3 главы, 10 §) **Авторы:** И. Г. Арефьева, О. Н. Пирютко **Издательство:** «Народная асвета», 2020 > Этот план учитывает **весь опыт Алгебры 9 + Геометрии 9** — никаких пикселей в подписях, никаких эмодзи, KaTeX с двойным экранированием с первого дня, единая SVG-инфраструктура, продуманный UX. --- ## 🎯 Содержание учебника ### Глава 1. Обобщение понятия степени (§1–§3) | § | Тема | Ключевые формулы | |---|------|------------------| | §1 | Степень с рациональным/действительным показателем | $a^{m/n} = \sqrt[n]{a^m}$, свойства, $a^{\sqrt{2}}$ через приближения | | §2 | Степенная функция $y = x^\alpha$ и её свойства | 6 типов в зависимости от $\alpha$ | | §3 | Определение логарифма. Основное логарифмическое тождество | $\log_a b = c \Leftrightarrow a^c = b$, $a^{\log_a b} = b$ | ### Глава 2. Показательная функция (§4–§6) | § | Тема | Ключевые формулы | |---|------|------------------| | §4 | Показательная функция $y = a^x$ | $D=\mathbb{R}$, $E=(0;+\infty)$, при $a>1$ возрастает, при $01$ знак сохраняется, при $0` каждого ch-файла. Уже работают в Алгебре 9 — копируем 1-в-1: ```js // 1. Координатная плоскость function axes2D(W, H, pad, xmin, xmax, ymin, ymax){ // Возвращает {content, toX(v), toY(v), ux, uy} } // 2. График функции y = f(x) function plotFunc(f, xmin, xmax, toX, toY, color, N){ // Возвращает } // 3. Маркер прямого угла L function rightAngleMark(V, uIn, wIn, s) { /* polyline */ } // 4. Дуга угла с автовыбором sweep function angleArcAuto(V, uA, uB, R) { /* path */ } // 5. Единичный вектор от p1 до p2 function unitVec(p1, p2) { /* {x, y} */ } // 6. deg → rad function deg2rad(d) { return d * Math.PI / 180; } ``` ### Новые хелперы для Алгебры 11 ```js // 7. Точка на графике с проекциями на оси function pointWithDrop(x, f, toX, toY, color) { // Возвращает SVG: точка + пунктир к оси X + пунктир к оси Y + подписи координат } // 8. Асимптота (для y=a^x: y=0; для y=log_a x: x=0) function asymptote(orientation, value, toX, toY, xmin, xmax, ymin, ymax) { // orientation: 'h' (y=value) | 'v' (x=value) // Возвращает } // 9. Сравнительный график двух функций (для a>1 vs 0 1$ — **синий** (`#2563eb`) - При $0 < a < 1$ — **оранжевый** (`#ea580c`) - Граничный случай $a = 1$ — серый (`#94a3b8`) - Асимптоты — серый пунктир (`#94a3b8`, `stroke-dasharray="6 4"`) 7. **ViewBox с запасом ≥ 24px** для подписей вне сетки. 8. **`touch-action: none`** на каждом draggable SVG. 9. **Drag через `window.addEventListener` + `{passive: false}`**, state ВЫШЕ `redraw()`. 10. **Эмодзи ЗАПРЕЩЕНЫ.** Только inline SVG `.ic`. 11. **Подписи длин/значений — в учебных единицах**, не в пикселях. Никогда `b₁ = 120` где 120 это пиксели. 12. **Заголовок интерактива должен СОВПАДАТЬ** с количеством объектов в SVG. Не «Три эталонных треугольника», когда нарисовано два. ### Типы SVG по темам | § | Тема | Тип SVG | |---|------|---------| | §1 | Степень с рац. показателем | Slider $a$ + табло «$a^{m/n}$ = $\sqrt[n]{a^m}$» с реальной подстановкой. Калькулятор степени без графики. | | §2 | Степенная функция $y=x^\alpha$ | **Координатная плоскость** + slider $\alpha \in [-3; 3]$, точка $\alpha=1$ — прямая, $\alpha=2$ — парабола, $\alpha=-1$ — гипербола. **6 эталонных кривых на одном графике** с включаемой видимостью. | | §3 | Определение логарифма | **Slider $a$ + slider $b$**, точка пересечения $y = a^x$ с горизонталью $y = b$ показывает $\log_a b$. Анимированный поиск. | | §4 | Показательная функция | **Двухпанельный график** $a > 1$ vs $0 < a < 1$, slider $a$ от $0.1$ до $10$ со snap к $2, e, 10$. Асимптота $y=0$ пунктиром. Точка $(0, 1)$, $(1, a)$ — выделена. | | §5 | Показательные уравнения | **Графический решатель**: два графика $y = a^{f(x)}$, $y = a^{g(x)}$, точки пересечения. Также пошаговый разбор алгебраического решения. | | §6 | Показательные неравенства | **Числовая прямая** + закрашенная область решений + сравнение с осью при $a>1$ и $a<1$. | | §7 | Свойства логарифмов | **Логарифмическая линейка** — slider $b$, $c$ показывает, что $\log(bc)$ это сумма длин. | | §8 | Логарифмическая функция | **Двухпанельный график** $a > 1$ vs $0 < a < 1$ + отражение $y = a^x$ через $y = x$ (показать обратность). | | §9 | Логарифмические уравнения | **Графический решатель** + анимация ОДЗ (выколотые точки на оси x). | | §10 | Логарифмические неравенства | **Числовая прямая** с учётом ОДЗ + монотонности. | --- ## 🚀 ПОРЯДОК РЕАЛИЗАЦИИ ### Phase 0: Архитектура (фундамент) - `algebra_11_hub.html` skeleton (палитра **emerald/teal**, чтобы отличить от algebra_7 розовой, algebra_9 индиго) - `algebra_11_ch1.html`, `_ch2.html`, `_ch3.html` skeletons - Миграция `022_algebra_11_hub.sql` (slug `algebra-11`, sort_order 9) - SVG-хелперы (axes2D, plotFunc, pointWithDrop, asymptote, compareGraph) уже встроены в skeleton - KaTeX CDN + auto-render в head - CSS-блок «POLISH» (анимации появления, hover, bump-score) — копия из Геом 9 - ICONS объект целиком из algebra_9_ch4 ### Phase 1: Алгебра 11 Глава 1 «Обобщение степени» (3 §) — 3 волны - **Wave 1**: §1 «Степень с рац. показателем». 3 теории + 4 интерактива (slider $a^{m/n}$, калькулятор, DnD «корень↔степень», тренажёр). - **Wave 2**: §2 «Степенная функция $y=x^\alpha$». 6 типов графиков на одном координатном поле, slider $\alpha$, цветовая кодировка чёт./нечёт./дробн./отриц. - **Wave 3**: §3 «Определение логарифма». Slider $a$, slider $b$, визуализация $\log_a b$ через пересечение $y = a^x$ и $y = b$. + Финал главы 1 (4 mini-карточки + 5 боссов + ачивка «Магистр степеней»). ### Phase 2: Алгебра 11 Глава 2 «Показательная функция» (3 §) — 3 волны - **Wave 1**: §4 «Показательная функция $y = a^x$». **Главный интерактив всей главы** — двухпанельный график $a>1$ vs $0 -2$ 4. **Свойства log**: упростить $\log_3 \tfrac{72}{8} - \log_3 \tfrac{9}{2}$ 5. **Графический синтез**: найти кол-во решений $2^x = \log_2 x$ 6. **Логарифмирование показательного**: решить $5^{2x} = 7$ через $\log_5$ 7. **Магистр функций**: при каком $a$ функция $y = (a-2)^x$ убывает? - Ачивка «Магистр алгебры 11» + 50 XP + confetti - Кнопка «К каталогу учебников» → `/textbooks` --- ## 📦 Структура каждой главы ### Wave 0 — skeleton (включено в Phase 0) - CSS (палитра 3 цветовых акцента на §) - Sections со stub-builder'ами - Hub-карточка обновляется - Миграция в БД ### Wave N — наполнение § (по 1–2 § на волну) Каждый § = ровно тот же шаблон, что и Геометрия 9: - **3 теоретических карточки** (`makeCard` типа theory/rule/example) с SVG-графиками - **4 интерактива** (`.wg` виджеты): 1. **SVG-конструктор** с slider'ом (главный визуализатор темы) 2. **Калькулятор/пошаговый разбор** (ввод параметров → формула с подстановкой) 3. **Квикфайр-викторина** (6–8 заданий, 2–4 кнопки) 4. **Тренажёр** (5–6 задач с числовым ответом, допуск 0.01) - **Кнопка «Я прочитал §» (+10 XP, +30%)** - **Прогресс**: IV1 15%/10XP, IV2 15%/10XP, IV3 25%/15XP, IV4 25%/15XP, чтение 30%/10XP ### Wave финал главы - **Итоговая шпаргалка** — mini-cards с формулой на § - **5 интегрированных боссов** (комбинирующих темы) — каждый +10 XP, +18% к `finalN` - **Достижение «Мастер главы N»** при 5/5 + 50 XP + confetti - **Кнопка «Дальше: Глава N+1 →»** (или «К хабу» для последней) --- ## 📊 Оценка объёма | Глава | § | Ожидаемый LOC | |-------|---|---------------| | Глава 1 (§1-3) | 3 | ~5500 | | Глава 2 (§4-6) | 3 | ~5800 (главные графики функций) | | Глава 3 (§7-10) | 4 | ~7000 | | Hub + финал курса | — | ~900 | | **Итого** | **10** | **~19 000 LOC** | Для сравнения: Алгебра 9 = 19 § = ~30 000 LOC. Здесь меньше § (10 вместо 19), но каждый требует визуально насыщенных графиков. --- ## ⚠️ Критические правила (на основе опыта Алгебры 9 + Геом 9) ### ❌ НЕ делать - **Slider'ы в пиксельных диапазонах** (40..150). Только в учебных единицах с понятным шагом. - **Подписи длин в пикселях** (`R = 120`, `c = 150`). Только в учебных единицах. - **«Три треугольника» когда нарисовано два** — заголовок и контент должны совпадать. - **Эмодзи `⚠`, `❌`, `✅`, `🔥`** в коде. Только inline SVG. - **Одиночный `\` перед буквой** в template literals: `\dfrac`, `\sin`, `\log`. ВСЕГДА `\\dfrac`. - **Прямой угол в нестандартной позиции** (хотя в 11 классе их меньше — больше графики). - **Sweep=1 без проверки направления** — используем `angleArcAuto`. - **Графики с плохими асимптотами** — например, $y = a^x$ должен явно показывать асимптоту $y=0$, а $y = \log_a x$ — $x=0$. ### ✅ Обязательно - **KaTeX-аудит на каждом коммите** — `grep -nP "[^\\\\]\\\\[a-z]{2,}"` для JS-секций. - **JS parse-check** через `new Function(scriptBody)` после каждого Wave. - **Координаты — формулами**, не «на глаз». - **Drag — state ВЫШЕ `redraw()`**. - **Цветовая кодировка $a>1$ vs $0