HyperFrames - שיטות עבודה מומלצות
אמין88/100שיטות עבודה להפקת וידאו מקוד עם HyperFrames: קומפוזיציות שהן פשוט HTML + GSAP שמתרנדרות ל-MP4, עם תמיכה מלאה בעברית ו-RTL. הסקיל מסביר איך כותבים קומפוזיציה, מה עושים מאפייני data-* לתזמון, איך עובדים עם ה-Timeline של GSAP ושיטת Layout-Before-Animation, איך מטפלים ב-Visual Identity Gate, איך לטעון פונטים עבריים (Heebo, Rubik, Assistant) בלי `<link>` או `@import`, איפה שמים dir="rtl", איך מפיקים כתוביות עברית עם Whisper ומתמודדים עם קריינות בעברית כש-Kokoro המובנה לא תומך, איך להוסיף אפקטים שמגיבים לאודיו ומעברי סצנות, ואיך לעטוף טקסט מעורב עברית+אנגלית ב-<bdi>. מתאים לבניית תוכן וידאו מבוסס-HTML וסרטוני סושיאל ושיווק בעברית בלי React. לא מתאים ל-Remotion או לעבודת וידאו ב-React, שם השתמשו ב-remotion-best-practices.
ציון אמינות 88/100 (אמין) · 3 תורמים ב-GitHub · רישיון MIT
שלוש בעיות עיקריות מחכות למי שבונה סרטון בעברית ב-HyperFrames. ראשית, טעינת פונטים עבריים (Heebo, Rubik, Assistant) עובדת מצוין, אבל רק אם לא מוסיפים `<link>` או `@import` כמו שרוב האנשים רגילים, המהדר כבר מטפל בזה. שנית, dir="rtl" לא נרשם לבד לכל מקום נדרש, ו-GSAP לא הופך את כיווני הכניסה של אנימציות בשבילכם. שלישית, הקריינות המובנית (Kokoro-82M) תומכת ב-8 שפות בלבד ועברית לא ברשימה, אז קריינות עברית חייבת לבוא משירות חיצוני (ElevenLabs, OpenAI, Google Cloud TTS).
skills-ilnpx skills-il add skills-il/developer-tools --skill hyperframes-best-practices -a claude-codeהתקנה דרך Claude.ai, Claude Desktop, ChatGPT, Manus ופלטפורמות נוספות
- 1. לחצו "הורדת ZIP" להורדת קבצי הסקיל.
- 2. פתחו את Claude Desktop ולכו ל-Customize > Skills.
- 3. לחצו על "+" ובחרו "Upload a skill", ואז העלו את קובץ ה-ZIP.
- 4. פתחו שיחה חדשה. הסקיל יופעל אוטומטית כשהנושא רלוונטי.
מתי להשתמש
- בונים תוכן וידאו מבוסס-HTML לקהל ישראלי (סושיאל, שיווק, הסברה) בלי להחזיק סטאק React
- מייצרים TikTok, Reels או Shorts בעברית עם כתוביות והדגשת מילה-במילה
- מפיקים סרטוני הסברה בעברית עם קריינות AI ששומרת על דטרמיניסטיות הרנדר
- צריכים תוכן מותגי דו-לשוני עברית+אנגלית שלא מתקלקל בגלל כיווני bidi
- עוברים מ-Remotion לסטאק וידאו מבוסס-HTML, בלי קומפילציה ובלי React
נסו את הפרומפטים האלה
צרו קומפוזיציית HyperFrames בעברית במידות 1920x1080, באורך 10 שניות, עם כותרת ותת-כותרת. השתמשו בפונט Heebo (המהדר מוריד אותו אוטומטית מ-Google Fonts), שימו dir="rtl" על ה-.scene-content, ואנימציות כניסה של GSAP שמגיעות מצד ימין (x חיובי). רקע כהה, תנועה שקטה.
בנו ריל אנכי 1080x1920 ל-TikTok עם קריינות עברית (narration-he.wav) וכתוביות עם הדגשת מילה-במילה. תמללו עם npx hyperframes transcribe narration-he.wav --model medium --language he. הציגו עד 3 מילים על המסך בו-זמנית, והדגישו את המילה הפעילה בצבע accent. כתוביות ב-Rubik Black 900.
הפיקו סרטון הסברה בעברית באורך 60 שניות. Kokoro המובנה לא תומך בעברית, לכן מייצרים את הקריינות ב-ElevenLabs (קול עברי, 22kHz, mono), שומרים כ-narration.wav, וטוענים ב-HyperFrames כאלמנט <audio data-start="0" data-duration="60" data-track-index="2">. מסנכרנים כתוביות ברמת המילה, ומוסיפים 3 סצנות עם crossfade ביניהן.
צרו קומפוזיציה עם שם מותג באנגלית (Acme) משובץ בתוך כותרות עבריות. עטפו את כל ה-runs של האנגלית ב-<bdi>, הגדירו font-family Heebo לעברית ו-Inter לאנגלית, וודאו שגם הפיסוק נשאר בצד הנכון של כל פסקה.
שאלות נפוצות
סקילס קשורים
יוצר: skills-ilשכבת התאמות לעברית מעל video-use של browser-use. שני מסלולים: (א) captions-only.sh, סקריפט אחד שלוקח וידאו ארוך, מתמלל ב-Scribe, וצורב כתוביות בעברית על הכל. עולה $1-3 בלי קשר לאורך הסרטון. (ב) זרימת ה-cut המלאה של video-use לעריכת חומר גלם לטיזרים, יקרה יותר. הסקיל מכסה: החלפה של SUB_FORCE_STYLE, תיקון BiDi דרך python-bidi (libass+SRT לא מטפלים בכיוון נכון ב-macOS), זיהוי תווי גרבג של Scribe (Devanagari ושאר אותיות זרות שמתערבבות בתמליל עברי), מעבר נוסף למילות מילוי בעברית, פרמטר fontsdir= לזיהוי פונטים אמין, ופרוטוקול בדיקה עצמית של דגימת פריימים. השתמשו לכל סרטון עברי שצריך כתוביות או עריכה עם video-use. אל תשתמשו לסשנים שאינם בעברית, לפוסט פרודקשן של אודיו בלבד, או לעבודת FFmpeg כללית בלי video-use.
יוצר: skills-ilשיטות עבודה לפיתוח מצגות ב-open-slide: הקאנבס הקבוע 1920×1080, חוזה הקובץ של slides/<id>/index.tsx, סקאלת טיפוגרפיה, הטוקנים של DesignSystem, מערכת הערכאות (themes), הסמני @slide-comment של האינספקטור, ועיבוד טקסט עברי עם תמיכת RTL מלאה. מכסה פונטים עבריים מ-Google Fonts (Heebo, Rubik, Assistant, Noto Sans Hebrew), CSS לוגי (paddingInlineStart במקום paddingLeft), ערבוב עברית-אנגלית עם <bdi>, התאמת סקאלת הטיפוגרפיה לעברית, וטיפול ב-themes/ ובקבצי הערכאות. השתמשו בכל פעם שאתם כותבים או עורכים קוד ב-slides/<id>/ של פרויקט open-slide, או כשאתם בונים מצגת בעברית או דו-לשונית על הפריימוורק. אל תשתמשו ליצירת וידאו (השתמשו ב-remotion-best-practices או ב-hyperframes-best-practices), או למצגות עבריות גנריות מחוץ ל-open-slide (השתמשו ב-presentation-generator).
יוצר: skills-ilמנתחים ומשפרים ביצועי צ'אטבוטים בעברית: אנליטיקת זרימת שיחה, ניתוח סנטימנט בעברית, זיהוי נקודות נטישה, מדידת שביעות רצון, A/B לווריאציות תגובה ודשבורדים לדיווח.
השימוש על אחריותכם בלבד. תנאי שימוש · אבטחה
רוצים לבנות סקיל משלכם? נסו את יוצר הסקילס · הגשת סקיל