UX UI Agent Skills: מוח עיצובי חינמי ל-Claude Code ולסוכנים אחרים

בקצרה: UX UI Agent Skills היא ערכה חינמית ברישיון MIT שמלמדת סוכני קוד לעצב. יש בה סקילים, טוקנים עיצוביים, מפרטי רכיבים, יעדי נגישות וכ-50 בדיקות אוטומטיות שבודקות את התוצאה. היא מותקנת כתוסף ל-Claude Code, ועובדת גם עם Codex, Cursor וסוכנים נוספים דרך קובץ AGENTS.md. יש לה כ-2,300 כוכבים ב-GitHub.

הבעיה שהיא פותרת

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

מה יש בפנים

היוצר מתאר את הערכה כשכבה של הוראות וידע בלבד. אין שלב בנייה ואין סביבת הרצה משלה, רק קבצים שהסוכן קורא. לפי ה-README, הערכה כוללת:

• 25 סקילים שאפשר להריץ למשימות עיצוב.
• טוקנים עיצוביים בפורמט DTCG, כדי שצבעים, ריווחים וטיפוגרפיה יישארו עקביים.
• 52 מפרטי רכיבים שמתארים איך רכיבי ממשק נפוצים צריכים להיראות ולהתנהג.
• יעדי נגישות לפי WCAG 2.2.
• הפניות ל-138 מערכות עיצוב ו-16 מתאמים לפריימוורקים שונים.
• סוכן מבקר עיצוב וסדרה של "שערים" אובייקטיביים שבודקים את העבודה במקום לסמוך על דעתו של הסוכן.

איך מתקינים

ב-Claude Code מספיקות שתי פקודות כדי להוסיף אותה כתוסף:

• /plugin marketplace add plugin87/ux-ui-agent-skills
• /plugin install ux-ui-agent-skills@ux-ui-agent-skills

ה-README מציע גם דרכים אחרות: שרת MCP, Homebrew או npx ux-ui-agent-skills init. בסוכנים שקוראים AGENTS.md, כמו Codex ו-Cursor, כללי העיצוב נכתבים ישירות לתוך הקובץ.

הרבה מהשערים פותחים דפדפן אמיתי כדי לבדוק את הדף. בשבילם צריך להריץ npm install ו-npx playwright install chrome. אם מדלגים על זה, לפי ה-README השערים האלה מדווחים על כישלון ולא עוברים בשקט, וזו בדיוק ההתנהגות הישרה שרוצים.

למי זה מתאים

• יוצרים ומייסדים עצמאיים שבונים בעצמם אתרים וכלים עם Claude Code ורוצים שייראו מקצועיים.
• בוני סוכנים שרוצים שאיכות העיצוב תיבדק לפי כללים ולא לפי "נראה לי בסדר".
• משווקים שבונים דפי נחיתה ואכפת להם מנגישות ומעקביות מותגית.
• מפתחים שאינם מעצבים ורוצים ברירות מחדל הגיוניות.

על מה לשים לב

• זה הרבה חומר. טעינה של תורת עיצוב גדולה לסוכן צורכת הקשר. התחילו מהסקילים שאתם באמת צריכים.
• פחות יכולות מחוץ ל-Claude Code. במסלול של AGENTS.md אין סקילים ו-hooks. מקבלים את הכללים, אבל לא את כל הכלים.
• בדיקות הדפדפן דורשות הכנה. בלי Playwright ו-Chrome מותקנים, חלק גדול מהשערים ייכשל.
• המספרים לא תמיד תואמים. תיאור הפרויקט וה-README לא מסכימים על מספר השערים המדויק, אז התייחסו למספרים כהערכה.
• לא ממזגים תרומות קוד. המתחזק מבקש דיווחי באגים והצעות במקום, כך שהשינויים תלויים באדם אחד.
• בדיקות טובות לא מחליפות טעם אישי. התייחסו לתוצאה כטיוטה ראשונה חזקה, ועדיין תסתכלו עליה בעצמכם.

מקור: plugin87/ux-ui-agent-skills ב-GitHub

עוד כלים ופרומפטים מוכנים ב-masterphub.io