המדריך מהריל · מילת הקוד: עיצוב
מערכת עיצוב לפני הקוד: ui-ux-pro-max
כשמבקשים מ-AI לבנות אתר בלי הנחיות עיצוב, הוא מנחש צבעים ופונטים. ui-ux-pro-max הוא סקיל שעושה את שלב העיצוב קודם: מתארים לו את העסק, והוא מחזיר מערכת עיצוב עם סגנון, צבעים, פונטים וכללים. כאן תמצאו מה יש בו, איך מתקינים אותו, את הפקודה שהרצנו לסטודיו פילאטיס, ושני דברים שכדאי לדעת לפני שמשתמשים בו לאתר בעברית.
1.מה זה ui-ux-pro-max
ui-ux-pro-max הוא סקיל לסוכני קוד, ברישיון MIT, עם יותר מ-130 אלף כוכבים ב-GitHub, נכון ל-5.10.2026. יש בו מאגר של 79 סגנונות עיצוב, 192 סוגי מוצרים ועסקים עם פלטת צבעים לכל אחד ו-74 זוגות פונטים. יש בו גם כללי UX ורשימות בדיקה.
הוא לא מעצב לכם את הדף. הוא מחזיר מערכת עיצוב: סגנון, קודי צבע, זוג פונטים, אפקטים שמתאימים, דברים שכדאי להימנע מהם ורשימת בדיקה לפני מסירה. את הדף עצמו הסוכן בונה אחר כך, לפי המערכת.
החיפוש רץ אצלכם במחשב, בסקריפט Python, בלי מפתח API ובלי תשלום. מה שעולה כסף הוא הסוכן שבונה את האתר.
2.התקנה
ב-Claude Code מתקינים אותו כתוסף, בשתי פקודות שמקלידים בתוך Claude Code. בשביל החיפוש צריך Python מותקן במחשב.
לסוכנים אחרים, כמו Cursor, Codex, Windsurf ו-GitHub Copilot, יש כלי התקנה בשורת הפקודה. שם החבילה הוא ui-ux-pro-max-cli, ואחרי ההתקנה מריצים uipro init עם שם הסוכן שלכם. הדוגמה כאן היא ל-Claude Code.
/plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill
/plugin install ui-ux-pro-max@ui-ux-pro-max-skillnpm install -g ui-ux-pro-max-cli
uipro init --ai claude3.הפקודה שהרצנו, ומה חזר
בדרך כלל לא מריצים את הסקריפט בעצמכם: מבקשים מהסוכן לבנות דף, והוא מריץ אותו. כדי לראות בדיוק מה הוא מחזיר, הרצנו אותו ישירות, עם תיאור של סטודיו ושם לפרויקט. הנתיב לסקריפט תלוי במקום שבו הסקיל מותקן אצלכם.
- --design-system מבקש מערכת עיצוב שלמה, ולא חיפוש בקטגוריה אחת.
- -p נותן שם לפרויקט.
- מה חזר: הסגנון Organic Biophilic. צבע ראשי #6B7280, צבע משני #78716C, כפתורים ב-#0891B2, רקע #F5F5F0 וטקסט ב-#0F172A.
- פונטים: Lora לכותרות ו-Raleway לטקסט.
- כללים: פינות מעוגלות של 16 עד 24 פיקסלים, צללים טבעיים, ניגודיות טקסט של 4.5:1 לפחות, ובדיקה ברוחב 375, 768, 1024 ו-1440 פיקסלים.
python .agents/skills/ui-ux-pro-max/scripts/search.py "yoga stretching wellness calm studio" --design-system -p "Pilates TLV"4.השיעור הראשון: לתאר את העסק במילים פשוטות
התיאור הראשון שנתנו היה עמוס: pilates studio wellness women calm luxury booking. חזרה מערכת עם רקע שחור וסגנון שבנוי על אנימציות גלילה, ההפך מסטודיו רגוע. תיאור אחר, פשוט יותר, yoga stretching wellness calm studio, החזיר את הסגנון הטבעי והרגוע שחיפשנו.
החיפוש הולך לפי מילים, ומילה כמו luxury או booking יכולה למשוך אותו לכיוון שלא התכוונתם. מה שעבד אצלנו: סוג העסק, מה עושים בו ואיזו תחושה רוצים, בלי להעמיס. המאגר כתוב באנגלית, ולכן תיארנו באנגלית. אם התוצאה לא מתאימה, מחליפים מילים ומריצים שוב. זה לוקח שניות.
גם התוצאה שבחרנו הייתה רגועה ונקייה, וקצת אפורה. יוקרתית היא לא. אם אתם רוצים תחושה מסוימת, כתבו אותה בתיאור ובדקו שהיא מופיעה במה שחזר.
5.השיעור השני: לפונטים שלו אין עברית
ב-Lora וב-Raleway, הפונטים שהוא בחר, אין אותיות עבריות. הכלי לא מזהיר על זה, ובמצב של מערכת עיצוב אין לו כללים לעברית או לכיוון מימין לשמאל. אם לא תגידו כלום, הטקסט העברי יוצג בפונט הגיבוי של הדפדפן.
הפתרון: אומרים לסוכן במפורש באיזה פונט עברי להשתמש. אנחנו משתמשים ב-Heebo. ב-Google Fonts יש עוד פונטים עם עברית, כמו Rubik, ו-Frank Ruhl Libre אם אתם רוצים כותרות עם סריף, בדומה ל-Lora. את הצבעים, הסגנון והכללים משאירים כמו שהם, ומבקשים שהדף ייבנה מימין לשמאל.
6.בקשה מוכנה לסוכן
אחרי שהסקיל מותקן, הדביקו את זה ב-Claude Code והחליפו את מה שבסוגריים. הבקשה מבקשת לראות את המערכת לפני הקוד, כדי שתוכלו לתקן את הכיוון כשזה עוד זול.
בדיקה לפני מסירה
- התיאור של העסק קצר, באנגלית, ובלי מילים שמושכות לכיוון אחר.
- המערכת שחזרה מתאימה לתחושה שרציתם. אם לא, הרצתם שוב עם תיאור אחר.
- יש פונט עברי לטקסט העברי, והדף בנוי מימין לשמאל.
- ניגודיות הטקסט היא 4.5:1 לפחות.
- הדף נבדק ברוחב 375, 768, 1024 ו-1440 פיקסלים.
שאלות נפוצות
זה חינמי?
כן. הסקיל ברישיון MIT, והחיפוש רץ אצלכם במחשב בלי מפתח ובלי תשלום. הסוכן שבונה את האתר, כמו Claude Code, עולה כסף.
צריך לדעת לעצב?
לא. צריך לדעת לתאר את העסק ואת התחושה שאתם רוצים, ולהגיד אם התוצאה מתאימה.
זה עובד רק עם Claude Code?
לא. כלי ההתקנה שלו תומך גם ב-Cursor, Codex, Windsurf, GitHub Copilot ועוד.
הוא בונה את הדף בשבילי?
לא. הוא מחזיר מערכת עיצוב. את הדף בונה הסוכן, לפי המערכת.
למה התוצאה הראשונה שלכם הייתה שחורה?
החיפוש הולך לפי מילים, והתיאור הראשון שלנו היה עמוס. תיאור פשוט יותר החזיר סגנון שמתאים לסטודיו רגוע.
רוצים אתר שמתחיל ממערכת עיצוב?
אני בונה לעסקים אתרים בקוד, בעברית ומימין לשמאל. שלחו לי ״עיצוב״ בוואטסאפ וספרו איזה אתר אתם רוצים לבנות.