מדריך · Taste Skill + קלוד קוד
Taste Skill: ככה קלוד קוד בונה אתר שלא נראה כמו AI
Taste Skill הוא סקיל קוד פתוח וחינמי לקלוד קוד שמשנה את הדרך שבה הוא מעצב אתרים. במקום התבנית הרגילה של AI, הוא בוחר כיוון עיצובי מתוך 20 שנחקרו, מביא תמונות אמיתיות מאוספים פתוחים, ובודק את הדף בדפדפן בשלושה גדלי מסך עד שהוא נראה כמו עבודה של סטודיו.
מה זה Taste Skill?
אם בניתם פעם דף נחיתה עם קלוד קוד, אתם כנראה מכירים את התוצאה: כותרת גדולה באמצע, רקע סגול עם גרדיאנט, שלושה כרטיסים עם אייקונים, ועוד מקטע "מה הלקוחות אומרים". זה עובד, אבל זה נראה בדיוק כמו כל אתר אחר שנבנה עם AI, והגולשים כבר מזהים את זה.
Taste Skill הוא סקיל קוד פתוח לסוכני קוד, כמו קלוד קוד ו-Codex, שנבנה כדי לשבור את התבנית הזאת. לפי ה-README, הוא נותן לסוכן שלושה דברים שחסרים לו: כיוון אמנותי, תמונות אמיתיות, ודרך לבדוק את העבודה של עצמו בדפדפן אמיתי. סקיל, למי שעוד לא מכיר, זה קובץ הוראות שקלוד טוען כשהוא צריך אותו (יש לי מדריך שלם על סקילים).
נכון ל-21 באוקטובר 2026 יש לריפו קרוב ל-100 אלף כוכבים בגיטהאב (99,843 לפי ה-API של גיטהאב), והוא משוחרר ברישיון MIT, כלומר חינם גם לשימוש מסחרי.
איך הוא גורם לאתר להיראות כמו עבודה של סטודיו?
הסוד הוא בתהליך, לא בטריק אחד. לפי ה-README, הגרסה השנייה של הסקיל נבנתה מתוך מחקר על 247 אתרים נבחרים, וכל בנייה עוברת שישה שלבים:
- קריאת הבריף. הסוכן קורא מה ביקשתם ומוציא רשימה של מה שיש רק לעסק שלכם: המוצר, המקום, הסיפור.
- בחירת כיוון. סקריפט שולף שלושה כיוונים עיצוביים מתוך 20 שנחקרו מראש, והסוכן בוחר אחד. ככה כל אתר יוצא שונה.
- הרעיון. משפט אחד שמחבר את החומר של העסק לכיוון שנבחר.
- תמונות אמיתיות. במקום אילוסטרציות גנריות, הוא מחפש תמונות וסרטונים מאוספים פתוחים ומוסיף להם קרדיט.
- בדיקה בדפדפן. הוא פותח את הדף בדפדפן אמיתי בשלושה רוחבים (מסך מחשב, טאבלט ונייד) ופוסל אותו אם הוא נראה כמו "סלופ" של AI.
- תיקונים. הוא מסתכל על צילומי המסך של עצמו ומתקן את שלוש הבעיות הכי גדולות, עד שלושה סבבים.
ככה נראים דפים שהסקיל בנה, כל אחד מבריף אחד, מתוך הדוגמאות בריפו:
איך מתקינים את Taste Skill בקלוד קוד?
לפני שמתחילים, לפי ה-README צריך שני דברים על המחשב: Node בגרסה 22 ומעלה, ודפדפן Chrome, Edge או Chromium. הסקיל לא מתקין שום דבר נוסף ולא צריך מפתחות API. הוא צריך אינטרנט רק כדי למצוא תמונות.
לא בטוחים איזו גרסת Node יש לכם? תריצו node -v בטרמינל. אם המספר קטן מ-22, תבקשו מקלוד קוד לעדכן, הוא יודע לעשות את זה.
דרך 1: כתוסף של קלוד קוד (הכי פשוט)
פותחים את קלוד קוד ומקלידים את שתי הפקודות האלה, אחת אחרי השנייה:
/plugin marketplace add Leonxlnx/taste-skill
/plugin install taste-skill@taste-skillהסקיל נכנס תחת השם taste-skill:, כך שהוא לא מתנגש עם סקילים אחרים שכבר יש לכם. בעתיד מעדכנים אותו עם /plugin update.
דרך 2: עם הפקודה npx skills
אם אתם עובדים עם כמה סוכנים במקביל, אפשר להתקין מהטרמינל:
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"שם הסקיל עצמו הוא design-taste-frontend. אם התקנתם גרסה ישנה בעבר, פשוט מריצים את אותה פקודה שוב. הסקילים הישנים של הפרויקט (כמו minimalist-ui) עברו לריפו נפרד בשם taste-skill-classics.
מה כותבים לקלוד אחרי ההתקנה?
הכלל הוא פשוט: מתארים את העסק, לא את העיצוב. ה-README מדגיש שהשלב הראשון הוא לחלץ מה מיוחד רק לכם, אז ככל שתיתנו יותר פרטים אמיתיים, ככה האתר ייצא פחות גנרי. כמה בריפים שעובדים טוב:
תבנה דף נחיתה לבית קפה קטן בפלורנטין. יש לנו קלייה משלנו, שמונה מקומות ישיבה ובעלים שהיה ברמן 15 שנה. האתר בעברית, מימין לשמאל.
תבנה דף לסדנת קרמיקה לזוגות בגליל. המטרה היא הרשמה לסדנה של יום שישי. תשתמש בתמונות אמיתיות של קדרות ותבדוק שהכול נראה טוב בנייד.
הנה דף הבית הקיים שלי. תבדוק אותו בדפדפן, תגיד לי מה גורם לו להיראות כמו אתר של AI, ותתקן את שלושת הדברים הכי בולטים.
הבקשה האחרונה חשובה: לפי ה-README, הסקיל יודע גם לשפר אתר קיים. הוא בודק את הדף בדפדפן אמיתי לפני שהוא משנה משהו.
גם לדשבורדים ומסכי אפליקציה
מגרסה 2.1 הסקיל מבדיל בין דף נחיתה למסך של אפליקציה. כשמבקשים דשבורד, מסך ניהול או מסך הגדרות, הוא עובר מסלול נפרד: סגנון שנלקח ממחקר על מסכי מוצר אמיתיים, פאנלים שקטים, מספרים מיושרים ותצוגה בנייד שבה התפריט מתקפל. הוא עובד עם React, Vue, Svelte או HTML פשוט, כי הכללים שלו הם על עיצוב ולא על טכנולוגיה מסוימת.
במה זה שונה מ-21st.dev ומכלי עיצוב אחרים?
כתבתי כבר מדריך על 21st.dev, ושם הרעיון אחר: אתם בוחרים רכיבים מוכנים (כפתור, כרטיס תמחור, אנימציה) ומדביקים אותם לפרויקט. Taste Skill עובד ברמה של הדף כולו. הוא מחליט על כיוון, מביא תמונות ובודק את התוצאה. בפועל אפשר לשלב: Taste Skill בונה את המבנה והאווירה, ואז מוסיפים רכיב ספציפי מ-21st.dev איפה שצריך.
אם אתם מעדיפים לעצב בממשק גרפי לפני שקלוד כותב קוד, שווה להציץ גם במדריך ל-Google Stitch.
למי Taste Skill מתאים?
- בעלי עסקים קטנים שבונים לבד את האתר או דף הנחיתה עם קלוד קוד
- פרילנסרים שבונים אתרים ללקוחות ורוצים שכל אתר ייראה אחרת
- יוצרי תוכן שצריכים דף לסדנה, לקורס או לאירוע
- מי שכבר יש לו אתר שנראה "AI" ורוצה לשפר אותו בלי להתחיל מאפס
- מי שבונה דשבורד פנימי ורוצה שהוא ייראה כמו מוצר אמיתי
חשוב לדעת לפני שמתחילים
- זה לוקח זמן וטוקנים. לפי ה-README, בנייה אחת לוקחת בערך 30 עד 45 דקות וכמה מאות אלפי טוקנים. במנוי Pro זה יכול לאכול חלק נכבד מהמכסה, אז אל תריצו חמש גרסאות ברצף בלי לחשוב.
- עברית ו-RTL לא מוזכרים בתיעוד. הכללים של הסקיל כתובים באנגלית ולא מזכירים כיווניות. תכתבו בבריף במפורש "אתר בעברית, מימין לשמאל" ותבדקו את התוצאה בנייד, במיוחד פונטים בעברית.
- קרדיט לתמונות זה חובה. התמונות מגיעות מאוספים פתוחים כמו Wikimedia Commons, Openverse והמוזיאון המטרופוליטן, ורק ברישיונות נחלת הכלל, CC0, CC BY ו-CC BY-SA. חלק מהרישיונות מחייבים קרדיט, והסקיל מוסיף אותו לדף. אל תמחקו אותו. כשיש לכם תמונות משלכם, תחליפו.
- מה צריך על המחשב. Node 22 ומעלה ו-Chrome, Edge או Chromium. עובד במק, בווינדוס ובלינוקס, כל עוד הדרישות האלה מותקנות.
- זה כלי קהילתי. הוא פופולרי ומתעדכן כמעט כל יום, אבל אין מאחוריו תמיכה רשמית. שאלות ובאגים הולכים ל-Issues בגיטהאב או לאתר tasteskill.dev.
- טעם זה עדיין שלכם. הסקיל משפר מאוד את נקודת הפתיחה, אבל אתם מכירים את הלקוחות שלכם. תסתכלו על הדף, ותגידו לקלוד מה לא מרגיש נכון.
השורה התחתונה
הבעיה של רוב האתרים שקלוד בונה היא לא הקוד, היא שאין להם כיוון. Taste Skill נותן לקלוד כיוון, תמונות אמיתיות ועין ביקורתית, ואתם רק צריכים לספר לו מה מיוחד בעסק שלכם.
שאלות נפוצות על Taste Skill
האם Taste Skill חינמי?
כן. הסקיל משוחרר בקוד פתוח ברישיון MIT, ואין בו מפתחות API או תשלום. אתם משלמים רק על הטוקנים שקלוד קוד צורך מהמנוי שלכם, ובנייה אחת יכולה לצרוך כמה מאות אלפי טוקנים.
צריך לדעת לעצב או לתכנת כדי להשתמש בו?
לא. מתקינים אותו פעם אחת עם שתי פקודות, ואז כותבים לקלוד קוד בעברית מה העסק שלכם ומה המטרה של הדף. הסקיל בוחר כיוון עיצובי, מביא תמונות ובודק את התוצאה לבד.
Taste Skill עובד עם אתרים בעברית?
התיעוד לא מזכיר עברית או כיוון מימין לשמאל. בפועל צריך לכתוב בבריף במפורש שהאתר בעברית ומימין לשמאל, ולבדוק את התוצאה בנייד, במיוחד את הפונטים והיישור.
מותר להשתמש בתמונות שהסקיל מביא?
הסקיל מציע רק תמונות בנחלת הכלל או ברישיונות CC0, CC BY ו-CC BY-SA, ומוסיף קרדיט לדף. כדי לעמוד בתנאי הרישיון צריך להשאיר את הקרדיט. כשיש לכם תמונות של העסק עצמו, עדיף להחליף.
אפשר להשתמש בו לשפר אתר שכבר קיים?
כן. לפי ה-README, הסקיל בודק דף קיים בדפדפן אמיתי לפני שהוא משנה משהו. מבקשים מקלוד קוד לבדוק את הדף, להסביר מה גורם לו להיראות גנרי, ולתקן את הבעיות הבולטות.