זה יותר ממדריך אחד
11 קורסים ו-26 מדריכים חינמיים על אוטומציית AI לעסקים — ומעבר לכך.
ערכת עיצוב ל-Claude Code ול-Codex: מה לקחת מפרומפט של 15 מאגרים
ממשקים שסוכן בונה נראים לעיתים קרובות אותו דבר: גרדיאנט סגול, שלושה כרטיסים, אותו פונט. מחבר של פוסט ב-X הרכיב נגד זה פרומפט אחד. עברנו על כל מאגר ובנינו גרסה שבה הסקילים לא מתווכחים זה עם זה.
מה בפנים
חינם, במלואומה יש בתוך פרומפט אחד
מאגרים מתקין פרומפט אחד
סקילים, ספריות רכיבים ו-Figma MCPכוכבים לגדול ולפחות מוכר
anthropics/skills ו-lucian-uxui, נכון ל-16.10.2026סקילים מגיעים משני מאגרים בלבד
taste-skill ו-design-taste, אם מתקינים אותם במלואםמי אחראי על מה
סקיל הוא תיקייה עם הוראות שהסוכן טוען כשהמשימה מתאימה לתיאור שלה. הפרומפט מתקין תשעה מאגרים כאלה ברמה הגלובלית. התשיעי, lucian-uxui, מושך רכיבים מוכנים מהאתר של המחבר דרך הרשת, ובזמן הבדיקה היו לו 7 כוכבים.
הסקיל של Anthropic: קודם להבין למי המוצר מיועד, ואז לבחור פונט, פלטה וגריד שמתאימים לנושא, ולא מתוך הרגל.
סקיל אחד ו-24 פקודות: ביקורת, הערות, ליטוש. לפני המסירה הוא בודק את הדף מול הסימנים הטיפוסיים של עימוד שנוצר ב-AI.
אנימציות ומעברים: אילו עקומות, משכי זמן ונקודות מוצא לבחור כדי שהתנועה לא תיראה זולה.
ארט דיירקשן לדפי נחיתה ולאתרים. במאגר 12 סקילים, ופקודת ההתקנה כברירת מחדל מתקינה את כולם.
מדריך עם חיפוש של סגנונות, פלטות וזוגות פונטים. החיפוש דורש Python 3.
מערכות עיצוב מוכנות ברוח Linear, Stripe ו-Vercel עבור shadcn/ui.
סוכן עיצוב עם קנבס אינסופי. עובד דרך CLI משלו והתחברות לחשבון בשירות.
24 סקילים נגד המראה התבניתי: מסקיל כללי ועד סגנונות צרים כמו ברוטליזם ויוקרה שקטה.
מה לא להתקין גלובלית
כאן מחבר הפרומפט צודק: ספריות רכיבים מחברים לפרויקט מסוים כשהוא צריך אותן. לסוכן מספיק לדעת שהן קיימות.
arc-library
רכיבים ובלוקים ל-React עם אנימציה מובנית, מותקנים דרך shadcn CLI.
motion-primitives
רכיבי תנועה על Motion ו-Tailwind CSS. הפרויקט בבטא: הרכיבים והקוד עדיין משתנים באופן ניכר.
canvas-ui
אפקטים ב-WebGL מעל הדף: נוזל, אובייקטים בתלת-ממד. חלק מהאפקטים דורשים דגל ב-Chrome.
paper-design/shaders
רקעי גרדיאנט חיים על שיידרים, מותקנים מ-npm ל-React או לדף רגיל. המחברים מבקשים לקבע גרסה: עוד יהיו שינויים שוברים.
ui-layouts
בלוקים יצירתיים על Tailwind ו-Motion, כשצריך לא תבנית אלא סקשן יוצא דופן.
Figma-Context-MCP
מאפשר לסוכן לקרוא עיצוב מקישור ל-Figma. בלי טוקן אישי של Figma זה לא יעבוד.
איך למנוע מהסגנונות להתנגש
בניתוב של הפרומפט יש כלל נכון: סקיל טעם אחד בכל פעם, לא לערבב סגנונות. אבל ברמה הגלובלית הוא מתקין לפחות חמישה סקילים, וכל אחד מהם רוצה לבחור בעצמו את כיוון העיצוב, והסוכן רואה את כולם בכל סשן. לכן אנחנו מתקינים ליבה של שלושה סקילים עם תפקידים שונים, ואת השאר מוסיפים לפי המשימה.
התקינו את הליבה וכתבו את הניתוב
שלושה פרומפטים לפי הסדר. הם עובדים גם ב-Claude Code וגם ב-Codex: הסוכן יזהה בעצמו מי הוא ולאן לשים את הקבצים. את הפרומפטים השארנו באנגלית.
01.התקנת הליבה
שלושה סקילים עם תפקידים שונים: בחירת כיוון, אנימציות, בדיקה לפני מסירה.
Install a design kit into this agent. First work out who you are: Claude Code (rules file ~/.claude/CLAUDE.md) or Codex (rules file ~/.codex/AGENTS.md).
Install only three repositories globally, each following its official README:
1. anthropics/skills, only the frontend-design skill
2. emilkowalski/skills
3. pbakaus/impeccable
If the README only has a Claude Code plugin command and you are Codex, use npx skills add or copy the files by hand into the folder the README names.
Do not install anything that needs an account, a token or a login: list those steps separately and ask me.
At the end, show a table: what got installed, what didn't and why, and which folder the files went into.02.סעיף הניתוב
כלל שקובע איזה סקיל לאיזו משימה. בלעדיו הסקילים המותקנים מתווכחים.
Add a section called "Design: which skill when" to the rules file. Only mention skills that are actually installed, skip the rest.
- New interface: frontend-design first. Pick one direction and name it in words before the first line of code.
- Existing interface: don't change the style, use the project's colours, fonts and components.
- Animations and transitions: the emilkowalski skills.
- Components and effects: only from libraries the project already has. Suggest a new library, don't install it.
- Given a Figma link: Figma MCP, if it is connected.
- Before handing off: check with impeccable and fix what it finds.
- One taste skill per task, don't mix styles.
Show me the full section before writing it to the file.03.ביקורת על מה שכבר מותקן
אם כבר הרצתם את הפרומפט המקורי במלואו, התחילו מכאן.
List every installed skill that deals with interface design: name, folder, source repository. Flag the pairs that give conflicting advice on style, fonts, colours or animation. Suggest what to remove or disable so that each task is left with one skill. Don't delete anything, answer with a table.פקודות ההתקנה משתנות מגרסה לגרסה: אם הסוכן כותב שהפקודה לא נמצאה, בקשו ממנו לקרוא שוב את ה-README.
לפני ההתקנה ואחריה
הכינו מראש
- Node.js: רוב הסקילים מותקנים דרך npx
- ל-taste-skill: Node 22+ ו-Chrome, Edge או Chromium מותקנים
- ל-Figma MCP: טוקן אישי של Figma, אחרת דלגו על הסעיף הזה
- ל-superdesign: חשבון באתר השירות והתחברות דרך ה-CLI שלו
- ב-Codex ה-hook של impeccable הוא ברמת הפרויקט: פתחו את /hooks ואשרו אותו בכל פרויקט
בדקו אחרי
- הסוכן הציג טבלת התקנה, ואין בה כשלים שקטים
- הקבצים נמצאים במקום שבו הסוכן שלכם מחפש אותם: ב-Codex מאגרים שונים מציינים תיקיות שונות
- סעיף הניתוב נכתב לקובץ הכללים ולא נשאר בצ'אט
- בדף בדיקה הסוכן ציין כיוון עיצוב אחד לפני הקוד
ערכת עיצוב משלכם בערב אחד
מה לעשות שלב אחר שלב. איך בדיוק, תחליטו אתם והסוכן שלכם.
01.התחלה בלי סקילים
בקשו מהסוכן לבנות דף אחד כמו שהוא ושמרו את התוצאה: מולה תשוו.
איפה הערכה לא תעזור
- 01
סקיל נותן לסוכן כללים, אבל הוא לא מכיר את המוצר שלכם. בלי משימה ברורה לגבי הקהל ותפקיד הדף, טעם לא יופיע.
- 02
אם לפרויקט כבר יש מערכת עיצוב, סקילים לבחירת סגנון יפריעו לה: השאירו רק אנימציות ובדיקה.
- 03
כוכבים אינם ערובה לאיכות: חלק מהמאגרים בפרומפט צעירים מאוד, וכדאי לקרוא את ההוראות שלהם לפני ההתקנה.
- 04
ספריות הרכיבים מיועדות בעיקר ל-React ול-Tailwind. בסטאק אחר תצטרכו להעביר אותן ידנית.
שליטה ב-Claude Code: מאפס למשתמש מתקדם
בקורס על Claude Code סקילים, קובץ הכללים, hooks ו-MCP מוסברים על פרויקטים אמיתיים: איך להתקין אותם, איך לבדוק אותם ומתי להסיר.
על המקור
את הפרומפט המקורי פרסם codila ב-X ב-15.10.2026, הקישור בראש הדף. בדקנו כל מאגר מול ה-README שלו, אבל גרסאות, פקודות התקנה וכוכבים משתנים: הנתונים נכונים ל-16.10.2026, בדקו את המצב העדכני לפני ההתקנה.
הפוסט עם הפרומפטעברו את כל הדרך
המדריך נותן כיוון. בקורסים עוברים מהפרומפט הראשון ועד תוצאה עובדת: סוכנים, אוטומציה ועבודה ב-Claude Code.
תגובות