Magic Patterns: از پرامپت تا پروتوتایپ قابل کلیک
هوش مصنوعی
فرانتاندخلاصهٔ کامل‌تر
طبق این مقاله، Magic Patterns یه ابزار طراحیه که به‌جای کشیدن شکل‌ها روی بوم مثل Figma، توضیحت رو می‌گیره و یه پروتوتایپ تعاملی می‌سازه. خروجی code-backed هست، یعنی پشتش کد فرانت‌اند واقعی هست و مثل یه رابط واقعی کلیک می‌خوره. بعد می‌تونی با پرامپت‌های بعدی ویرایشش کنی و به‌شکل کد یا فایل Figma خروجی بگیری. این شرکت اکتبر ۲۰۲۳ تقریباً هم‌زمان با v0 شروع کرد، وقتی مدل‌ها هنوز گفتگوی رفت‌وبرگشتی رو پشتیبانی نمی‌کردن.
بوم Magic Patterns بیشتر شبیه یه فضای کاری برای context هست. عکس، PRD، یادداشت جلسه یا اسکرین‌شات رو روی بوم می‌ذاری و agent همه رو برای پرامپت بعدی در نظر می‌گیره. تو یه دمو، با انتخاب چند عکس شهر و یه قالب پرامپت، چهار طرح کارت‌پستال متفاوت یه‌جا ساخته شد. نکته‌ی فنی مهمش اینه که چند تا generation رو هم‌زمان روی یه بوم اجرا می‌کنی، پس لازم نیست برای دیدن پنج مدل دکمه منتظر بمونی تا یکی‌یکی ساخته بشن.
به گفته‌ی خود شرکت، یکی از راه‌های اصلی استفاده از محصول الان MCP هست (Model Context Protocol، یعنی استانداردی که ابزارهای هوش مصنوعی باهاش context رد و بدل می‌کنن). این سرور MCP حدود یه سال قبل از این مصاحبه به‌عنوان یه پروژه‌ی هکاتون داخلی ساخته شد. حالا برنامه‌نویس از داخل Cursor یا Claude Code یه UI می‌سازه و نتیجه روی یه بوم مشترک برای هم‌تیمی‌ها نمایش داده میشه. یعنی دیگه خروجی فقط روی localhost خودت گیر نمی‌کنه و یه لینک قابل اشتراک داره.
Magic Patterns نمی‌خواد جای Figma رو بگیره. Figma فرض می‌کنه مهارت طراحی داری و رابط رو خودت ابزار به ابزار می‌سازی، ولی اینجا توضیح می‌دی و روی خروجی AI تکرار می‌کنی. برای فایل‌های دقیق و حرفه‌ای، کار به Figma یا به coding agent دلخواهت فرستاده میشه. شرکت می‌گه model agnostic و export agnostic هست، یعنی به یه مدل یا یه فرمت خروجی قفلت نمی‌کنه.
تو خود شرکت هم آدم‌های غیرطراح، مثل تیم فروش و go-to-market، باهاش کارت‌پستال رویداد و متریال بازاریابی می‌سازن. البته شرکت قبول داره که بوم برای همه خودبه‌خود قابل فهم نیست و الان دنبال استخدام یه طراحه تا onboarding رو بازطراحی کنه و معلوم بشه کی باید از بوم کامل استفاده کرد و کی از یه چت ساده.
نکات کلیدی:
- Magic Patterns اکتبر ۲۰۲۳ هم‌زمان با v0 راه افتاد
- بنیان‌گذارهاش برنامه‌نویس فرانت‌اند هستن، نه طراح
- خروجی پروتوتایپ تعاملی با کد واقعیه و به Figma یا کد export میشه
- چند generation هم‌زمان روی یه بوم اجرا می‌شن
- سرور MCP اجازه می‌ده از داخل Cursor و Claude Code طراحی بسازی و روی بوم مشترک ببینی
- ابزار model agnostic و export agnostic هست
