Anthropic دستور /design را به Claude Code برای ساخت طرحهای اولیه (Mockup) رابط کاربری در ترمینال اضافه کرد
شرکت Anthropic قابلیت Claude Code را با دستور جدید /design گسترش داده است که به توسعهدهندگان اجازه میدهد بدون خروج از ترمینال، طرحهای اولیه (mockup) رابط کاربری را ایجاد، اصلاح و مشاهده کنند.
نمونهسازی رابط کاربری مستقیماً در ترمینال
به جای جابهجایی مداوم بین Figma و شل (shell)، اکنون میتوانید چیزی شبیه به /design a few options for a login screen تایپ کنید. Claude با چندین «artboard» تعاملی پاسخ میدهد که طرحهای اولیه با دقت بالا (high-fidelity) را نمایش میدهند. شما میتوانید طرحها را با هم مقایسه کنید، مورد پسند خود را انتخاب کنید و با پرسیدن سوالات تکمیلی، ظاهر آن را اصلاح کنید؛ و تمام اینها پیش از نوشتن حتی یک خط کد عملیاتی (production code) انجام میشود.
طرحهای اولیه آگاه از متن (Context-Aware) بر اساس پایگاه کد شما
Nate Parrott، از توسعهدهندگان، خاطرنشان میکند که Claude در واقع مخزن (repository) فعلی را میخواند. این ابزار پالتهای رنگی، کتابخانههای کامپوننت و قراردادهای چیدمان (layout conventions) را استخراج کرده و سپس هر طرح را برای مطابقت با سبک موجود پروژه شخصیسازی میکند. نتایج به صورت «Artifacts» نمایش داده میشوند؛ یک نمای اختصاصی در داخل Claude که تصاویر را بدون نیاز به باز کردن یک ویرایشگر گرافیکی مجزا نشان میدهد. در این مرحله، طرحها فقط در فضای کاری Claude وجود دارند؛ شما باید قبل از تبدیل آنها به کد، آنها را به طور صریح در سیستم فایل ذخیره کنید.
چرا این موضوع برای توسعه به کمک هوش مصنوعی اهمیت دارد
این دستور دو مرحله از چرخه حیات توسعه نرمافزار — یعنی طراحی و کدنویسی — را در یک مرحله ادغام میکند. تیمهایی که سرعت برایشان اولویت دارد، میتوانند با یک دستور (prompt) واحد، چندین گزینه چیدمان تولید کنند و مرحله کشف اولیه (early-stage discovery) را تسریع بخشند. از آنجایی که Claude از پایگاه کد زنده استفاده میکند، طرحها با برند سازگار و با سیستم کامپوننت پروژه همخوانی دارند، که این امر نیاز به اصلاحات دستی پس از تولید تصاویر عمومی را کاهش میدهد.
Anthropic این قابلیت را گامی به سوی یک «مهندس نرمافزار هوش مصنوعی» میداند که هم منطق و هم زیباییشناسی را مدیریت میکند. اگر ترمینال بتواند به عنوان یک فضای کاری چندوجهی (multi-modal) عمل کند، مرز بین کدنویسی و شکلدهی به تجربه کاربری به شدت کمرنگ میشود.
محدودیتهای فعلی
این ویژگی هنوز در مرحله پیشنمایش (preview) است. طرحهای تولید شده به طور خودکار به فایلهای منبع تبدیل نمیشوند؛ شما باید خودتان آنها را خروجی گرفته و ادغام کنید. این مرحله اضافی میتواند از صرفهجویی در زمان بکاهد، بهویژه در پروژههای بزرگتر با دهها کامپوننت.
چگونه آن را امتحان کنید
دستور claude update را اجرا کنید تا آخرین نسخه پیشنمایش دریافت شده و دستور /design فعال شود.
نکات کلیدی
- نمونهسازی یکپارچه: دستور
/designچندین artboard رابط کاربری را مستقیماً از طریق دستورات ترمینال تولید میکند. - سازگاری با متن: Claude پایگاه کد فعلی را اسکن میکند تا طرحها را با سیستم طراحی موجود همسو نگه دارد.
- گردش کار بهینه: با ادغام قدرت دستوردهی Claude Design و قابلیت اجرای Claude Code، توسعهدهندگان بدون تغییر ابزار، از مفهوم به نمونه اولیه بصری میرسند.
دستور جدید /design از Anthropic به توسعهدهندگان اجازه میدهد طرحهای اولیه رابط کاربری را مستقیماً از ترمینال ایجاد و اصلاح کنند و رفتوبرگشت بین ابزارهای طراحی و ویرایشگرهای کد را کاهش دهند؛ گلوگاهی که بسیاری از تیمهای پرسرعت همچنان با آن دستوپنجه نرم میکنند.
تولید پیشنویسهای بصری از طریق دستور CLI
شما دستوری مانند /design a few options for a login screen را تایپ میکنید و Claude مجموعهای از artboardهای تعاملی را برمیگرداند. هر artboard یک طرح اولیه با دقت بالا را نشان میدهد که میتوانید با پرسیدن سوالات تکمیلی، آن را بررسی، مقایسه و اصلاح کنید.
Claude فایلهای پروژه فعلی را میخواند، پالتهای رنگی، کتابخانههای کامپوننت و قراردادهای چیدمان را استخراج میکند و سپس طرحها را برای مطابقت با آنها شخصیسازی میکند. خروجی به صورت «Artifacts» ظاهر میشود؛ نمایی که تصاویر را بدون باز کردن یک ویرایشگر گرافیکی مجزا نمایش میدهد. در این مرحله، طرحها فقط در فضای کاری Claude وجود دارند؛ شما باید قبل از تبدیل آنها به کد، آنها را به طور صریح در سیستم فایل ذخیره کنید.
چرا توسعهدهندگان به ابزار «طراحی در ترمینال» اهمیت میدهند
اکثر توسعهدهندگان بخش بزرگی از روز خود را صرف جابهجایی بین ترمینال کد و اپلیکیشن طراحی رابط کاربری میکنند. آوردن نمونهسازی بصری به همان پنجرهای که کد در آن نوشته میشود، دو مرحله از چرخه حیات توسعه نرمافزار را در یک مرحله ادغام میکند.
برای تیمهای متمرکز بر سرعت، تولید چندین گزینه چیدمان با یک دستور واحد میتواند مرحله کشف اولیه را تسریع کند. خواندن پایگاه کد موجود توسط Claude، طرحها را با برند سازگار و با سیستم کامپوننت پروژه همخوانی میدهد و نیاز به اصلاحات دستی که معمولاً پس از مرحله تولید تصویر عمومی ایجاد میشود را کاهش میدهد.
Anthropic این قابلیت جدید را گامی به سوی یک «مهندس نرمافزار هوش مصنوعی» میداند که میتواند هم منطق و هم زیباییشناسی را مدیریت کند. اگر ترمینال اکنون بتواند به عنوان یک فضای کاری چندوجهی عمل کند، مرز بین کدنویسی و شکلدهی به تجربه کاربری کمرنگتر میشود.
محدودیتها و ضرورت استفاده از ابزارهای طراحی سنتی
این قابلیت هنوز در مرحله پیشنمایش است و چندین محدودیت عملی همچنان وجود دارد. نخست اینکه، موکاپهای تولیدشده بهطور خودکار به فایلهای منبع تبدیل نمیشوند؛ توسعهدهندگان باید آنها را بهصورت دستی خروجی گرفته و ادغام کنند. این مرحله اضافی میتواند صرفهجویی زمانی را در پروژههای بزرگتر که در آنها دهها کامپوننت نیاز به همگامسازی دارند، از بین ببرد.
آنچه باید با تکامل این قابلیت زیر نظر داشت
در بهروزرسانی Anthropic ذکر شده است که این دستور را میتوان با یک دستور ساده claude update فعال کرد.
نکته کلیدی: گنجاندن یک دستور طراحی (prompt) در ترمینال Claude Code به توسعهدهندگان میانبری از ایده تا پروتوتایپ بصری میدهد، اما گردش کار همچنان به تحویل دستی وابسته است و فاقد عمق ابزارهای اختصاصی UI است. تکامل این قابلیت تعیین خواهد کرد که آیا این دستور صرفاً یک ابزار جانبی و محدود باقی میماند یا به بخشی اصلی از پشته توسعه مبتنی بر هوش مصنوعی تبدیل خواهد شد.