אתר 3D: אובייקט תלת מימד חי באתר, בלי ללמוד Blender

מה בונים כאן?

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

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

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

הכלים: Blender ו-three.js

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

three.js היא ספריית JavaScript שמציגה תלת מימד בדפדפן. נכון ל-31 באוקטובר 2026, יש לה 117,247 כוכבים בגיטהאב, ובעמוד הבית שלה יש עשרות אתרים אמיתיים שבנויים איתה.

מה שמחבר בין הסוכן ל-Blender הוא MCP for Blender, תוסף קהילה בקוד פתוח. נכון ל-31 באוקטובר 2026 יש לו 32,841 כוכבים בגיטהאב, ברישיון MIT. הוא נותן לסוכן לראות את הסצנה ב-Blender, ליצור אובייקטים, לשנות חומרים ולהריץ קוד בתוך התוכנה.

איך מחברים את Blender לקודקס או לקלוד קוד?

1. מורידים ומתקינים את Blender מ-blender.org. לפי ה-README צריך גרסה 3.0 ומעלה.
2. מריצים את פקודת ההתקנה מה-README. היא מתקינה את uv אם צריך, מוצאת את הכלים שיש לכם במחשב (קלוד קוד, קודקס, Cursor ועוד), ומתקינה ומפעילה את התוסף ב-Blender.
3. סוגרים לגמרי ופותחים מחדש את קודקס או את קלוד קוד, ופותחים את Blender.

# macOS / Linux
curl -LsSf https://www.mcp-for-blender.com/install.sh | sh

# if uv is already installed
uvx mcp-for-blender setup

ב-Windows יש פקודת PowerShell נפרדת ב-README. מי שמעדיף לחבר ידנית, אלה הפקודות מה-README:

# Claude Code
claude mcp add blender uvx mcp-for-blender

# Codex
codex mcp add blender -- uvx mcp-for-blender

אחרי זה, בתוך Blender, לוחצים N כדי לפתוח את הסרגל הצדדי, נכנסים ללשונית MCP for Blender ולוחצים על החיבור. לקודקס יש גם פלאגין עם תצוגה חיה של הסצנה בתוך הצ'אט. את הוראות ההתקנה שלו תמצאו ב-README.

הפרומפט: אובייקט תלת מימד חי באתר

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

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

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

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

שלב 3, ייצוא:
תייצא קובץ GLB דחוס, עד 2 מגה אם אפשר, ותשמור אותו בתיקייה של האתר.

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

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

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

איך מוציאים מזה תוצאה טובה?

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

אם אתם רוצים לקחת את Blender לכיוון אחר, אנימציה וסרטון במקום אתר, כתבתי על זה במדריך אנימציית תלת מימד עם Blender MCP.

חשוב לדעת

• זה תוסף קהילה. לפי ה-README, MCP for Blender לא קשור לקרן Blender הרשמית.
• שמרו עבודה לפני. ה-README מזהיר שהכלי שמריץ קוד Python בתוך Blender יכול להריץ כל קוד, וממליץ לשמור את העבודה לפני שמשתמשים בו.
• טלמטריה. לפי ה-README, כברירת מחדל נאסף רק רישום שימוש אנונימי ומינימלי. הפרומפטים, הקוד והסצנות לא נאספים בלי שתסכימו במפורש.
• צריך מחשב. Blender רץ על macOS, Windows ו-Linux. בטלפון או בטאבלט זה לא יעבוד.
• תמונות קונספט. אם לסוכן אין כלי ליצירת תמונות, הוא יתאר את הכיוונים במילים. זה עדיין עובד, רק פחות ויזואלי.
• כמה זה עולה: הכלים עצמם חינמיים, גם Blender, גם הספרייה וגם התוסף. משלמים רק על קודקס או קלוד קוד, במנוי או בחשבון API.