پرش به محتوای اصلی
پرش به محتوای مقاله

Claude Code: یک دستور برای تبدیل کد به طرح‌های بصری

·۲۷ مرداد ۱۴۰۵۱ دقیقه مطالعه
دستور /design در Claude Code: ساخت نمونه‌های بصری رابط کاربری مستقیماً در ترمینال
دستور /design در Claude Code: ساخت نمونه‌های بصری رابط کاربری مستقیماً در ترمینال
اشتراک‌گذاری
واقعاً چه چیز جدید است؟

تولید طرح‌های UI بر اساس تحلیل خودکار کدبیس موجود در محیط ترمینال؛ برخلاف ابزارهای تبدیل متن به تصویر، این خروجی‌ها با استایل واقعی پروژه سازگار هستند.

تصور کنید برنامه‌نویسی باشید که بدون ترک محیط خط فرمان، چندین گزینه برای طراحی رابط کاربری تولید می‌کند. این رویای بهره‌وری در ۱۸ اوت ۲۰۲۶ با انتشار پیش‌نمایش دستور /design برای Claude Code توسط شرکت Anthropic به واقعیت تبدیل شد.

این به‌روزرسانی شکاف میان ایده‌پردازی بصری و پیاده‌سازی کد را پر می‌کند. هوش مصنوعی زاینده (Generative AI) — مثل دستیاری که هم‌زمان هم نقاش است و هم برنامه‌نویس — اکنون می‌تواند پیش‌نمایه‌های بصری را مستقیماً در ترمینال و اپلیکیشن دسکتاپ ادغام کند. همان‌طور که در تحلیل قبلی ما درباره‌ی اتوماسیون محتوا با Claude و n8n اشاره کردیم، تمرکز این شرکت بر حذف مراحل تکراری است؛ اما این ویژگی جدید مستقیماً قلب گردش‌کار توسعه را هدف قرار داده و نیاز به جابه‌جایی مداوم بین ابزارهای طراحی و ویرایشگر کد را از بین می‌برد. این رویکرد در راستای استقبال گسترده توسعه‌دهندگان از قابلیت‌های بصری است، به‌طوری که میلیون‌ها کاربر پیش از این مهارت‌های مرتبط با سلیقه طراحی را برای Claude Code نصب کرده‌اند.

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

  • تولید: کاربر دستوری مانند "/design a few options for {feature}" را اجرا می‌کند.
  • تکرار: مدل چندین پیش‌نویس را به‌صورت تخته‌های طراحی (Artboards) ارائه می‌دهد.
  • انتخاب: برنامه‌نویس گزینه موردنظر را انتخاب کرده و با قابلیت‌های Claude Design آن را اصلاح می‌کند.
  • خروجی: طرح‌های نهایی به‌صورت Artifacts قابل اشتراک‌گذاری ساخته می‌شوند.

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

در حال حاضر، طرح‌ها به مرحله ساخت منتقل می‌شوند اما باید به‌صورت دستی ذخیره شوند. برای دسترسی به این قابلیت، کاربران باید دستور "claude update" را در محیط خود اجرا کنند.

گام بعدی شما

  • اگر از Claude Code استفاده می‌کنید، همین حالا محیط خود را به‌روزرسانی کنید تا سرعت تبدیل ایده به طرح را بسنجید.
  • برای ویژگی‌های پیچیده، ابتدا استایل‌های فعلی پروژه را در فایل‌های CSS یا Tailwind تعریف کنید تا خروجی /design دقیق‌تر شود.
  • خروجی‌های Artifact را با تیم محصول به اشتراک بگذارید تا قبل از کدنویسی، تاییدیه بصری بگیرید.

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

چرا این موضوع مهم است؟

این ابزار با تکیه بر تخصص آنتروپیک در درک بستر متن (Context)، هزینه زمانی تبدیل طرح به کد را به‌شدت کاهش می‌دهد. این تغییر باعث می‌شود سرعت تکرار (Iteration) در استارتاپ‌ها افزایش یابد و خطاهای بصری در مراحل نهایی کمتر شود.

تأثیر برای ایران

به‌دلیل محدودیت‌های دسترسی به APIهای آنتروپیک، استفاده از این ابزار برای توسعه‌دهندگان ایرانی نیازمند زیرساخت‌های تغییر IP است، اما می‌تواند سرعت نمونه‌سازی برای فریلنسرهای داخلی را دوچندان کند.

·نگاه ما
تحریریه دات‌هوش

ادغام طراحی بصری در ترمینال، گامی در جهت تثبیت مفهوم Vibe Coding است؛ جایی که مرز بین «توصیف محصول» و «ساخت محصول» از بین می‌رود. این رویکرد احتمالاً نقش ابزارهای طراحی سنتی را در مراحل اولیه توسعه به یک نقش نظارتی کاهش می‌دهد و قدرت تصمیم‌گیری بصری را به برنامه‌نویس بازمی‌گرداند.

منابع

این گزارش با خط‌لولهٔ خودکار دات‌هوش از منابع معتبر جهانی تدوین و زیر نظر تحریریه منتشر شده است. روش کار ما

گفتگو

پنج‌شنبه‌های هوش‌محور

بسته‌ی هفتگی دات‌هوش

۵ خبر، ۲ ابزار، ۱ پرامپت در هر شماره. به‌زودی راه‌اندازی می‌شود — هر پنج‌شنبه صبح.

خبر کلیدی
ابزار کاربردی
پرامپت حرفه‌ای
تحلیل پژوهش
به‌زودی
زاویه‌ی ایرانی
به‌زودی
تمرین این هفته
به‌زودی

راهنماهای دات‌هوش

راهنماهای کاربردیِ دات‌هوش برای کار با هوش مصنوعی — از همین‌جا شروع کنید:

دات‌هوش

راهنمای فارسی هوش مصنوعی — با نگاه به ایران

اخبار روزانه، معرفی ابزارها و مدل‌ها، و آموزشِ کار با هوش مصنوعی؛ همیشه با این پرسش که از ایران چه چیزی کار می‌کند و چه چیزی نه.