طراحی وب‌سایت سه‌بعدی با ارتش عامل‌های Claude بدون نوشتن یک خط کد

تصور کنید بخواهید یک وب‌سایت سه‌بعدی پیچیده با جزئیات خیره‌کننده بسازید، اما حتی یک خط کد ننویسید، هیچ درخواست Pull Request (PR) ارسال نکنید و هرگز ویرایشگر متنی یا گیت‌هاب را باز نکنید. فلیکس ریسبرگ (Felix Rieseberg)، طراح حرفه‌ای، دقیقاً همین کار را کرد. او با به‌کارگیری ارتشی از عامل‌های هوش مصنوعی (AI Agents)، تمام مراحل تولید، از سنتز موسیقی سفارشی تا مدل‌سازی سه‌بعدی مبتنی بر پایتون در بلندر را خودکار کرد و یک وب‌سایت با کیفیت بسیار بالا (High-fidelity) را بدون لمس یک خط کد به دنیا عرضه کرد.

این دستاورد در زمانی رخ می‌دهد که صنعت از رابط‌های ساده‌ی چت به سمت گردش‌کارهای عامل‌محور (Agentic) حرکت می‌کند. در حالی که اکثر کاربران هنوز با هوش مصنوعی مثل یک سیستم تکمیل خودکار (Autocomplete) پیشرفته برخورد می‌کنند، ریسبرگ با مدل زبانی بزرگ (LLM) مانند یک مدیر مهندسی رفتار می‌کند. او توصیف می‌کند که در این گردش‌کار، او تنها اهداف سطح بالا را تعریف می‌کند و اجازه می‌دهد هوش مصنوعی مسیر فنی اجرا و پیاده‌سازی را تعیین کند. او اشاره می‌کند که در فضای فعلی، درخواست‌های مربوط به ویژگی‌های جدید (Feature Requests) دیگر موضوع اصلی بحث نیستند؛ بلکه کاربران می‌خواهند «طلسم‌های جادویی» و الگوهای استفاده‌ی خاصی را بدانند که دستیابی به چنین نتایجی را ممکن می‌سازد. این رویکرد عامل‌محور تنها در طراحی وب محدود نمی‌شود و در حوزه‌های تجاری نیز نتایج چشمگیری داشته است، چنان‌که برخی خرده‌فروشان با به‌کارگیری عامل‌های Claude شاهد افزایش ۳۵ درصدی سبد خرید مشتریان خود بوده‌اند.

لایه‌ی ارکستراسیون (مدیریت هماهنگ)

ریسبرگ در اواخر سپتامبر ۲۰۲۶، از مدل Opus 5.5 در یک ساختار تخصصی به نام «پروژه» (Project) استفاده کرد. او متوجه تفاوت فاحشی در گردش‌کار خود نسبت به ابتدای سال شده است و خاطرنشان می‌کند که کارهای او اکنون خلاقانه‌تر، بصری‌تر و احساسی‌تر شده و دیگر توسط تکنولوژی‌های خاصی که در آن‌ها مهارت دارد، محدود نمی‌شود.

ساختار «پروژه‌ها» به عنوان لایه‌ای عمل می‌کند که بخش‌های چت (Chat)، همکاری (Cowork) و کدنویسی (Code) را به هم متصل می‌کند. این معماری به یک نمونه‌ی اصلی از کلود اجازه می‌دهد تا به عنوان یک ناظر (Supervisor) عمل کند و جلسات (Sessions) اضافی ایجاد کند که همگی دارای یک حافظه مشترک و یک پوشه‌ی فایل واحد هستند. این تنظیمات به کاربر اجازه می‌دهد با یک کلود صحبت کند که می‌تواند وظایف، تحقیقات و رشته‌های مختلف را مدیریت کند و گفتگو را از «مراحل خاص برای رسیدن به هدف» به سمت خودِ «اهداف» سوق دهد.

اجرای ابری-بومی (Cloud-Native)

بر اساس گزارش ریسبرگ، هر رشته پردازشی (Thread) در محیط ابری روی کامپیوتر اختصاصی خود اجرا می‌شود. این امر نیاز به تنظیمات محیطی روی سیستم محلی (Local Environment Setup) را کاملاً از بین می‌برد. این محیط‌های مجازی به‌طور خودکار پیش‌نیازهای لازم را بر اساس نیاز نصب می‌کنند، از جمله:

• Blender: برای مدل‌سازی و رندرینگ سه‌بعدی.
• FFmpeg: برای پردازش ویدیو.
• Playwright: برای اتوماسیون مرورگر.

عامل‌ها با گرفتن اسکرین‌شات از مرورگرهای بدون رابط کاربری (Headless Browsers)، کار خود را بررسی کرده و صفحات پیش‌نمایش خصوصی را برای بازبینی لحظه‌ای منتشر می‌کنند. ریسبرگ بخش زیادی از این ارکستراسیون را از طریق گوشی موبایلش، هنگام دوچرخه‌سواری و در توقف‌های کوتاه برای قهوه، مدیریت کرد و ایده‌ها را ارسال و نتایج را بررسی نمود.

در حالی که ابر اکثر وظایف را مدیریت می‌کند، ریسبرگ اشاره می‌کند که کارهای سنگین سه‌بعدی از پردازنده‌های گرافیکی (GPU) اختصاصی بهره می‌برند. کاربران می‌توانند با انتخاب گزینه «Work Locally» از طریق آیکون «+»، سخت‌افزار خود را به هر رشته متصل کنند تا سرعت رندرینگ افزایش یابد.

از طوفان فکری تا هندسه‌ی سه‌بعدی

فرآیند با یک اکتشاف موازی در جهت‌های مختلف طراحی آغاز شد. ریسبرگ مجموعه‌ای از الهامات (Inspiration Dump) را به هوش مصنوعی داد که شامل پوسترهای ریو (Rave) دهه ۹۰، فیلم‌های مورد علاقه، تبلیغات و مفاهیم خاص بود. ده رشته پردازشی به‌طور هم‌زمان و با کمترین راهنمایی، این مسیرها را بررسی کردند.

برخی از رشته‌ها مفاهیمی بیش از حد کلی یا اغراق‌آمیز تولید کردند؛ مثلاً پورتفولیویی برای کسی که به کمپینگ در پارک‌های ملی علاقه دارد یا زیبایی‌شناسی فیلم Ghost in the Shell دهه ۸۰. هرگاه مسیری نویدبخش به نظر می‌رسید، ریسبرگ از کلود می‌خواست که روی آن «دوباره سرمایه‌گذاری کند» (Double Down) و پنج واریانت دیگر ارائه دهد.

در حالی که برخی رشته‌ها HTML استاندارد و Three.js را پیشنهاد می‌دادند، جهت نهایی به سمت تم «تکنولوژی قدیمی با محوریت نوارهای VHS» تغییر کرد. برای دستیابی به این هدف، کلود از رابط بصری استفاده نکرد؛ بلکه کدهای پایتون نوشت تا بلندر (Blender) را به عنوان یک ماژول کنترل کند.

مهندسی اتاق مجازی

قلب تپنده سایت، یک اتاق سه‌بعدی با جزئیات دقیق است که با حدود ۳۰۰۰ خط کد پایتون ساخته شده است. هوش مصنوعی دارایی‌ها (Assets) را از صفر مدل‌سازی کرد و با بلندر به جای یک ابزار گرافیکی (GUI)، مانند یک کتابخانه کد برخورد کرد. هندسه‌ی اتاق در اسکریپت‌های مجزا تعریف شده است:

• tape_model.py (۳۳۲ خط): یک نوار VHS با ابعاد دقیق ۱۸۷ در ۱۰۳ در ۲۵ میلی‌متر که به صورت یک پوسته توخالی با قرقره‌ها، نوار مغناطیسی، راهنماها و یک درب ضد گرد و غبار لولایی طراحی شده است.
• gear90s.py (۶۵۹ خط): میز یک خبرنگار دهه ۹۰ شامل تلفنی با ماشین پاسخ‌گوی میکروکاست روی یک دفترچه تلفن، رولودکس (Rolodex)، دیسک‌های نرم (Floppies)، پیجر، ماشین‌حساب خورشیدی، دیسک‌من و واکمنی با سیم‌هایی که به پریز دیوار متصل هستند.
• retro_pc.py (۴۳۱ خط): یک کامپیوتر کرم‌رنگ اواخر دهه ۸۰ از یک برند خیالی، دارای دو درایو ۵.۲۵ اینچی، قفل کلیدی، یک سوئیچ اهرمی قرمز، مانیتور ۱۴ اینچی CRT سبز رنگ روی پایه متحرک و یک کیبورد مدل XT.
• room_back.py (۲۹۰ خط): فضای پشت دوربین (که در انعکاس‌ها دیده می‌شود)، شامل دری چهار لنگه با کلیدی در قفل، کلید برق باکلیت، قرنیز گچی و یک بخاری کاشی‌کاری شده.

نورپردازی و بافت‌ها

کلود تصمیم گرفت در کجا از مدل‌های رایگان با لایسنس CC0 از Poly Haven استفاده کند و در کجا مدل‌ها را از صفر بسازد. اکثر آیتم‌ها، از جمله تلویزیون، دستگاه VCR و هندسه‌ی اتاق، «توسط کلود ساخته شدند». بافت‌های سطحی به جای استفاده از عکس، با استفاده از نویزهای رویه‌ای (Procedural Noise) ایجاد شدند.

برای دستیابی به واقع‌گرایی (Photorealism) بدون از بین بردن عملکرد مرورگر، کلود از Cycles (سیستم رندرینگ بلندر) برای پختن (Bake) نقشه‌های نوری در بافت‌ها استفاده کرد. این یک فرآیند پیچیده بود که در آن هر سطح ایستا، یک مجموعه UV دوم دریافت کرد که در اطلس‌ها (Atlases) بسته‌بندی شده بود. هر اطلس شامل چهار نقشه بود:
۱. رنگ بدون نور.
۲. نور حاصل از لامپ‌های اتاق (لامپ میز، درخشش شهر، ماه).
۳. نور حاصل از تلویزیون به تنهایی (سفید پخته شده).
۴. اتاق در حالی که لامپ میز خاموش است.

این سیستم اجازه داد تا شیدر (Shader) رنگ نور اتاق را بر اساس نوار VHS فعال تغییر دهد (مثلاً نوار آبی، اتاق را آبی کند) با استفاده از این محاسبه: vec3 light = lamps + tv * tvColor.

جلوه‌های بصری پیشرفته و صدا

برای نمای پنجره، تیم از مدل Depth Anything V2 (یک مدل متن‌باز تخمین عمق) استفاده کرد. این مدل یک عکس ثابت از خط افق برلین (اثر بیلی گریس وارد) را به یک نقشه عمق ۵۰ کیلوبایتی با دو کانال تبدیل کرد: یک کانال «نرم» برای پارالاکس (لغزش دکل‌ها و ساختمان‌ها) و یک کانال «تیز» برای اینکه قطارها پشت ساختمان‌ها ناپدید شوند. این کار کیفیت یک عکس را با عمق یک صحنه سه‌بعدی و تقریباً بدون هزینه CPU فراهم کرد.

فراتر از بصریات، هوش مصنوعی تولیدات چندرسانه‌ای پیچیده‌ای را مدیریت کرد:

• پارودی CGI: کلود صحنه‌ای از فیلم Encounters at the End of the World اثر ورنر هرتزوگ را بازسازی کرد که یک «پنگوئن نیهیلیست» در آن حضور دارد. هوش مصنوعی صحنه را به هشت شات تقسیم کرد، لرزش و چرخش دوربین دستی را فریم‌به‌فریم ردیابی کرد و ۲۷۸۷ فریم مجزای ۶۴۰ در ۴۸۰ را با نرخ ۲۳.۹۷۶ فریم بر ثانیه برای یک ویدیوی ۱۱۶ ثانیه‌ای رندر کرد. این پارودی جزئیاتی مثل میزی با کامپیوتر روی یخ و پرچم‌های شرکتی برای هر جایی که ریسبرگ در آن کار کرده بود را اضافه کرد.
• گویندگی: پس از اینکه مدل‌های متن‌باز اولیه ضعیف عمل کردند، ریسبرگ یک کلید API از ElevenLabs ارائه داد و به کلود اجازه داد روایت‌های صوتی باکیفیتی را سنتز کند.
• سنتز موسیقی: کلود سه قطعه موسیقی را با پایتون آهنگسازی و سنتز کرد. او هم نت‌ها و هم موتور سنتزور را نوشت. برای مثال، قطعه "Deep Field" شامل شش آکورد چهار میزانی در گام دو دیز مینور (شامل C#m(add9), Amaj7(#11), و F#m9) روی یک صدای پایه (Drone) دو دیز در فرکانس ۳۴.۶ هرتز است، در حالی که قطعه "Late Shift" از فرم آهنگین AABA در ۳۲ میزان پیروی می‌کند.

رویکرد «مدیریتی» به کنترل کیفیت (QA)

به دلیل اینکه پروژه شامل حدود ۶۰ رشته پردازشی موازی بود، ریسبرگ خواندن کدها را کاملاً متوقف کرد. او یک سیستم کنترل کیفیت مدیریتی بر اساس فرآیندهای سخت‌گیرانه و تست‌های خصمانه پیاده کرد.

او «عامل‌های خصمانه» (Adversarial Agents) را مستقر کرد که تنها وظیفه‌شان شکستن سایت بود. این عامل‌ها سایت را در مرورگرهای بدون رابط اجرا کرده و ۳۰۰۰ خط یافته و خطا تولید کردند. وقتی باگی پیدا می‌شد — مانند برچسب‌های خالی روی نوارها، متن‌های باقی‌مانده به زبان آلمانی یا تداخل‌های زمانی (Race Conditions) هنگام تعویض نوارها — کلودِ هماهنگ‌کننده، رشته مسئول را شناسایی و دستور اصلاح می‌داد.

برای بهینه‌سازی عملکرد، هوش مصنوعی از تکنیک «صعود به تپه» (Hill-climbing) استفاده کرد. این سیستم اسکرین‌شات‌های مقایسه‌ای از نسخه‌های مختلف می‌گرفت و تفاوت‌ها را پیکسل‌به‌پیکسل محاسبه می‌کرد. این کار تضمین می‌کرد که افزایش نرخ فریم یا کاهش Draw Callها، بهبودهای واقعی باشند و نه صرفاً کاهش کیفیت بصری.

تحلیل: مرگ ذهنیت «ابزاری»

این گردش‌کار نشان‌دهنده تغییری بنیادین در رابطه بین خالقان و تکنولوژی است. تجربه ریسبرگ نشان می‌دهد که «ابزار کدنویسی» (مانند Claude Code) در حال تبدیل شدن به عنصری ثانویه در برابر مدل‌های استدلالی عمومی است. با این حال، استفاده از ابزارهای تخصصی کدنویسی همواره با چالش‌های عملیاتی همراه بوده است؛ برای مثال، کاهش ظرفیت واقعی در اثر افزایش سقف‌های Claude Code نشان داد که دسترسی به قدرت پردازشی لزوماً به معنای بهره‌وری بیشتر نیست. او برای این کار به سراغ یک ابزار کدنویسی تخصصی نرفت، بلکه صرفاً از Opus 5.5 استفاده کرد.

برای یک خالق حرفه‌ای، مانع دیگر تسلط بر نرم‌افزاری مثل بلندر یا زبانی مثل پایتون نیست. گلوگاه جدید، «سلیقه» (Taste) و توانایی ارائه جهت‌دهی خلاقانه در سطح بالا است. ما از عصر «اجرا» به عصر «کیوریتوری» یا گزینش وارد می‌شویم.

این تغییر ممکن است باعث بحران اعتماد برای مهندسان سنتی شود، اما همان‌طور که ریسبرگ اشاره می‌کند، این وضعیت مشابه تنش تاریخی هنگام ورود عکاسی به دنیای هنر در سال ۱۸۵۹ است. چارلز بودلر، شاعر، عکاسی را «پناهگاهی» برای نقاشانی می‌دانست که تنبل‌تر از آن بودند که مطالعات خود را کامل کنند. به همین ترتیب، در حالی که برخی ممکن است آثار تولید شده توسط هوش مصنوعی را «زباله» (Slop) بنامند، نتیجه نهایی تجلی دقیقی از یک چشم‌انداز انسانی است که از طریق ابزارهای مکانیکی به دست آمده است.

برای مشاهده این گردش‌کار عامل‌محور در عمل، می‌توانید نتیجه نهایی بازطراحی را در صفحه اصلی ریسبرگ بررسی کنید و نحوه تکامل ارکستراسیون چند-عاملی را در آخرین به‌روزرسانی‌های Opus دنبال کنید.

گام بعدی شما

• بررسی خروجی نهایی در وب‌سایت ریسبرگ برای درک تفاوت رندرینگ ابری و محلی.
• آزمایش مدل‌های استدلالی برای مدیریت پروژه‌های چندمرحله‌ای به جای تک‌پرامپت.
• مطالعه مستندات Opus 5.5 برای پیاده‌سازی ساختار «پروژه» در کارهای شخصی.

اما داستان سخت‌افزاری این تحول حتی شگفت‌انگیزتر است — به تحلیل ما درباره‌ی تراشه‌های Blackwell مراجعه کنید.