Design Brief
این پرامپت برای کدنویسی، بازبینی و رفع اشکال سریعتر نوشته شده است. چیزی که از مدل میخواهد: «This is a ${page_type:dashboard} of a modern ${focus:government audit} app called ${brand:AuditFlow}.»
متن پرامپت
This is a ${page_type:dashboard} of a modern ${focus:government audit} app called ${brand:AuditFlow}.
Thoroughly analyze the UI in this screenshot and describe it in as much detail as you can to hand over from a UI designer to a developer. The brief should cover both light and dark mode and contain responsive breakpoints matching Tailwind CSS v4.3 defaults.
Output characteristics as structured JSONC.
For colors, extract a rough palette and only detail accents and complex media. The goal is to use only 2 palettes: primary and secondary similar to Tailwind colors. Alongside these 2, you can define any number of grays and accent colors for more complex UI (gradients, shadows, SVGs, etc.).
End with a prompt explaining how to implement the UI for a developer, but don't mention any tech specs; only a brief of the UI to be implemented and the token rules + usage. Output the prompt as a Markdown code block.
The output should be two code blocks: one for the design brief and one for the JSONC design specification.
چطور از این پرامپت استفاده کنم؟
این یک پرامپت در سطح «متوسط» از دسته برنامهنویسی و توسعه نرمافزار است. برای اینکه بهترین نتیجه را بگیری، این مسیر را دنبال کن:
۱) کپی کن. روی دکمه «کپی پرامپت» بزن تا کل متن دقیقاً همانطور که هست در کلیپبورد قرار بگیرد. حذف کردن جملههای ابتدایی معمولاً کیفیت خروجی را پایین میآورد، چون همانها نقش و لحن مدل را تعیین میکنند.
۲) در یک گفتگوی تازه بچسبان. این پرامپت را به عنوان اولین پیام یک چت جدید بفرست. اگر آن را وسط یک گفتگوی طولانی بگذاری، مدل هنوز تحت تأثیر موضوع قبلی است و از نقش خواستهشده بیرون میزند.
۳) بلافاصله بعد از آن، موضوع خودت را بنویس. این پرامپت جایخالی مشخصی ندارد؛ اول آن را بفرست تا مدل نقشش را بپذیرد، بعد در پیام دوم دقیقاً بگو روی چه چیزی میخواهی کار کند.
۴) به مدل زمینه بده. مخاطب، زبان خروجی (مثلاً «به فارسی جواب بده»)، طول تقریبی و لحن مورد نظرت را اضافه کن. بیشتر جوابهای ضعیف نتیجه نبودِ همین سه خط اضافهاند، نه ضعف خودِ پرامپت.
۵) یک بار اصلاح کن. جواب اول را نهایی فرض نکن. بنویس «این بخش را کوتاهتر کن»، «مثال واقعی اضافه کن» یا «سه نسخه متفاوت بده». دور دوم تقریباً همیشه بهتر از دور اول است.
۶) کد را قبل از اجرا بخوان. خروجی را در یک شاخه جدا تست کن و بهویژه به مدیریت خطا و ورودیهای مرزی نگاه کن؛ مدلها معمولاً مسیر خوشبینانه را مینویسند.
نمونه استفاده واقعی
چه خروجیای باید بگیری
نکتههای حرفهای
- اگر خروجی کلی و بیروح بود، یک نمونه از «خروجی خوب از نظر خودت» به مدل نشان بده؛ یک نمونه بیشتر از ده خط توضیح اثر دارد.
- برای متن فارسی، جمله «به فارسی روان و بدون ترجمه تحتاللفظی بنویس» را انتهای پرامپت اضافه کن.
- نسخه زبان و فریمورک را صریح بنویس (مثلاً «Node.js 24 و TypeScript 5») تا کد قدیمی تحویل نگیری.