Google Stitch: עיצוב אתר בהשראת אתר שאהבתם

מה זה Google Stitch?

Google Stitch הוא כלי של Google Labs שמעצב מסכים של אתרים ואפליקציות מתוך תיאור במילים. אתם כותבים מה העסק עושה, מה אתם רוצים שהגולש ירגיש ומה נותן לכם השראה, והוא מייצר מסכים מעוצבים על קנבס אחד גדול.

ב-18 במרץ 2026 גוגל פרסמה בבלוג הרשמי גרסה חדשה של הכלי, וקראה לזה "vibe design". נכנסו בה קנבס אינסופי, סוכן עיצוב שזוכר את כל הפרויקט, עבודה בקול, אב טיפוס לחיץ וכלים למערכות עיצוב. נכון לסוף אוקטובר 2026, דף הבית של Stitch עדיין מסומן BETA.

איך Stitch לומד עיצוב מכתובת של אתר?

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

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

גוגל גם הוסיפה פורמט בשם DESIGN.md, קובץ טקסט שמכיל את כללי העיצוב. אפשר לייצא אותו מ-Stitch ולייבא אותו לפרויקט אחר, או לכלי אחר כמו קלוד קוד. ככה מערכת עיצוב שבניתם פעם אחת לא נשארת תקועה בכלי אחד.

איפה מוצאים אתרים ששווה ללמוד מהם?

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

כמה טיפים לבחירה:

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

איך בונים גרסה משלכם, צעד אחר צעד?

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

1. נכנסים ל-stitch.withgoogle.com ומתחברים עם חשבון גוגל.
2. בתיבת התיאור בוחרים אם מעצבים אתר (Web) או אפליקציה (App).
3. פותחים את תפריט ההוספה (הפלוס) ומוסיפים את כתובת האתר שאהבתם כהקשר. בתמונות הרשמיות של גוגל רואים בתפריט הזה אפשרויות של מערכת עיצוב, טקסט, תמונה ו-URL.
4. כותבים בריף קצר על העסק שלכם (יש תבנית מוכנה למטה) ושולחים.
5. עוברים על המסכים שיצאו, ומבקשים להחיל את מערכת העיצוב על כל האתר.
6. מחליפים לוגו, שם וטקסטים לשלכם, ובודקים איך זה נראה במובייל.

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

Use the site I added only as a design reference.
Extract its design system: fonts, color palette, spacing, buttons, card style.
Do NOT copy its text, images, logo or layout one to one.

Build a new homepage for my business:
- Business: [what you sell, in one line]
- Audience: [who buys from you]
- Feeling: [3 words, e.g. calm, premium, trustworthy]
- Sections: hero, services, about, testimonials, contact
- Language: Hebrew, right to left
- Brand: logo [describe or upload], main color [hex]

Keep it fast and readable on mobile.

איך הופכים את המסכים לאב טיפוס שאפשר ללחוץ עליו?

לפי הבלוג של גוגל, אפשר "לתפור" כמה מסכים יחד וללחוץ Play כדי לעבור ביניהם כמו באתר אמיתי. Stitch גם יכול לייצר לבד את המסך הבא לפי הכפתור שלחצתם עליו. זה שימושי כדי להראות ללקוח או לשותף איך האתר ירגיש, עוד לפני שמישהו כתב שורת קוד.

לדבר עם העיצוב בקול

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

מה עושים עם העיצוב אחרי זה?

עיצוב יפה זה עוד לא אתר באוויר. יש לכם שלוש דרכים להמשיך:

• DESIGN.md מייצאים את מערכת העיצוב כקובץ ונותנים אותו לכלי שבונה את האתר. הסברתי איך עובדים עם הקובץ הזה במדריך על DESIGN.md וקלוד קוד.
• קלוד קוד Stitch משחרר שרת MCP וסקילים, ככה שקלוד קוד יכול למשוך את המסכים ולבנות מהם אתר אמיתי. על החיבור הזה כתבתי במדריך Stitch וקלוד קוד.
• כלים של גוגל לפי הבלוג, אפשר לייצא ישר ל-AI Studio ול-Antigravity.

אם אתם בכלל רוצים להתחיל מהצד של אנתרופיק, יש גם Claude Design, שעושה הדמיות ועיצובים בתוך קלוד.

השראה או העתקה: איפה עובר הגבול?

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

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

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

• זה עדיין בטא. נכון ל-30 באוקטובר 2026 האתר של Stitch מסומן BETA, אז ממשק ויכולות יכולים להשתנות.
• מחיר ומגבלות. לא מצאתי עמוד מחירים רשמי שאפשר לצטט, אז אני לא מבטיח שזה חינם בלי הגבלה. תבדקו בתוך החשבון כמה יצירות נשארו לכם.
• עברית. הממשק באנגלית. אפשר לבקש טקסטים בעברית, אבל תבדקו יישור לימין בכל מסך.
• עיצוב זה לא אתר. Stitch מייצר מסכים ואב טיפוס. בשביל אתר עם טפסים, דומיין ותשלומים צריך עוד שלב בנייה.
• הוא לא תמיד קולע. החילוץ מכתובת עובד הכי טוב על אתרים עם עיצוב עקבי. אתר עמוס באנימציות יכול להוציא תוצאה פחות מדויקת, אז תשוו כמה מקורות.