🤖 AI CANVAS DROP — جلوی چشمت Claude دیزاین می‌کنه

یه Canvas شبیه Figma که AI Agent واقعاً داخلش طراحی می‌کنه...

اسمش Doopـه.

Claude Code، Codex و Agentهای سازگار با MCP می‌تونن وارد Canvas بشن و همون‌جا کنار تو کار کنن.

یعنی به‌جای اینکه فقط Prompt بدی و منتظر خروجی بمونی،
می‌بینی Agent داره Frame می‌سازه، تغییر می‌ده و Design رو جلو می‌بره.

حتی می‌تونی:

✦ روی Design کامنت بذاری و تبدیلش کنی به Task
✦ ببینی Agent الان دقیقاً روی چی کار می‌کنه
✦ چند Agent رو روی یه Canvas داشته باشی
✦ تصمیم‌ها و Styleهای پروژه رو به‌عنوان Memory نگه داری
✦ بذاری از خروجی خودش Screenshot بگیره و Reviewش کنه

بیشتر از اینکه شبیه «AI برای طراحی» باشه،
حس یه فضای مشترک بین Designer و Agent رو می‌ده.

Open Sourceـه
و فعلا Beta و رایگانه.

🔗 https://doop.design/

این مدل همکاری Designer + AI به نظرم قراره خیلی بیشتر ببینیم 👀

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🔥 UI8 DROP — فایل ۵۹ دلاری، فقط ۲۴ ساعت رایگان

این یکی رو فقط برای خودت نگه ندار 👀
اگه یه Product Designer / Fintech Designer می‌شناسی،
قبل از اینکه ۲۴ ساعتش تموم بشه براش بفرست.

Cushion یکی از UI Kitهای جدید UI8 برای
AI + Personal Financeـه.

💰 قیمت روی UI8: $59

ولی تا ۲۴ ساعت آینده
رایگان از FigmaPro Bot می‌تونید دریافتش کنید ❤️

🔗 لینک UI8:
https://ui8.net/moyin/products/cushion---ai-finance-companion-ui-kit

لینک رو کپی کنید و برای بات بفرستید:
@figmapro_bot

⏳ فقط ۲۴ ساعت

🎁 یه قرار هم بذاریم:

اگه این Drop به ۵۰ Share برسه،
یه فایل مکمل دیگه هم فردا رایگان می‌کنیم.

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🎒 DESIGNER TOOLBOX — ۵۱۱ ابزار و منبع دیزاین، یکجا

این سایت رو یه گوشه Save کنید؛
احتمالا بارها برمی‌گردید سراغش :)

۵۱۱ تا Tool و Resource برای دیزاینرها رو
خیلی تمیز دسته‌بندی کرده:

✦ AI Design
✦ Inspiration
✦ UI Kit & Assets
✦ Icon
✦ Color & Typography
✦ Design System
✦ Accessibility
✦ Research & Testing
✦ Handoff
✦ Portfolio & Career

قسمت خوبش اینه که لازم نیست بین صدتا لیست بگردی.

می‌تونی دقیقا بر اساس کاری که می‌خوای انجام بدی سرچ کنی
و حتی فقط گزینه‌های Free رو ببینی.

🔗 https://sakshamux.com/

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🚨 مشکل ریجن سرویس‌های Google برای کاربران ایرانی

اگه این چند وقت Gemini، Google Flow، AI Studio یا Antigravity براتون باز نمی‌شه و با ارور Region مواجه می‌شید، ممکنه مشکل فقط VPN نباشه.

برای بعضی اکانت‌ها، Country Association حساب Google روی ایران مونده و حتی با تغییر IP هم سرویس همچنان Region قبلی رو تشخیص می‌ده.

این روش رو امتحان کنید 👇

1️⃣ VPN رو روی یک کشور ثابت مثل آلمان یا آمریکا وصل کنید.

2️⃣ با همون اکانت Google وارد این صفحه بشید:

🔗 https://policies.google.com/country-association-form

3️⃣ Country / Region اکانت رو بررسی کنید.

4️⃣ اگه روی ایران یا Region اشتباه قرار گرفته، درخواست تغییرش رو ثبت کنید.

5️⃣ بعد از ثبت درخواست، بهتره تا زمان بررسی Google با همون IP ثابت وارد اکانت بشید و مدام کشور VPN رو عوض نکنید.

بعد از تأیید تغییر Region هم یک‌بار از اکانت خارج و دوباره وارد بشید.

این روش برای بعضی از کاربران ایرانی که با Gemini، Flow و بقیه سرویس‌های Google مشکل Region داشتن جواب داده.

اگه کسی رو می‌شناسید که چند وقته فقط VPN عوض می‌کنه ولی هنوز این ارور رو می‌بینه، این پست رو براش بفرستید 👀

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

📱 iPHONE DUO — اپت رو برای آیفون تاشو آماده کن
iPhone Duo معرفی شده و یه سؤال جذاب برای ما دیزاینرا داره:
UI فعلیمون وقتی گوشی باز میشه باید چه شکلی بشه؟ 👀
یه Screen از اپت رو بنداز داخل Figma Make و این Prompt رو بزن:
Create an adaptive iPhone Duo version of my attached mobile design.
Create two interactive states:
CLOSED
Outer Display: 1398 × 2034 px
Keep the experience compact.
Preserve hierarchy, navigation and primary actions.
OPEN
Inner Display: 1878 × 2670 px
Do NOT simply stretch the mobile UI.
Adapt the layout to the larger canvas.
Use two-column or master-detail layouts where appropriate.
Preserve content and state between both modes.
Create a smooth interactive transition between CLOSED and OPEN.
Rules:
• Responsive, not two separate products
• No stretched mobile layouts
• Use vertical navigation where appropriate
• Preserve the visual language of my original design
Return:
Closed version
Open version
Interactive transition prototype
ابعاد:
📱 Outer
1398 × 2034 px
📖 Inner
1878 × 2670 px
راهنمای طراحی Apple:
https://developer.apple.com/design/human-interface-guidelines/designing-for-iphone-duo
🎁 پست بعدی:
موکاپ iPhone Duo رو برای ۲۴ ساعت رایگان می‌ذاریم.
این یکی رو Unmute کن که Drop رو از دست ندی 👀
مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🎁 UI8 DROP — موکاپ iPhone Duo فقط ۲۴ ساعت رایگان

همون موکاپی که تو پست قبلی قولش رو داده بودیم 👀

اگه Prompt قبلی رو تست کردید و UI اپتون رو برای iPhone Duo ساختید، حالا وقتشه یه Present درست‌وحسابی ازش بگیرید.

موکاپ iPhone Duo رو تا ۲۴ ساعت آینده رایگان گذاشتیم ❤️

لینک UI8:
https://ui8.net/figmapro/products/iphone-duo-mockup

لینک رو کپی کنید و برای بات بفرستید:

@figmapro_bot

⏳ بعد از ۲۴ ساعت از حالت رایگان خارج میشه.

یه قرار هم بذاریم:

اگه این Drop به ۳۰ Share برسه، یه فایل مرتبط دیگه هم فردا رایگان می‌کنیم 🎁

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

وقتی فهمیدم معین سپهری قراره همچین بوت‌کمپی برگزار کنه، واقعا ذوق کردم؛ چون اگه بخوام برای یاد گرفتن Product Design یه نفر رو پیشنهاد بدم، معین قطعا جزو اولین آدماییه که به ذهنم می‌رسه.

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

پستش رو پایین می‌ذارم، اگه این مسیر براتون جدیه حتما بخونیدش ❤

بوت‌کمپ پروداکت دیزاینر بیلدر ۲۰۲۶

یه بوت‌کمپ ۳ ماهه، عاری از هر کلیشه طراحی، حرف‌های تکراری و اصول غیر عملی.

این بوت‌کمپ چکیده‌ای از تمام تجربیات من در مسیر طراحی محصوله؛ از ۴ سال منتورینگ گرفته تا برگزاری کارگاه‌های متعدد با موضوع حل مسئله، دیزاین سیستم، طراحی محصول B2B و...

تو این بوت‌کمپ از روز و لحظه اول با حل مسئله و ساختن راه‌حل سروکله می‌زنیم؛ مسائلی از جنس تجربه کاربر، دغدغه بیزنس، محدودیت فنی و...

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

تو مسیر این بوت‌کمپ، مفصل از workflow کاربردی استفاده از هوش مصنوعی و Agent ها تو زمینه‌های مختلف حرف می‌زنیم و محصولات واقعی باهاش خلق می‌کنیم.

اطلاعات بیشتر و ثبت‌نام از لینک زیر👇

https://builders-bootcamp.figma.site

پ.ن.
بله این سایت با Figma Make و در عرض ۲ ساعت ساخته شده؛ لطفا با vpn بازش کنید.

منتظر دیدن‌تون هستم❤️

📱 UX AGENT — بذار AI واقعا محصولت رو استفاده کنه

تا الان برای UX Review معمولا Screenshot می‌دادیم به AI.

با GPT-6 Astra یه مرحله جذاب‌تر شده:

URL محصول رو بده و بذار خودش مثل یه کاربر واردش بشه، کلیک کنه و Flow رو جلو ببره. 👀

مثلاً این Prompt:

Prompt:

Act as a first-time user of this product.

Open the website and complete this goal:

[WRITE USER GOAL]

Do not just inspect the page visually.

Actually navigate the product step by step and behave like a real user who has never seen it before.

While doing the task, track:

• Moments where you hesitate
• Things you expect to be clickable but aren’t
• Labels or actions that are unclear
• Information you need but can’t find
• Unexpected behavior
• Unnecessary steps
• Dead ends
• Places where you lose confidence
• Anything that makes the next action unclear

For every issue, report:

1. What happened
2. What you expected instead
3. Why this could confuse a real user
4. Severity: Low / Medium / High
5. Evidence from the actual flow

Do not suggest redesigns yet.

At the end, give me:

• Task completion status
• Total steps taken
• Top 5 friction points
• The exact moment most likely to cause drop-off
• Questions I should validate with real users

URL:
[PASTE URL]

یعنی به‌جای اینکه AI فقط UI رو نگاه کنه،
می‌ذاری واقعا UX رو تجربه کنه.

جای Usability Test واقعی رو نمی‌گیره،
ولی برای پیدا کردن Frictionهای اولیه قبل از تست با کاربر واقعا باحاله.

اگه Product Designer می‌شناسی این Prompt رو براش بفرست 👀

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

بیش از 20,000 طراحی واقعی UI رو یکجا جمع کرده؛ برای Web و Mobile، با این تفاوت که Referenceها رو می‌تونی برای کار با AI هم استفاده کنی.

یعنی به‌جای اینکه به AI بگی:

«یه Dashboard مدرن برام طراحی کن»

می‌تونی اول یه طراحی واقعی که دوست داری پیدا کنی و از همون به‌عنوان Reference استفاده کنی.

Kombai Gallery برای هرچی دنبال Inspiration می‌گردی، از Dashboard و Landing Page گرفته تا Mobile UI، یه منبع خیلی بزرگه.

یه چیز جالب‌تر هم داره:
طراحی‌ها فقط برای آدم‌ها نیستن؛ برای AI Agentها هم index شدن.

اگه زیاد برای طراحی با AI Reference جمع می‌کنی، اینو Bookmark کن.

🔗 https://kombai.com/gallery/

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

📱 اولین آیفون تاشو اومد و کیت فیگماش هم آماده‌ست

آیفون Duo اولین آیفون فولدبل اپله؛ بسته یه صفحه ۵.۴ اینچی داره، باز که بشه به ۷.۶ اینچ تبدیل می‌شه با نسبت تصویر یکسان.
نکته مهم برای ما دیزاینرها اینه که iOS 27 برای این فرم‌فکتور از پایه بازطراحی شده: چیدمان با باز و بسته شدن عوض می‌شه، Dock و کنترل‌ها میان کنار صفحه، و Split View هم اضافه شده. یعنی طراحی برای Duo فقط عوض کردن سایز فریم نیست.

✨ خبر خوب اینکه فریم‌های آیفون Duo به کیت رسمی iOS اپل تو فیگما اضافه شدن. پس هم حالت بسته و هم باز رو می‌تونی مستقیم موکاپ کنی:
https://www.figma.com/community/file/1651309003795292092/ios-and-ipados-27

💡 طراحی یه اپ برای حالت تاشوی Duo این روزها گزینه خوبیه برای تمرین یا portfolio، چون کمتر کسی سراغش رفته.

مرجع تخصصی طراحان محصول 🆔 @figmapro_ir

🎬 این سایت انیمیشن‌های UI رو از هزار اپ واقعی جمع کرده

یه دغدغه همیشگی موقع کار روی موشن: می‌خوای یه Success State یا Onboarding یا Dropdown رو انیمیت کنی، ولی نمی‌دونی بقیه این حرکت رو چطور حل کردن. باز کردن تک‌تک اپ‌ها و ضبط کردنشون هم که کلی وقت می‌بره.

Ripplix بیش از ۷۰۰۰ میکرواینتراکشن واقعی رو از هزار اپ یکجا جمع کرده. فرقش با اسکرین‌شات اینه که فقط حالت نهایی رو نمی‌بینی، خود حرکت و تایمینگ interaction جلو چشمته.
می‌تونی بر اساس نوع تعامل فیلتر کنی؛ از Scroll و Success و Popover تا Dropdown و Onboarding، اونم برای موبایل، وب، اسمارت‌واچ و حتی AR/VR.
برای وقتی که روی حس و ریتم حرکت یه کامپوننت کار می‌کنی یا دنبال رفرنس موشن می‌گردی، یه منبع کم‌نظیره.

رایگان، فقط با یه ثبت‌نام ساده: 🔗 https://www.ripplix.com/

این یکی رو برای دیزاینری بفرست که هنوز موشن رو با حدس و گمان می‌زنه ❤️

مرجع تخصصی طراحان محصول 🆔 @figmapro_ir

🔍 طرحتو قبل از کلاینت، بده یه نفر بی‌طرف نقدش کنه

اون لحظه که طرحو تموم می‌کنی، دیگه اونقدر توش غرق شدی که مشکلاتشو نمی‌بینی. بعد وسط جلسه با کلاینت یا موقع هندآف تازه یکی می‌گه «این دکمه چرا اینجاست؟».
این پرامپت طرحتو مثل یه ریویوئر سخت‌گیر نگاه می‌کنه و نقطه‌به‌نقطه می‌گه کجا لنگ می‌زنه، با درجهٔ اهمیت و راه‌حل مشخص. فقط یه اسکرین‌شات از طرحت رو آپلود کن و این رو بزن:

Review the attached UI screen as a critical design reviewer preparing feedback before it goes to stakeholders.

Evaluate it against these lenses:
- Visual hierarchy — is the eye guided to the primary action?
- Spacing & alignment — inconsistent gaps, broken rhythm, weak grouping
- Typography — scale, hierarchy, readability
- Contrast & accessibility — text legibility, tap target size
- Clarity — confusing labels, unclear states, hidden actions

For every issue, report:
1. What's wrong
2. Why it hurts the user
3. Severity: Low / Medium / High
4. A specific, concrete fix

Then give me:
- Top 3 things to fix first (highest impact)
- One thing that already works well

Be direct and specific. Point to exact elements. Don't redesign the screen, just critique it.

جای چشم یه سینیور رو نمی‌گیره، ولی برای یه چک سریع قبل از اینکه کارتو نشون بدی، واقعا کمکت می‌کنه. برای یه دیزاینر دیگه هم بفرست که کارش همیشه نیاز به یه ریویو داره.

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

📊 ساخت جدول توی فیگما هنوز این‌قدر دردسره؟
اگه تا حالا برای یه داشبورد مجبور شدی:
۲۰ ردیف بسازی
داده‌های فیک وارد کنی
Statusها رو یکی‌یکی عوض کنی
و بعد تازه بفهمی جدول باید تغییر کنه...
این پلاگین می‌تونه خیلی از این کارها رو یک‌جا انجام بده.
GenTable برای ساخت Table داخل Figma ساخته شده:
→ مثلاً می‌گی: 15 users, half active, half pending
→ خودش داده‌ی نمونه می‌سازه
→ می‌تونی کامپوننت‌های خودت رو به ستون‌ها وصل کنی
→ Status و Variantها رو بر اساس داده تنظیم می‌کنه
→ CSV وارد می‌کنی
→ جدول رو بین حالت Row و Column جابه‌جا می‌کنی
→ ساختار و ظاهرش همچنان قابل ادیته
یعنی به‌جای اینکه خود جدول رو دستی بسازی، روی داده و سناریو تمرکز می‌کنی.

برای Dashboard، CRM، پنل ادمین، SaaS و هر UI دیتامحوری، خیلی کاربردیه.

🔗 GenTable:
https://www.figma.com/community/plugin/1590248825727689288/gentable

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🎛 ببین بیش از ۱۰۰ شرکت بزرگ یه «دکمه» رو چطور طراحی کردن

سایت Design Systems Surf اومده دیزاین‌سیستم بیش از ۱۰۰ شرکت واقعی رو یکجا جمع کرده؛ از Material و Fluent و Apple HIG تا Shopify و GitHub و Adobe.
نکتهٔ اصلیش این نیست که فقط لیست‌شون کرده.

می‌تونی یه کامپوننت رو انتخاب کنی و anatomy، state‌ها، رفتار و نحوهٔ استفاده‌شو بین همهٔ این سیستم‌ها کنار هم ببینی. برای Typography و Color و Spacing و Token‌ها هم همین مقایسه رو داری.
یعنی به‌جای حدس زدن، می‌بینی شرکت‌هایی که سال‌ها روش کار کردن، هر تصمیم رو چطور گرفتن.

بخش اصلی مرور و مقایسه رایگانه: 🔗 https://designsystems.surf

مرجع تخصصی طراحان محصول 🆔 @figmapro_ir

🤖 قبل از اینکه یه فیچر AI طراحی کنی، این رو ببین

الان تقریبا هر پروژه‌ای یه فیچر AI داره؛ چت، استریم جواب، prompt bar، نمایش منبع. ولی برخلاف دکمه و فرم که سال‌ها روش کار شده، الگوهای UX این حوزه هنوز جا نیفتاده و هر کسی داره از صفر و با حدس و گمان می‌سازتش.

یه سایت اومده ۱۵۰+ الگوی UX واقعی رو از محصولات AI که همه می‌شناسیم (ChatGPT، Claude، Perplexity، Cursor) جمع کرده. توی ۱۱ دسته مثل:
چت و استریم، خودمختاری Agent و ابزارها، اعتماد و شفافیت (نمایش منبع، reasoning، تأیید کاربر)، حالت‌های ورودی و ضمیمه، و نمایش هزینه و پرفورمنس.

نکتهٔ اصلیش این نیست که فقط اسکرین‌شات گذاشته. برای هر الگو دموی زنده داری، بهت می‌گه کِی ازش استفاده کنی، چه اشتباهاتی توش رایجه و کجاها کاربر اعتماد یا پول یا زمانش رو از دست می‌ده.
یعنی وقتی داری یه فیچر AI اسپک می‌کنی، به‌جای حدس زدن، می‌بینی محصولاتی که میلیون‌ها کاربر دارن این مسئله رو چطور حل کردن.

رایگان: 🔗 https://aiuxplayground.com/patterns/

این یکی رو برای هرکی داره این روزها یه فیچر AI طراحی می‌کنه بفرست، دقیقا همون رفرنسیه که هنوز جاش خالیه ❤️

مرجع تخصصی طراحان محصول 🆔 @figmapro_ir

⚡️ حالا می‌تونی از Codex مستقیم به دیزاین فیگمات وصل شی
اوپن‌ای‌آی تو DevDay یه سری خبر داد که یکیشون واقعا ورق رو برای دیزاینرها برمی‌گردونه.

تا الان کدنویسی از روی دیزاین یعنی دولوپر چشمش به فیگما بود و از رو حدس فاصله و رنگ و کامپوننت رو درمیاورد. حالا Dev Mode مستقیم اومده داخل Codex؛ یعنی هوش مصنوعی خودش context دیزاینتو می‌خونه و دقیقا با همون توکن‌ها و اسپیسینگ و کامپوننت‌های تو کد می‌زنه، نه یه چیز تقریبی.

این تنها خبر نبود:
GPT 6.1 Sol از امروز داره تو Figma Make میاد، یعنی موتور prompt-to-prototype فیگما با یه مدل خیلی قوی‌تر کار می‌کنه.
فیگما رسما شریک لانچ OpenAI B2B Marketplace هم شده که به‌زودی رونمایی می‌شه.

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

مرجع تخصصی طراحان محصول 🆔 @figmapro_ir

🚀 کامپوننت‌های آماده برای Claude و Codex

چندتا منبع کاربردی برای وقتی که با AI کدنویسی می‌کنید و نمی‌خواید UI رو از صفر بسازید:

Affect UI
کامپوننت‌های آماده و قابل استفاده برای ساخت رابط‌های مدرن با AI.
🔗 affectui.com

Beautiful UI
مجموعه‌ای از کامپوننت‌های خوش‌ساخت برای اینکه خروجی Claude و Codex کمتر Generic به نظر برسه.
🔗 beautifului.dev

Transitions.dev
کتابخانه‌ای از انیمیشن‌ها و Transitionهای آماده برای اضافه کردن Motion به پروژه.
🔗 transitions.dev

aMicro
مجموعه‌ای از Micro Interactionها و جزئیات کوچک UI که می‌تونن حس محصول رو خیلی بهتر کنن.
🔗 amicro.vercel.app

Canvas UI
افکت‌های جذاب WebGL/WebGPU مثل Liquid، Glass، Particle و Shatter برای UIهای خاص‌تر.
🔗 canvasui.dev

💡 اگه با Claude یا Codex کدنویسی می‌کنی، اینا رو یه‌بار ذخیره کن. احتمالاً چند بار به کارت میاد.

چیز خفن دیگه‌ای می‌شناسید که به این لیست اضافه بشه؟ 👇

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🎁 ۸۰۰۰ آیکون رایگان برای پروژه‌های شما

Keyline Icons بیش از ۱۰۰۰ آیکون داره که هرکدوم در ۴ استایل مختلف ارائه شدن.

• ۲ نوع Shape
= در مجموع ۸۰۰۰ آیکون رایگان 🤯

همه با لایسنس MIT و بدون نیاز به Attribution.

🔗 keylineicons.com

اگه دنبال یه مجموعه آیکون رایگان و قابل استفاده توی پروژه‌های تجاری هستید، اینو ذخیره کنید. 👌

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir

🚗 Icoonia — Transportation Icon Pack

یه پَک خوش‌ساخت از آیکون‌های حوزه حمل‌ونقل برای استفاده در UI، اپلیکیشن و وب.

🚘 Transportation Icons
مناسب برای طراحی اپ‌های حمل‌ونقل، نقشه، سفر، لجستیک و پروژه‌های مرتبط.

🎁 این فایل رو رایگان در اختیار شما گذاشتیم.
فقط ۲۴ ساعت

📥 روش دریافت:
فقط کافیه لینک محصول رو کپی کنی و برای بات زیر بفرستی تا فایل رو دریافت کنی:

@figmapro_bot

🔗 صفحه اصلی محصول:

https://ui8.net/kawalanstudio/products/icoonia---transportation-icon-pack

مرجع تخصصی طراحان محصول
🆔 @figmapro_ir