Sidebar Dashboard Design

⌨️ برنامه‌نویسی سطح متوسط کیفیت 78٪ 601 کاراکتر

این پرامپت به هوش مصنوعی نقش «Frontend Developer» را می‌دهد و برای کدنویسی، بازبینی و رفع اشکال سریع‌تر به کار می‌آید. جمله آغازین آن: «Act as a Frontend Developer.»

متن پرامپت

Act as a Frontend Developer. You are tasked with designing a sidebar dashboard interface that is both modern and user-friendly. Your responsibilities include:

- Creating a responsive layout using HTML5 and CSS3.
- Implementing interactive elements with JavaScript for dynamic content updates.
- Ensuring the sidebar is easily navigable and accessible, with collapsible sections for different functionalities.
- Using best practices for UX/UI design to enhance user experience.

Rules:
- Maintain clean and organized code.
- Ensure cross-browser compatibility.
- Optimize for mobile and desktop views.

چطور از این پرامپت استفاده کنم؟

این یک پرامپت در سطح «متوسط» از دسته برنامه‌نویسی و توسعه نرم‌افزار است. برای اینکه بهترین نتیجه را بگیری، این مسیر را دنبال کن:

۱) کپی کن. روی دکمه «کپی پرامپت» بزن تا کل متن دقیقاً همان‌طور که هست در کلیپ‌بورد قرار بگیرد. حذف کردن جمله‌های ابتدایی معمولاً کیفیت خروجی را پایین می‌آورد، چون همان‌ها نقش و لحن مدل را تعیین می‌کنند.

۲) در یک گفتگوی تازه بچسبان. این پرامپت را به عنوان اولین پیام یک چت جدید بفرست. اگر آن را وسط یک گفتگوی طولانی بگذاری، مدل هنوز تحت تأثیر موضوع قبلی است و از نقش خواسته‌شده بیرون می‌زند.

۳) بلافاصله بعد از آن، موضوع خودت را بنویس. این پرامپت جای‌خالی مشخصی ندارد؛ اول آن را بفرست تا مدل نقشش را بپذیرد، بعد در پیام دوم دقیقاً بگو روی چه چیزی می‌خواهی کار کند.

۴) به مدل زمینه بده. مخاطب، زبان خروجی (مثلاً «به فارسی جواب بده»)، طول تقریبی و لحن مورد نظرت را اضافه کن. بیشتر جواب‌های ضعیف نتیجه نبودِ همین سه خط اضافه‌اند، نه ضعف خودِ پرامپت.

۵) یک بار اصلاح کن. جواب اول را نهایی فرض نکن. بنویس «این بخش را کوتاه‌تر کن»، «مثال واقعی اضافه کن» یا «سه نسخه متفاوت بده». دور دوم تقریباً همیشه بهتر از دور اول است.

۶) کد را قبل از اجرا بخوان. خروجی را در یک شاخه جدا تست کن و به‌ویژه به مدیریت خطا و ورودی‌های مرزی نگاه کن؛ مدل‌ها معمولاً مسیر خوش‌بینانه را می‌نویسند.

نمونه استفاده واقعی

پرامپت را بفرست، بعد در پیام بعدی چیزی شبیه این بنویس: «این تابع که کندی دارد را برایت می‌فرستم؛ گلوگاه را پیدا کن و نسخه بهینه را با توضیح تغییرات بده.»

چه خروجی‌ای باید بگیری

یک پاسخ ساختارمند شامل تشخیص مشکل، کد اصلاح‌شده، و توضیح خط‌به‌خط تغییرات.

نکته‌های حرفه‌ای

  • اگر خروجی کلی و بی‌روح بود، یک نمونه از «خروجی خوب از نظر خودت» به مدل نشان بده؛ یک نمونه بیشتر از ده خط توضیح اثر دارد.
  • برای متن فارسی، جمله «به فارسی روان و بدون ترجمه تحت‌اللفظی بنویس» را انتهای پرامپت اضافه کن.
  • نسخه زبان و فریم‌ورک را صریح بنویس (مثلاً «Node.js 24 و TypeScript 5») تا کد قدیمی تحویل نگیری.

روی کدام مدل‌ها بهتر جواب می‌دهد

Claude OpusGPT-5

پرامپت‌های مرتبط