מה זה algorithmic-art?
algorithmic-art הוא סקיל רשמי של Anthropic שבו Claude כותב אמנות גנרטיבית בקוד, בעזרת הספרייה p5.js. במקום תמונה אחת מקבלים אלגוריתם חי בקובץ HTML אחד, עם מחוונים לשינוי פרמטרים, מעבר בין זרעים שמייצרים וריאציות שונות וכפתור להורדת PNG.
אמנות גנרטיבית היא עבודה שבה האמן כותב את הכללים והמחשב מצייר לפיהם. אותו קוד מייצר תוצאה שונה בכל "זרע" (seed), ואותו זרע מייצר תמיד בדיוק את אותה תוצאה. הסקיל algorithmic-art מלמד את Claude לעבוד בשיטה הזו: שדות זרימה (flow fields) שמבוססים על רעש, מערכות חלקיקים, מבנים שמתפצלים ברקורסיה ואריזת עיגולים, כשהבחירה בטכניקה נגזרת מהרעיון ולא מתפריט קבוע.
כמו אצל האח שלו canvas-design, גם כאן העבודה מתחילה בכתב. Claude מנסח "פילוסופיה אלגוריתמית": שם לתנועה בת מילה או שתיים וארבע עד שש פסקאות על התהליך, הרעש, התנהגות החלקיקים והשינוי לאורך זמן. רק אחר כך הוא כותב את הקוד, ומשלב בו רפרנס עדין לנושא שביקשתם, כך שהיצירה נשארת מופשטת אבל מי שמכיר את הנושא מזהה אותו.
התוצר הוא קובץ HTML עצמאי שנבנה מתוך תבנית קבועה שמגיעה עם הסקיל (templates/viewer.html). בצד המסך יש ניווט בין זרעים (הקודם, הבא, אקראי וקפיצה למספר), מחוונים לכל פרמטר שהאלגוריתם צריך, בוחרי צבע כשזה רלוונטי, וכפתורים ליצירה מחדש, איפוס והורדת PNG. הקובץ נפתח בכל דפדפן בלי שרת, כך שלעסק יש מכונה קטנה שמייצרת רקעים ודפוסים ייחודיים שוב ושוב.
למי זה מתאים
- עסקים שמפרסמים הרבה בסושיאל ורוצים רקעים ודפוסים ייחודיים במקום תמונות סטוק
- מעצבים וסוכנויות שמחפשים שפה ויזואלית גנרטיבית למותג, לאריזה או לאתר
- מי שרוצה להציג ללקוח עשרות וריאציות של אותו רעיון ולתת לו לבחור בעצמו
- מפתחים וסקרנים שרוצים ללמוד p5.js דרך דוגמאות עובדות ומוסברות
מה הוא עושה
זרעים שמבטיחים שחזור
כל יצירה משתמשת ב-randomSeed וב-noiseSeed, כך שאותו מספר זרע מייצר תמיד את אותה תמונה. מצאתם וריאציה שאהבתם, רושמים את המספר וחוזרים אליה מתי שרוצים.
צופה אינטראקטיבי מוכן
התבנית viewer.html כוללת סרגל צד קבוע עם ניווט בין זרעים, קטע פרמטרים, צבעים אופציונליים וכפתורי פעולה. Claude מחליף רק את האלגוריתם ואת המחוונים.
הורדת PNG בלחיצה
בין כפתורי הפעולה יש Download PNG, ולכן מהצופה עצמו מקבלים קובץ תמונה שאפשר להעלות לאינסטגרם, לאתר או לשלוח לדפוס.
פרמטרים שנגזרים מהרעיון
הסקיל מבקש לחשוב אילו תכונות של המערכת כדאי לכוונן: כמויות, קנה מידה, הסתברויות, זוויות וספים. כל פרמטר מקבל מחוון עם עדכון בזמן אמת.
קובץ אחד בלי התקנות
p5.js נטען מ-CDN וכל השאר כתוב בתוך הקובץ. אפשר לפתוח אותו בדפדפן, לשלוח ללקוח במייל או להציג כארטיפקט ב-Claude.ai.
וריאציות בכמות
לפי הסקיל אפשר לבקש 100 וריאציות (זרעים 1 עד 100), להוסיף כפתורי קיצור לזרעים נבחרים, או מצב גלריה שמציג כמה זרעים זה לצד זה.
פילוסופיה כתובה
לפני הקוד Claude מסביר במילים את הגישה החישובית. זה עוזר להבין למה היצירה נראית כך ולכוון את הסבב הבא.
דוגמאות שימוש
מה כותבים ל-Claude אחרי ההתקנה, ומה מקבלים.
רקעים שבועיים לאינסטגרם
תשתמש בסקיל algorithmic-art ותיצור מערכת רקעים לפוסטים של סטודיו לפילאטיס: תנועה רכה, זורמת, בגווני חול וירוק זית. אני רוצה לבחור כל שבוע זרע אחר ולהוריד PNG.מה מקבלים: קובץ HTML עם שדה זרימה עדין, מחוונים לצפיפות ולמהירות, בוחרי צבע וכפתור הורדה, שמייצר רקע חדש בכל זרע.
דפוס לאריזה של בית קלייה
תיצור דפוס גנרטיבי לשקיות הקפה של בית קלייה קטן. הרעיון: פולים שמתפזרים ומתקבצים. תכין 100 וריאציות ותוסיף מצב גלריה שאוכל להראות לבעלים.מה מקבלים: אלגוריתם עם אריזת עיגולים ופיזור מבוקר, ניווט בזרעים 1 עד 100 ותצוגת גלריה להשוואה מהירה.
רקע חי ל-Hero באתר
אני צריך רקע אנימטיבי לאזור העליון באתר של משרד אדריכלים. קווים דקים שנבנים לאט לרשת. תן לי את הקוד כך שאוכל לשלב אותו בדף שלי.מה מקבלים: סקיצת p5.js אנימטיבית עם פרמטרים לעובי קו, מהירות וצפיפות, ובסיס קוד שמפתח יכול להטמיע באתר.
וריאציות לפגישת מיתוג
לקוח שלנו הוא חברת אנרגיה סולארית. תכתוב פילוסופיה אלגוריתמית שמתכתבת עם אור ותנועה, ותיצור יצירה שאפשר לעבור בה בין זרעים בזמן הפגישה.מה מקבלים: מסמך פילוסופיה קצר וקובץ HTML אינטראקטיבי שמאפשר להציג ללקוח עשרות כיוונים בתוך דקות.
מה צריך לפני שמתחילים
- Claude Code, או מנוי בתשלום ל-Claude.ai שבו הסקילים של Anthropic כבר זמינים
- Git מותקן לצורך ההתקנה
- דפדפן מודרני לצפייה בקובץ, עם חיבור לאינטרנט כדי לטעון את p5.js מ-CDN
- אין צורך במפתח API ואין עלות מעבר לשימוש ב-Claude
אין עדיין Claude Code? במדריך הזה יש התקנה צעד אחרי צעד.
איך מתקינים את algorithmic-art.
יש 4 דרכים, ומספיקה אחת מהן. הראשונה הכי פשוטה, בלי קוד בכלל.
הכי פשוט: באפליקציה של Claude, בלי שום קוד
מתאים ל-Claude במחשב ובדפדפן. לוקח דקה, ועושים את זה פעם אחת.
- מורידים את הסקילהורדת algorithmic-art.zip (19 KB)לא פותחים את הקובץ, מעלים אותו כמו שהוא.
- מדליקים פעם אחת את היכולתב-Claude נכנסים ל-Settings, ואז Capabilities, ומדליקים את
Code execution and file creation. - מעלים את הקובץנכנסים ל-Customize, ואז Skills, לוחצים על הפלוס, בוחרים
Create skillואזUpload a skill, ובוחרים את הקובץ שהורדתם. - זהו, עובדיםמבקשים מ-Claude את המשימה במילים רגילות, והוא משתמש בסקיל לבד כשהוא רלוונטי.
ב-Claude Code: מדביקים הודעה אחת
פותחים שיחה חדשה ב-Claude Code, מעתיקים את ההודעה ומדביקים. כש-Claude מבקש אישור להריץ, לוחצים Allow.
תתקין לי את הסקיל algorithmic-art של Anthropic מ-GitHub. תריץ את הפקודה הבאה ותגיד לי כשהיא מסתיימת: D="$(mktemp -d)" && git clone --depth 1 -q https://github.com/anthropics/skills "$D/repo" && mkdir -p ~/.claude/skills && cp -R "$D/repo/skills/algorithmic-art" ~/.claude/skills/ && rm -rf "$D" && echo "הותקן ✓"
דרך הפלאגינים של Claude Code
מקלידים בצ'אט של Claude Code את שתי הפקודות, אחת אחרי השנייה. את הפקודות מקלידים בעצמכם בחלון של Claude Code. הפלאגין example-skills מתקין את algorithmic-art יחד עם 11 סקילים נוספים של Anthropic. מי שרוצה רק את הסקיל הזה משתמש בפקודת ההתקנה הידנית, ולא בשתי הדרכים יחד.
/plugin marketplace add anthropics/skills
/plugin install example-skills@anthropic-agent-skills
בטרמינל, ידנית
למי שמעדיף להריץ בעצמו. מעתיקים לטרמינל ומריצים.
D="$(mktemp -d)" git clone --depth 1 -q https://github.com/anthropics/skills "$D/repo" mkdir -p ~/.claude/skills cp -R "$D/repo/skills/algorithmic-art" ~/.claude/skills/ rm -rf "$D"
אין הגדרות ואין מפתחות, ואם הסקיל לא מופיע מיד פותחים סשן חדש של Claude Code. בהתקנה כפלאגין צריך להפעיל מחדש את Claude Code.
- מקלידים / בסשן חדש ובודקים ש-algorithmic-art מופיע ברשימה
- שואלים את Claude "אילו סקילים יש לך?"
- בטרמינל מריצים ls ~/.claude/skills/algorithmic-art ומוודאים שיש SKILL.md ותיקייה בשם templates
מוחקים את התיקייה עם rm -rf ~/.claude/skills/algorithmic-art ומריצים שוב את פקודת ההתקנה. בהתקנה כפלאגין מריצים claude plugin update example-skills@anthropic-agent-skills ומפעילים מחדש את Claude Code.
rm -rf ~/.claude/skills/algorithmic-art
איך משתמשים ביום יום
- מבקשים אמנות גנרטיבית, אמנות בקוד, flow field או מערכת חלקיקים, ו-Claude טוען את הסקיל לבד. אפשר גם לכתוב /algorithmic-art ואחריו את הבקשה.
- מתארים תחושה ונושא ולא טכניקה, כי הסקיל מורה ל-Claude לגזור את האלגוריתם מהרעיון, ולכן "רגוע כמו גאות ושפל" עובד טוב יותר מ"תעשה Perlin noise".
- פותחים את קובץ ה-HTML בדפדפן, משחקים עם המחוונים ועוברים בין זרעים עד שמוצאים תוצאה שאוהבים.
- רושמים את מספר הזרע ואת ערכי הפרמטרים של התוצאה שבחרתם, ומורידים PNG בכפתור ההורדה.
- לשינוי כיוון מבקשים מ-Claude לעדכן את הפילוסופיה או להוסיף פרמטר חדש, והוא יעדכן גם את הקוד וגם את המחוונים.
טיפים שימושיים
- הצופה שומר בכוונה על מיתוג קבוע של Anthropic (גופנים וצבעי ממשק). זה משפיע רק על הממשק מסביב ולא על צבעי היצירה עצמה.
- לשימוש בסושיאל בקשו קנבס בגודל המתאים, למשל 1080 על 1350, במקום ברירת המחדל של 1200 על 1200.
- אם אתם צריכים וידאו ולא תמונה, אפשר לשלב את האלגוריתם בפרויקט Remotion בעזרת הסקיל remotion-best-practices.
- שמרו את קובץ ה-HTML בתיקייה של הלקוח. הוא המקור שממנו תוכלו להפיק עוד וריאציות בעתיד.
תקלות נפוצות
הקובץ נפתח אבל הקנבס ריק
היצירה איטית או נתקעת
אותו זרע נותן תוצאה שונה
הסקיל לא מופיע אחרי ההתקנה
שאלות ותשובות
צריך לדעת לתכנת?
מה זה זרע (seed)?
אפשר להשתמש ביצירות מסחרית?
מה ההבדל בינו לבין canvas-design?
זה עובד גם ב-Claude.ai?
קרדיט ומקור. algorithmic-art נכתב על ידי Anthropic ונמצא ב-anthropics/skills ברישיון Apache-2.0. את העמוד כתב קורן בן עזרא אחרי בדיקה של המאגר ושל פקודות ההתקנה (29.09.2026). מאגרים מתעדכנים, ולכן אם משהו השתנה, המאגר הוא המקור הקובע.