---
name: training
description: סקיל-על ליצירת הדרכה מלאה על כלי דיגיטלי — מצגת הדרכה, רילס, אינפוגרפיקה. הפעל תמיד כשמבקשים "מצגת הדרכה", "הדרכה על כלי", "בנה מצגת על...", "training".
---

# Skill: הדרכה מלאה — /training

סקיל-על שמתאם יצירת הדרכה מלאה על כלי דיגיטלי.

---

## שאלות לפני הפעלה

1. על איזה כלי ההדרכה?
2. יש הקלטת מסך? (אם כן — לבקש את הקובץ)
3. אילו תוצרים? (מצגת / רילס / אינפוגרפיקה / סימולציה)

---

## Pipeline

### שלב 1: חקר תוכן (`/ai-expert`)
- חקר עמוק של הכלי — יתרונות, מגבלות, מתחרים, מחיר
- מציאת ערך פדגוגי וחיסכון זמן
- **דיוק עובדתי** — לא לכתוב "חינמי" אם אין תוכנית חינמית

### שלב 2: חילוץ + עיבוד תמונות (אם יש הקלטה)
- `/extract-frames` — חילוץ פריימים מפתח מ-MP4
- `/image-process` — חצים, הדגשות, זום, GIF

### שלב 3: בניית מצגת HTML

**חובה:** קרא את `.claude/skills/training/template.html` והשתמש בו כבסיס.
- **העתק את כל ה-CSS וה-JS כמו שהם** — אל תכתוב CSS/JS מאפס
- שנה רק את 3 המשתנים: `--tool`, `--tool-light`, `--tool-dark` לצבעי הכלי
- צבעי הכלי נמצאים ב: `docs/marketing/ai-tools.html`
- החלף את ה-placeholders (`{TOOL_NAME}`, `{HOOK_LINE}` וכו') בתוכן אמיתי

**עיצוב: Dream Theme + כרטיסיות צפות**
- פלטת Dream קבועה: dream (סגול), create (זהב), lead (טורקיז), spark (ורוד)
- `--tool` = צבע הכלי הספציפי (progress bar, כותרת shimmer, brand-word)
- כרטיסיות צפות עם `backdrop-filter: blur(28px)`, סיבוב קל, border-top צבעוני
- גופנים: Playpen Sans Hebrew (כותרות), Assistant (גוף), Heebo (בסיס)
- **לא Karantina, לא Rubik** — הוסרו מהתבנית

#### מיפוי Classes (חדש ← ישן)

| חדש | ישן | הערה |
|-----|-----|------|
| `float-card` | `slide-inner` | כרטיס צף עם blur + סיבוב |
| `float-card.accent-dream` | — | border-top סגול |
| `float-card.tilt-right` | — | סיבוב לימין (0.4deg) |
| `float-card.no-tilt` | — | בלי סיבוב |
| `section-head` | `section-header` | כותרת סקשן |
| `section-icon.dream` | `section-icon.violet` | אייקון סגול |
| `section-icon.create` | `section-icon.orange` | אייקון זהב |
| `section-icon.lead` | `section-icon.green` | אייקון טורקיז |
| `section-icon.spark` | `section-icon.purple` | אייקון ורוד |
| `section-sub` | `section-subtitle` | תת-כותרת |
| `cards-grid` | `grid-3` | גריד 3 עמודות |
| `cards-grid-2` | `grid-2` | גריד 2 עמודות |
| `mini-card` | `g-card` | כרטיס מיני צף |
| `mc-icon` / `mc-title` / `mc-desc` | `g-icon` / `g-title` / `g-desc` | תוכן כרטיס |
| `step-num` | `step-number` | מספר שלב |
| `step-num.dream` | `step-number.violet` | מספר סגול |
| `topic-pills` | `topics-preview` | כפתורי נושאים בשקף כותרת |
| `topic-pill` | `topic-item` | כפתור נושא בודד |
| `divider-blob` | `divider-circle` | עיגול מפריד צף |
| `tip-icon` | `tip-icon-sm` | אייקון tip box |
| `split-grid` + `split-col` | inline styles | יתרונות/מגבלות |
| `brand` | `brand-word` | שם הכלי מודגש |

#### מבנה שקפים

| # | סוג שקף | class | חובה? |
|---|---------|-------|-------|
| 1 | **כותרת** — לוגו SVG + title-h1 + badge + 4 topic-pills | `title-slide` | חובה |
| 2 | **מה זה?** — 3 mini-cards + צילום מסך + tip-box מחיר | `float-card accent-dream` + `cards-grid` | חובה |
| 3 | **איך מתחילים** — 3 step-cards + צילום מסך | `float-card tilt-right accent-lead` + `step-card` | חובה |
| 4 | **מפריד** — "איך עובדים" | `divider-slide` + `divider-blob create` | חובה |
| 5-8 | **איך עובדים** — שקף לכל שלב + צילומי מסך + copy-prompts | `float-card accent-*` | חובה (4-6 שקפים) |
| 9 | **מפריד** — "יתרונות ומגבלות" | `divider-slide` + `divider-blob lead` | חובה |
| 10 | **יתרונות + מגבלות** — **שקף אחד**, split-grid (lead/create) | `float-card no-tilt accent-lead` + `split-grid` | חובה |
| 11 | **השוואה** — כלי מול Canva/מתחרה, compare-cols | `compare-wrap` + `compare-cols` | חובה |
| 12 | **מפריד** — "Claude Code + {כלי}" | `divider-slide` + `divider-blob spark` | חובה |
| 13 | **חיבור CC** — flow-container, CC בצד שמאל + כלי בצד ימין | `float-card no-tilt accent-create` + `flow-container` | חובה |
| 14 | **תרחישים מהחיים** — 3 תרחישים שכולם מזדהים איתם (ראה פירוט למטה) | `float-card accent-dream` + `scenario-cards` | חובה |
| 15 | **דוגמאות תוצרים** — 2-3 תוצרים אמיתיים שנוצרו עם הכלי (ראה פירוט למטה) | `float-card tilt-right accent-create` + `carousel-wrap` | חובה |
| 16 | **טיפים** — 3-5 טיפים מעשיים לשימוש חכם בכלי (ראה פירוט למטה) | `float-card accent-dream` + `tips-grid` | חובה |
| 17 | **שאלות ותשובות** — 4-6 שאלות נפוצות באקורדיון (ראה פירוט למטה) | `float-card tilt-right accent-lead` + `faq-accordion` | חובה |
| 18 | **תרגול** — משימה מעשית שהמשתתפים עושים עכשיו (ראה פירוט למטה) | `float-card accent-create` + `practice-block` | חובה |
| 19 | **אינפוגרפיקת סיכום** — strip קומפקטי של השלבים, לא שקף שלם (ראה פירוט למטה) | `float-card no-tilt accent-dream` + `h-flow` | חובה |
| 20 | **מפריד** — "סיכום" | `divider-slide` + `divider-blob dream` | חובה |
| 21 | **סיכום** — 3 mini-cards + tip lead | `float-card no-tilt accent-dream` + `cards-grid` | חובה |
| 22 | **CTA** — 2 שלבים + אתגר 5 דק' + WhatsApp + Facebook Learni + mail | `float-card accent-lead` + `cta-group` | חובה |

**סה"כ: 21-25 שקפים** (תלוי בכמות שקפי "איך עובדים")

#### כללי תוכן

**שפה:**
- עברית פשוטה, משפטים עד 10 מילים
- דוגמאות מחינוך כללי: עברית, היסטוריה, אזרחות, מתמטיקה. **לא** עיצוב שיער
- מונח טכני בפעם הראשונה → הסבר בסוגריים: "פרומפט (ההוראה שכותבים)"
- **דיוק עובדתי** — בדוק מחירים, תוכניות חינמיות, השוואות
- **קריאה לפעולה/משוב** — לא "שלחו תוצרים וניתן פידבק". כן: "רוצים משוב? שלחו הודעה" / "יש שאלות? השאירו הודעה". נימה מזמינה, לא מטילה משימה

**פרומפטים:**
- כל פרומפט באנגלית חייב **תרגום עברי** מתחתיו: `direction:rtl; font-size:12px; border-top:1px dashed`
- כפתור copy: `min-width:44px; min-height:44px` (touch target)
- clipboard עם catch: `navigator.clipboard.writeText(text).catch(() => {})`

**שקף תרחישים מהחיים (שקף 14 — חובה!):**

**מה זה:** 3 כרטיסי תרחיש שמראים **מה הכלי פותר**, לא איך ללחוץ על כפתורים. תרחישים שכולם מזדהים איתם — לא רק מורים.

**כלל מפתח:** כל תרחיש חייב להיות רלוונטי לקהל רחב — חינוך, ניהול, יזמות, שיווק, שימוש אישי. **חשוב על בעיות שכולם מתמודדים איתם:** ארגון קבצים, חיסכון זמן, בירוקרטיה, יצירת תוכן, אוטומציה של משימות חוזרות.

**פורמט — 3 כרטיסי scenario:**
- class `scenario-cards` (grid 3 עמודות)
- כל כרטיס = אייקון SVG + תרחיש (משפט אחד: "מנהלת צריכה לסכם 50 דוחות ב-10 דקות") + מה הכלי עושה + זמן ("3 דקות")
- צבע רקע כרטיס: `var(--tool-light)`

**דוגמאות לתרחישים טובים (לא רק חינוך!):**
- "יש לך 3,000 קבצים בבלגן — הכלי מסדר אותם ל-8 תיקיות בדקה"
- "צריך לשלוח סיכום יומי לצוות — אוטומציה שולחת מייל כל בוקר ב-8:00"
- "צריך מצגת מקצועית עד מחר — מוכנה ב-5 דקות"
- "לקוח שואל שאלה בוואטסאפ ואין לך תשובה — שליפת מידע תוך שניות"

**המטרה:** כל אחד בקהל אומר "גם לי יש את הבעיה הזו!" — ולא "זה רק למורים"

---

**שקף דוגמאות תוצרים (שקף 15 — חובה!):**

**מה זה:** 2-3 תוצרים אמיתיים שנוצרו עם הכלי, עם צילום מסך ותיאור קצר.

**תהליך:**
1. **קודם לשאול את מייטל:** "יש לך תוצרים אמיתיים מהכלי שנרצה להראות?" — תוצרים שלה עדיפים כי הם אותנטיים
2. **אם אין** — ליצור 2-3 דוגמאות בעצמי תוך כדי בניית המצגת

**פורמט — קרוסלה + lightbox:**
- class `product-carousel` (קרוסלה עם חצי ניווט ימינה/שמאלה)
- כל פריט = תמונה/סרטון של התוצר + כותרת קצרה + "נוצר ב-X דקות"
- **לחיצה על תמונה** → נפתחת ב-lightbox גדול (overlay מלא מסך)
- **לחיצה על סרטון** → מתנגן ב-lightbox עם controls
- חצי ניווט: SVG, `min-width:44px; min-height:44px` (touch target)
- נקודות (dots) בתחתית שמראות כמה פריטים יש ואיפה נמצאים
- תמונות בהירות (לא dark mode!)

**המטרה:** המשתתף רואה תוצר מוגמר ואומר "אני רוצה את זה"

---

**שקף טיפים (שקף 16 — חובה!):**

**מה זה:** 3-5 טיפים מעשיים שהופכים את המשתמש ממתחיל למישהו שיודע להשתמש בכלי בצורה חכמה. שילוב של שלושה סוגים:

**סוגי טיפים (לשלב!):**
1. **טיפים על הכלי** — טריק שחוסך זמן, קיצור דרך, הגדרה נסתרת, פיצ'ר שלא מכירים
2. **טיפים פרקטיים** — "תתחילו מהתבנית הזו", "תשמרו לפני ש...", "השילוב הכי טוב הוא עם..."
3. **טיפים מניסיון** — "אחרי שהשתמשתי בזה חודש, הדבר הכי חשוב הוא..."

**פורמט — tips-grid:**
- class `tips-grid`
- 3-5 כרטיסי טיפ, כל אחד עם: אייקון SVG (נורה/כוכב/מפתח) + כותרת קצרה + משפט-שניים הסבר
- צבע רקע: `var(--tool-light)` עם גבול שמאלי `var(--tool)`
- **טיפ אחד לפחות חייב להיות מניסיון אישי** — זה מה שנותן אמינות

**דוגמאות לטיפים טובים:**
- "תמיד תתחילו מתבנית — לא מדף ריק. חוסך 80% מהזמן"
- "אם התוצאה לא מדויקת — תוסיפו דוגמה לפרומפט, לא עוד הסברים"
- "הפיצ'ר הכי שווה שלא מכירים: [פיצ'ר ספציפי לכלי]"
- "אחרי חודש שימוש: הדבר שהכי שינה לי את העבודה הוא [X]"

**המטרה:** המשתתף יוצא עם ידע פנימי שלא היה מגלה לבד

---

**שקף שאלות ותשובות (שקף 17 — חובה!):**

**מה זה:** 4-6 שאלות שאנשים באמת שואלים (או לא מעזים לשאול) על הכלי, באקורדיון שנפתח בלחיצה.

**פורמט — faq-accordion:**
- class `faq-accordion`
- כל שאלה = כפתור שנפתח/נסגר בלחיצה (toggle)
- שאלה מודגשת + חץ SVG שמסתובב כשפתוח
- תשובה קצרה (2-3 משפטים מקסימום)
- פתוח כברירת מחדל: רק השאלה הראשונה
- touch target: `min-height: 44px` על כל שאלה

**שאלות שחוזרות בכל כלי (לבחור 4-6 רלוונטיות):**
- "זה באמת חינמי?" / "כמה זה עולה?"
- "זה עובד בעברית?"
- "אני צריך/ה לדעת אנגלית?"
- "זה מחליף את Canva / PowerPoint / מה שאני כבר מכיר/ה?"
- "כמה זמן לוקח ללמוד?"
- "זה עובד מהטלפון?"
- "אפשר להשתמש בזה עם תלמידים?"
- "מה קורה אם אני נתקע/ת?"
- "האם צריך כרטיס אשראי?"

**כלל:** להתאים את השאלות לכלי הספציפי. לא להעתיק את אותן 6 שאלות בכל מצגת — לחשוב מה באמת ישאלו על הכלי הזה.

**המטרה:** לפרק חסמים לפני התרגול — אחרי שהתשובות ברורות, קל יותר לנסות

---

**שקף תרגול (שקף 18 — חובה!):**

**מה זה:** משימה מעשית שהמשתתפים עושים **עכשיו**, במהלך ההדרכה. לא "לכו הביתה ותנסו" — אלא "פתחו את הכלי ותעשו את זה ב-5 דקות".

**פורמט — practice-block:**
- class `practice-block`
- כותרת: "עכשיו אתם!" / "תורכם לנסות"
- **משימה ברורה:** צעד-צעד, 3-5 שלבים פשוטים
- **זמן:** "5 דקות" (תמיד ציין זמן)
- **תוצר מצופה:** מה המשתתף אמור לסיים עם (מצגת? תמונה? סרטון?)
- **QR code / קישור ישיר** לכלי (אם רלוונטי)
- **tip-box:** "נתקעתם? קראו לעזרה / תסתכלו בשקף הקודם"

**דוגמאות למשימות:**
- **Pomelli:** "פתחו חשבון → העלו לוגו → צרו Photoshoot ראשון → שתפו את התוצאה"
- **Gamma:** "כתבו נושא של שיעור שלכם → בחרו תבנית → ייצרו מצגת של 5 שקפים"
- **Stitch:** "העלו 3 תמונות → בחרו סגנון → הורידו את התוצר"

**המטרה:** המשתתף לא רק צופה — הוא **עושה**. זה מה שהופך הדרכה לזכירה

---

**שקף אינפוגרפיקת סיכום (שקף 18 — חובה!):**

**שינוי מהותי:** האינפוגרפיקה כבר לא שקף שלם של שלבים טכניים יבשים. היא **strip קומפקטי** שמסכם את התהליך בתוך שקף הסיכום.

**פורמט — h-flow מצומצם:**
- class `h-flow` (ה-CSS כבר ב-template.html)
- 4-5 קופסאות (`h-flow-step`) בשורה אחת, חץ SVG שמאלה (RTL) ביניהן
- כל קופסה = `h-flow-num` (מספר בעיגול) + `h-flow-icon` (SVG) + `h-flow-title` + `h-flow-desc`
- שלב אחרון = `h-flow-step result` (גבול ירוק, תוצר מוגמר)
- **מעל ה-h-flow:** כותרת + משפט שמחבר את התרחישים לשלבים: "ראיתם מה אפשר — ככה עושים את זה"
- **הקופסאות קטנות יותר** מאשר בגרסה הישנה — strip, לא שקף דומיננטי

**גופנים — חובה, אל תחליף!**
- **כותרת השקף:** `Playpen Sans Hebrew` (כתב יד)
- **תוכן הקופסאות:** `Assistant` (גוף רגיל), שפה פשוטה — כאילו מסבירים לחבר
- **לא Karantina, לא Heebo!**

**חץ בכיוון RTL (שמאלה):**
```html
<div class="h-flow-arrow">
  <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="var(--tool)" stroke-width="2">
    <line x1="19" y1="12" x2="5" y2="12"/>
    <polyline points="12 5 5 12 12 19"/>
  </svg>
</div>
```

**רפרנס:** `_drafts/infographic-summary-test.html` — דוגמה לפומלי (לעדכן לפורמט החדש)

**Claude Code section:**
- שורה: "לא מכירים את Claude Code? [לחצו כאן](docs/training/claude-code/intro.html)"
- הסבר 2-3 משפטים מה זה + חלופה: "אין לכם? אפשר גם ב-Canva/PowerPoint"
- **בלי** מונחים: MCP, pipeline, API, production-ready

**שקף CTA — קישורים חובה:**
1. WhatsApp: `https://chat.whatsapp.com/HhAL8L2I2jCH1CW1Iehr4J`
2. קבוצת פייסבוק Learni: `https://www.facebook.com/profile.php?id=61576498498498`
3. מייל: `meytalp@bethaarava.ort.org.il`
- כל URL חייב להיות `<a href target="_blank">`, לא טקסט בלבד
- **כל "הכנסו ל-X" חייב להיות כבר קישור לחיץ** — לא רק טקסט עם שם האתר

#### כללי עיצוב (Dream Theme + כרטיסיות צפות)

- **רקע:** Dream mesh gradient (סגול/זהב/טורקיז/ורוד). **לא כהה. אף פעם.**
- **גופנים — חובה, אל תחליף!** `Playpen Sans Hebrew` (כותרות/כתב יד) + `Assistant` (גוף/תוכן). Heebo כבסיס. **לא Karantina, לא Rubik.**
- **כרטיסיות צפות:** כל `float-card` עם סיבוב קל (-0.3deg או 0.4deg) + `backdrop-filter:blur(28px)` + `border-top` צבעוני
- **brand:** class `brand` (לא brand-word), צבע `var(--tool)`
- **פונט מינימום:** 14px (גם tip-text, copy-prompt, topic-item)
- **SVG icons בלבד** — בלי אימוג'ים
- **תוכן ממלא את השקף** — אסור שקף חצי ריק עם כרטיס קטן באמצע
- **תמונות בהירות** — לא צילומי מסך dark mode
- **Contrast:** `--text-muted: #5A6B7D` (לא #6B7D8F). **אסור** שכבות `rgba` שקופות על טקסט muted — לוודא WCAG AA
- **לוגו לרני** — כבר ב-template (fixed, bottom-right, opacity .45)
- **אין kb-hint** (פס שחור) — מבלבל, להסיר
- **אין auto-advance** — ניווט רק ידני
- **Touch targets:** כל אלמנט לחיץ (כפתור, קישור, topic-item, flow-step) — `min-width:44px; min-height:44px`

#### מובייל — חובה!

כל מצגת חייבת **שני breakpoints**:

```css
/* טאבלט */
@media (max-width: 768px) {
  .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .compare-cols { flex-direction: column; }
  .h-flow { flex-direction: column; align-items: center; }
  .slide-inner { padding: 22px 18px; }
}

/* מובייל */
@media (max-width: 480px) {
  .slide { padding: 16px 12px 70px; }
  .slide-inner { padding: 16px 12px; }
  h2 { font-size: clamp(1.2rem, 5vw, 1.6rem); }
  .step-card, .g-card { padding: 14px; }
  .scenario-cards { grid-template-columns: 1fr; }
  .tips-grid { grid-template-columns: 1fr; }
  .product-carousel { max-width: 100vw; }
  body { font-size: 15px; }
}
```

**כללים:**
- **גופנים מתכווצים:** כותרות עם `clamp()`, גוף לא מתחת ל-14px
- **גריד מתקפל:** כל grid עובר ל-`1fr` ב-480px
- **h-flow אנכי:** במובייל הקופסאות נערמות אנכית, חצים מסתובבים למטה
- **קרוסלה:** swipe touch support, לא רק חצים
- **בדיקה:** לפני הצגה, לבדוק ב-375px (iPhone SE) שהכל קריא ונגיש

#### תמונות וצילומי מסך — כללים

- **תמונות אמיתיות מהכלי** — לא mockups גנריים, לא AI art
- צילומי מסך בהירים (light mode), לא dark mode
- **אם אני לא מצליח לייצר צילום מסך אמיתי** (כי אין גישה לכלי / צריך חשבון) → **לבקש ממייטל** במקום להמציא
- **לא להשתמש בתמונת placeholder** ולהגיד "תקין" — אם חסרה תמונה, לציין את זה בבירור

#### שמירה

```
docs/training/{tool-name}/
├── presentation.html    ← הקובץ הראשי (שם אחיד!)
└── screenshots/         ← צילומי מסך (אם יש)
```

- שם תיקייה באנגלית: `pomelli`, `stitch`, `claude-code`
- שם קובץ: **תמיד `presentation.html`** (לא index.html, לא intro.html)

### שלב 4: תוצרים נוספים (לפי בקשה)

| סקיל | תוצר | חובה? |
|-------|-------|-------|
| `/create-reels` | סרטון רילס 60 שניות | חובה |
| `/infographic` | אינפוגרפיקה | אופציונלי |
| `/practice-sim` | סימולציית תרגול | אופציונלי |

### שלב 5: פרסום (`/publish`)
- שמירה ב-`docs/training/{tool-name}/`
- git add + commit + push
- הצגת קישורים חיים

### שלב 6: הצעות תוכן שיווקי

אחרי שהמצגת מוכנה ואושרה, הצג למייטל רשימת רעיונות לתוכן שנגזר מהמצגת — מוכן להיכנס לדשבורד התוכן.

**פורמט — טבלת הצעות:**

| # | רשת | סוג תוכן | רעיון | מבוסס על שקף |
|---|-----|----------|-------|-------------|
| 1 | Facebook | פוסט ערך | ... | תרחישים / טיפים |
| 2 | Instagram | קרוסלה | ... | דוגמאות תוצרים |
| 3 | Instagram | רילס | ... | לפני/אחרי עם הכלי |
| 4 | LinkedIn | פוסט מקצועי | ... | השוואה / יתרונות |
| 5 | WhatsApp | הודעה לקבוצה | ... | טיפ + קישור למצגת |

**כללים:**
- **4-6 הצעות** לפחות, מגוון רשתות
- כל הצעה מבוססת על תוכן שכבר קיים במצגת (לא להמציא מאפס)
- לציין מאיזה שקף/תוכן ההצעה נגזרת
- הצעות לקהל רחב — לא רק מורים
- **לא לבצע** — רק להציע. מייטל בוחרת מה לקחת קדימה

---

## בדיקת איכות (QA) — חובה לפני הצגה למייטל!

**כלל עליון:** לפני שמציגים את המצגת למייטל, חובה להריץ סוכן QA שבודק שהכל תקין. **לא להגיד "המצגת מוכנה" בלי שהבדיקה עברה.**

### הרצת סוכן QA אוטומטי

שלח סוכן (Agent tool) שבודק את כל הסעיפים הבאים ומחזיר דוח. רק אחרי שהדוח תקין — הצג את המצגת.

### מה הסוכן בודק:

**טכני:**
- [ ] `dir="rtl"` + `lang="he"` קיימים
- [ ] `--tool` / `--tool-light` / `--tool-dark` מוגדרים נכון
- [ ] כל href/src פנימי → הקובץ קיים (Glob לוידוא)
- [ ] קישורי CTA (WhatsApp, landing, mail) → תקינים
- [ ] SVG icons בלבד, בלי אימוג'ים
- [ ] לוגו לרני מופיע
- [ ] אין שגיאות JS (תגיות סגורות, פונקציות קיימות)

**מובייל (חובה!):**
- [ ] יש `@media (max-width: 768px)` — טאבלט
- [ ] יש `@media (max-width: 480px)` — מובייל
- [ ] כל grid עובר ל-`1fr` ב-480px
- [ ] כותרות עם `clamp()` — לא גודל קבוע
- [ ] כל אלמנט לחיץ — `min-width:44px; min-height:44px`
- [ ] אין גלילה אופקית ב-375px
- [ ] h-flow עובר לאנכי במובייל

**תמונות:**
- [ ] כל צילום מסך הוא אמיתי מהכלי (לא placeholder/mockup)
- [ ] תמונות בהירות (light mode)
- [ ] אם חסרה תמונה — מסומן בבירור, לא מוחבא

**תוכן:**
- [ ] כל שקף חובה קיים (לפי טבלת המבנה למעלה)
- [ ] שקף תרחישים — 3 תרחישים לקהל רחב (לא רק מורים)
- [ ] שקף דוגמאות תוצרים — קרוסלה עם lightbox עובד
- [ ] שקף טיפים — לפחות 3 טיפים, לפחות אחד מניסיון
- [ ] שקף תרגול — משימה ברורה עם זמן ותוצר מצופה
- [ ] קריאות לפעולה — "רוצים משוב? שלחו הודעה" (לא "שלחו תוצרים")
- [ ] פרומפטים באנגלית — כולם עם תרגום עברי

**אם נמצאו בעיות:** תקן אותן לפני שמציג למייטל. אם הבעיה דורשת החלטה — שאל.

---

## פלט סופי

```
docs/training/{tool-name}/
├── presentation.html    ← מצגת ראשית
├── screenshots/         ← צילומי מסך (אם יש)
├── reel-9x16.mp4        ← רילס (אם נוצר)
├── infographic.html     ← אינפוגרפיקה (אופציונלי)
└── practice.html        ← סימולציה (אופציונלי)
```

---

## Reference — מצגות מאושרות

כשמשהו לא ברור — תסתכל על אלה:
- **`docs/training/claude-design/presentation.html`** — הכי עדכנית! Dream Theme + כרטיסיות צפות (22 שקפים, אפריל 2026)
- `docs/training/pomelli/presentation.html` — BA slider, flow chart, copy prompts (עיצוב ישן)
- `docs/training/stitch/presentation.html` — BA slider, flow chart (עיצוב ישן)
- `docs/training/claude-code/intro.html` — קרוסלה + lightbox (עיצוב ישן)

---

## קהל יעד

מורים, מדריכים, רכזי טכנולוגיה. שפה מקצועית-נגישה.
- דוגמאות מחינוך כללי (עברית, היסטוריה, אזרחות) — **לא** עיצוב שיער
- מונחים טכניים עם הסבר בסוגריים
- Claude Code תמיד עם חלופה ("אין לכם? אפשר ב-Canva/PowerPoint")