Installs into .claude/skills of the current project.
Are you the author of Mf Generative?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/arielaizn-mf-generative)
---
name: mf-generative
description: אנימציה גנרטיבית בקוד - אלפי חלקיקים, flow fields, טקסט או לוגו שמתפרקים לחלקיקים ומתאחים, נחילים, קווי זרימה, צמיחה (L-systems), גלים, צורות שנושמות לפי המוזיקה. הפעל כשמבקשים "פרטיקלים", "חלקיקים", "גנרטיבי", "flow field", "אמנות גנרטיבית", "טקסט שמתפרק", "generative art", "particles", "audio reactive", "creative coding". חלק מ-Motion Forge; קרא קודם את motion-forge.
---
# mf-generative · מערכות שמציירות
סרט דוגמה: `../motion-forge/studio/gallery/09_particles.html`. כלים: `noise2`, `fbm`, `hash`, `rng`, `FX.glow`, `layer`.
## הבעיה המרכזית: דטרמיניזם
סימולציה רגילה זוכרת את הפריים הקודם, וזה שובר את חוזה הסרט. שלוש דרכים נכונות:
1. **פונקציה סגורה של t (עדיף).** מיקום כל חלקיק = נוסחה: `start + dir * t + curl(noise)(i, t)`. לחלקיק i יש זרע `hash(i)`.
2. **אינטגרציה עם checkpoints.** צעד קבוע (למשל 1/60), ומטמון של מצב כל 30 פריימים. פריים f מתחיל מה-checkpoint
הקרוב ומתקדם. ב-`setup()` מחשבים את כל ה-checkpoints פעם אחת.
3. **נתיבים מחושבים מראש.** ב-`setup()` מריצים את כל הסימולציה ושומרים מיקומים לכל פריים (Float32Array). מתאים עד
כ-5,000 חלקיקים × 300 פריימים.
## טקסט ולוגו לחלקיקים
1. ב-`setup()`: צייר את הטקסט לקנבס קטן, קרא פיקסלים (`getImageData`), דגום נקודות יעד מהפיקסלים המלאים (צעד 3 עד 6px).
2. לכל חלקיק: מיקום התחלה (פיזור, מעגל, מחוץ למסך), השהיה `hash(i) * .6`, ותנועה ליעד ב-spring או `E.snappy`
עם רעש שדועך ככל שמתקרבים.
3. פירוק: הפוך את הכיוון, עם רוח (`noise2`) ו-fade.
4. ציור: `c.fillRect` קטנים מהירים יותר מ-`arc`. אלפי חלקיקים: קבץ לפי צבע, `globalCompositeOperation = 'lighter'` לזוהר.
## flow field
זווית בכל נקודה = `noise2(x * s, y * s + t * .1) * TAU * 2`. קווים: לכל נקודת התחלה עקוב 40 עד 120 צעדים ושמור את הנתיב
ב-`setup()`; בזמן הסרט חשוף אותם עם trim (`P.trim`). פסים עם שקיפות נמוכה ו-lighter יוצרים משי.
## תגובה למוזיקה
הפסקול כתוב בקוד, אז אתה יודע מראש מתי כל ביט: `const B = tempo(bpm)`, ו-`B.pulse(t)` נותן 1 על הביט ודעיכה אחריו.
הזן אותו לגודל, לזוהר, לפיזור. לאירועים (impact, drop) השתמש באותם זמנים ב-`draw` וב-`score`.
## ביצועים
עד 20,000 חלקיקים ב-2D סבירים אם הציור פשוט. glow על הכל: צייר את החלקיקים לשכבה בחצי רזולוציה, טשטש, והוסף.
מעבר לזה: שיידר (`mf-shader`).
## סאונד
`A.groove('ambient' | 'minimal')`, `A.shimmer` על התכנסות, `A.riser` לפני פיצוץ, `A.impact` על ההתאחות, `A.wind` כרקע.
