Hallmark: סקיל לקלוד קוד שבונה אתר שלא נראה כמו AI

מה זה Hallmark?

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

Hallmark נבנה בדיוק בשביל זה. זה סקיל שחברת Together AI פרסמה בגיטהאב, והוא עובד עם קלוד קוד, Codex, Cursor ו-OpenCode. ה-README שלו מתאר אותו כסקיל עיצוב "שמסרב להיראות כאילו AI יצר אותו". נכון ל-5 בנובמבר 2026 יש לו מעל 48 אלף כוכבים בגיטהאב, והוא בגרסה 2.

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

אילו סימנים מסגירים אתר שבנה AI?

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

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

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

איך Hallmark בונה אתר?

לפי ה-README, כל בנייה עוברת ארבעה שלבים קבועים:

1. בדיקה מקדימה: הוא קורא את הפרויקט (פונטים, צבעים, פריימוורק) ושואל פעם אחת על החומרים שלכם: תמונות, צילומי מסך, מספרים אמיתיים. הוא לא ממציא נתונים.
2. שלושה עיצובים: הסקריפט theme.mjs מציע שלושה עיצובים שמתאימים לבקשה, ואתם בוחרים.
3. קודם החלק העליון: אזור הפתיחה של העמוד נבנה לבד, מרונדר ונבדק לפני שאר העמוד.
4. בדיקה בדפדפן: sloplint בודק את העמוד בשמונה רוחבי מסך, ואז סוכן נוסף עם הקשר נקי עובר על התוצאה בעיניים חדשות.

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

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

איך מתקינים את Hallmark בקלוד קוד?

צריך Node בגרסה 18 ומעלה. פותחים טרמינל ומריצים:

העתקהnpx skills add nutlope/hallmark -g

הדגל -g מתקין לכל הפרויקטים. בלי הדגל הוא נכנס רק לתיקייה הנוכחית. אם אתם רוצים התקנה רק לקלוד קוד:

העתקהnpx skills add nutlope/hallmark -g --agent claude-code

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

העתקהnpm i -g puppeteer-core

אפשר גם להתקין כפלאגין מתוך קלוד קוד, עם /plugin marketplace add nutlope/hallmark ואז /plugin install hallmark@hallmark. אחרי ההתקנה מפעילים עם /hallmark ותיאור של מה שאתם רוצים. אם הוא לא קופץ לבד, כותבים במפורש "use hallmark to build".

אילו פרומפטים עובדים הכי טוב עם Hallmark?

שלושה פרומפטים שמתחילים מהדבר שהכי משנה לסקיל: מה המבקר בא לעשות, ומה החומרים האמיתיים שלכם. מחליפים את הפרטים ומדביקים בקלוד קוד:

אתר חדש לעסק קטן

העתקה/hallmark אתר לקונדיטוריה בוטיק בתל אביב בשם "שושנה". המטרה של העמוד: שאנשים יזמינו עוגה לאירוע דרך וואטסאפ. האתר בעברית, מימין לשמאל. יש לי 6 תמונות של עוגות בתיקייה photos/ ושעות פתיחה בקובץ hours.txt. אל תמציא ביקורות, מספרים או פרסים. תציע לי שלושה עיצובים לפני שאתה בונה.

עיצוב מחדש של אתר קיים

העתקה/hallmark redesign ./index.html

ואם אתם רוצים לשמור על המבנה ולשנות רק את המראה, מוסיפים בסוף "keep the layout". רק לנקות את הסימנים של AI: "polish".

בדיקה בלבד, בלי לגעת בקוד

העתקה/hallmark audit ./index.html

איך מעצבים מחדש אתר קיים בלי לאבד תוכן?

זה החלק שהכי שווה לעסק שכבר יש לו אתר. Hallmark לא נוגע בעיצוב קיים אם לא ביקשתם במפורש. כשמבקשים redesign, הוא שומר את התוכן ואת החיבורים (טפסים, כפתורים, קישורים) ומחליף את המערכת והפריסה.

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

שלוש דרגות לבחירה: עיצוב מחדש מלא, "keep the layout" שמשאיר את סדר החלקים ומחליף את המראה, ו-"polish" שמנקה רק את הסימנים. אם האתר שלכם רץ כפרויקט עם תיקייה, נותנים את הנתיב לתיקייה, למשל ./src/app.

למי זה מתאים ובמה משתמשים בזה?

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

אם אתם רוצים להשוות לסקילים אחרים בתחום: Hallmark בעצמו מציין שהוא קיבל השראה מ-Impeccable ומ-taste-skill. כתבתי על שניהם במדריך על Taste Skill ובמדריך על Impeccable. ואם המטרה שלכם היא להעתיק מבנה של אתר קיים שאתם אוהבים, זה כבר נושא של שכפול אתרים עם קלוד קוד.

מה חשוב לדעת לפני שמתחילים?

• עלות: הסקיל חינמי ברישיון MIT. מה שעולה כסף הוא השימוש בקלוד קוד עצמו, לפי המנוי שלכם. בנייה עם סוכן בודק נוסף צורכת יותר טוקנים מבנייה רגילה.
• דרישות: Node 18 ומעלה. לבדיקה בדפדפן צריך puppeteer-core וכרום.
• הפלט: כל עמוד יוצא כקובץ HTML ו-CSS עצמאי. אם האתר שלכם בנוי בוורדפרס או ב-Wix, תצטרכו להעביר את העיצוב בעצמכם או לעבור לאתר סטטי.
• עברית: אין התייחסות מיוחדת לעברית בתיעוד. תכתבו "בעברית, מימין לשמאל" ותעברו על התוצאה בטלפון.
• תמונות: הספרייה המובנית היא תמונות כלליות מוויקימדיה. לאתר עסקי, תמונות אמיתיות שלכם תמיד ינצחו.
• מספרים: הסקיל מסרב להמציא עובדות, אז תכינו מראש מחירים, שעות ומספרים אמיתיים.