وارد کردن به Figma: Buddy تصاویر، HTML، طراحی کلود، نمونه های اولیه کلود و وب سایت ها را به لایه تبدیل می کند1 min read
Reading Time: 6 minutesکار طراحی دیگر از یک مکان شروع نمی شود.
گاهی اوقات اولین ایده یک نمونه اولیه Claude Design است. گاهی اوقات این یک مصنوع کلود است. گاهی اوقات این یک آزمایش HTML، یک اسکرین شات، یک صفحه فرود مورد علاقه شما یا یک وب سایت زنده است که تیم شما می خواهد از آن بیاموزد.
مشکل این نیست که هوش مصنوعی یا وب برای ایجاد چیز جالبی ایجاد نشود. مشکل این است که این ایده را به جایی که طراحی محصول واقعاً اتفاق میافتد بازگرداند: Figma.
Buddy به شما امکان می دهد تقریباً هر چیزی را به Figma وارد کنید و آن را به لایه های طراحی قابل ویرایش روی بوم تبدیل کنید. یک اسکرین شات صاف نیست. یک تصویر مرجع ثابت نیست. لایههای واقعی را میتوانید ویرایش، سازماندهی، پالایش و کنار گذاشتن آنها انجام دهید.
با Buddy هر چیزی را به Figma وارد کنید، سپس به طراحی در Figma ادامه دهید
Buddy عامل طراحی Figma AI Anima است. در Figma زندگی میکند، بوم شما را میخواند و به شما کمک میکند تا طرحها را از طریق چت ایجاد، ویرایش و سازماندهی کنید.
اکنون Buddy همچنین به عنوان پل بین الهام از بیرون و گردش کار Figma شما کار می کند. چسباندن یک مصنوع، تصویر، اسکرین شات، HTML، یا URL، و Buddy آن را به لایههای Figma قابل ویرایش تبدیل میکند تا بتوانید فرآیند طراحی را بدون بازسازی دستی هر فریم ادامه دهید.
این بدان معناست که شما می توانید از این موارد شروع کنید:
- مصنوعات Claude Design، زمانی که می خواهید یک رابط تولید شده با هوش مصنوعی را به Figma بیاورید.
- مصنوعات کلود، زمانی که یک نمونه اولیه، صفحه نمایش یا ایده تعاملی در کلود ایجاد شد.
- مصنوعات HTML، زمانی که طراحی از HTML تولید شده یا یک مدل رمزگذاری شده شروع می شود.
- تصاویر و اسکرین شات ها، زمانی که می خواهید یک مرجع بصری را جایگذاری کنید و لایه های Figma قابل ویرایش را دریافت کنید.
- وب سایت URLs، هنگامی که می خواهید یک وب سایت عمومی را به عنوان یک طرح در Figma شبیه سازی کنید، می توانید آن را بررسی و دوباره میکس کنید.
گردش کار ساده است: منبع را به Buddy بیاورید، اجازه دهید Anima ساختار بصری را تفسیر کند، سپس به طراحی مستقیم روی بوم Figma ادامه دهید.
چرا این مهم است: هوش مصنوعی اولین پیش نویس را به شما می دهد، Figma به شما کنترل می دهد
ابزارهای هوش مصنوعی در تولید اولین پیش نویس ها بسیار خوب هستند. آنها می توانند مفاهیم برنامه، صفحات فرود، داشبورد، جریان های داخلی، صفحات قیمت گذاری، ابزارهای داخلی و آزمایشات محصول را در چند دقیقه ایجاد کنند.
اما کار طراحی حرفه ای به اولین پیش نویس ختم نمی شود. معمولا از آنجا شروع می شود.
تیم ها هنوز باید نسخه را ویرایش کنند، سلسله مراتب را اصلاح کنند، نام تجاری را اعمال کنند، فاصله ها را تراز کنند، از کامپوننت ها استفاده کنند، موارد لبه را بررسی کنند، و فایلی آماده کنند که دیگر طراحان، PM ها و مهندسان واقعاً بتوانند با آن کار کنند.
به همین دلیل واردات اهمیت دارد. اگر ایده تولید شده توسط هوش مصنوعی در پنجره چت، نمایشگر مصنوع، اسکرین شات یا برگه مرورگر قفل بماند، تبدیل شدن به یک جریان کاری طراحی محصول واقعی دشوار است.
Buddy آن کار را به عنوان لایههای قابل ویرایش به Figma برمیگرداند، بنابراین خروجی هوش مصنوعی به چیزی تبدیل میشود که تیم شما میتواند شکل دهد.
مصنوعات Claude Design را به Figma وارد کنید
Claude Design برای کاوش سریع ایده های UI و مفاهیم تعاملی عالی است. می توانید یک محصول، ویژگی یا صفحه فرود را توصیف کنید و به سرعت یک مصنوع صیقلی دریافت کنید.
اما اگر گام بعدی بازبینی طراحی، اصلاح نام تجاری یا انتقال است، تیم شما معمولاً به نتیجه در Figma نیاز دارد.
با Buddy، می توانید یک مصنوع Claude Design را به Figma بیاورید و از آنجا ادامه دهید. Buddy رابط را به صورت لایههای قابل ویرایش دوباره ایجاد میکند، بنابراین میتوانید طرحبندی، تایپوگرافی، رنگها، فاصله، نمادها و محتوای روی بوم را تنظیم کنید.
این زمانی مفید است که یک بنیانگذار، PM، بازاریاب یا مهندس ابتدا یک نمونه اولیه هوش مصنوعی ایجاد کند، سپس از یک طراح بخواهد که آن را با کیفیت تولید کند.
مصنوعات کلود و نمونه های اولیه هوش مصنوعی را وارد کنید
مصنوعات کلود می توانند بیش از یک صفحه نمایش داشته باشند. آنها می توانند شامل حالت ها، پانل ها، منوها، فرم ها، جداول، کارت ها، حالت های خالی و مفاهیم کامل UI باشند.
به جای گرفتن اسکرین شات به صورت دستی و ردیابی طرح، آرتیفکت را در Buddy قرار دهید. Anima آن را به یک طرح ساختار یافته Figma تبدیل می کند که تیم شما می تواند آن را ویرایش کند.
هنگامی که روی بوم قرار گرفت، می توانید:
- صفحه نمایش را به قاب جدا کنید.
- متن و کپی محصول را ویرایش کنید.
- فاصله و سلسله مراتب را اصلاح کنید.
- دارایی های برند را جایگزین تصاویر عمومی کنید.
- سیستم طراحی خود را اعمال کنید.
- طرح را برای بازبینی یا تحویل مهندسی آماده کنید.
نمونه اولیه هوش مصنوعی به نقطه شروع تبدیل می شود، نه بن بست.
مصنوعات HTML را به Figma وارد کنید
اکنون بسیاری از ابزارهای هوش مصنوعی HTML را به عنوان خروجی طراحی خود تولید می کنند. این می تواند برای پیش نمایش های سریع مفید باشد، اما HTML همیشه بهترین مکان برای ارزیابی طراحی محصول نیست.
طراحان به کنترل بوم نیاز دارند. آنها باید لایه ها را جابجا کنند، گزینه ها را مقایسه کنند، سلسله مراتب را بررسی کنند و کار را با یک سیستم طراحی تراز کنند.
Buddy با بازگرداندن مصنوعات HTML به Figma کمک می کند. میتوانید از خروجی HTML بهعنوان منبع استفاده کنید، سپس آن را به لایههای Figma قابل ویرایش تبدیل کنید که میتوانند تمیز، سازماندهی مجدد و صیقل شوند.
این به ویژه برای تیم هایی مفید است که ابتدا کد را نمونه سازی می کنند، سپس به یک فایل طراحی مناسب برای همکاری نیاز دارند.
یک تصویر یا اسکرین شات را جایگذاری کنید و لایه های Figma قابل ویرایش را دریافت کنید
اسکرین شات ها در همه جای کار محصول وجود دارد.
کاربر یک اسکرین شات از جریانی که دوست دارد ارسال می کند. هم تیمی یک صفحه رقیب را به اشتراک می گذارد. یک PM یک ایده UI خشن را در Slack میاندازد. بنیانگذار یک صفحه فرود را با ابزار هوش مصنوعی دیگری ترسیم می کند.
به طور معمول، آن اسکرین شات فقط یک مرجع است. میتوانید آن را در Figma قرار دهید، اما اگر میخواهید آن را ویرایش کنید، همچنان باید UI را به صورت دستی بازسازی کنید.
با Buddy، می توانید یک تصویر یا اسکرین شات را چسبانده و آن را به لایه های Figma قابل ویرایش تبدیل کنید. متن، طرحبندی، ساختار بصری و عناصر رابط کاربری به چیزی تبدیل میشوند که میتوانید با آن روی بوم کار کنید.
این مزاحم ترین بخش فرآیند را ذخیره می کند: بازآفرینی آنچه از قبل وجود دارد فقط برای اینکه بتوانید تغییراتی ایجاد کنید.
با چسباندن یک URL هر وب سایتی را شبیه سازی کنید
الهام گرفتن از وب سایت یکی از رایج ترین نقاط شروع برای محصول جدید و کار بازاریابی است.
شاید ساختار یک صفحه اصلی SaaS را دوست داشته باشید. شاید بخواهید یک صفحه قیمت گذاری را مطالعه کنید. شاید لازم باشد طرحبندی داشبورد، جریان ورودی یا بخش صفحه فرود را ثبت کنید.
با Buddy، می توانید یک وب سایت URL را جایگذاری کنید و صفحه را به عنوان یک طرح قابل ویرایش در Figma بیاورید. به جای ذخیره اسکرین شات، Buddy به شما کمک می کند ساختار بصری را به صورت لایه های روی بوم بازسازی کنید.
از آن برای یادگیری از الگوها، کاوش جایگزین ها، ساختن تابلوهای روحی یا سرعت بخشیدن به نسخه اول یک صفحه جدید استفاده کنید. سپس با نسخه، اجزاء، نام تجاری و داستان محصول خود آن را مال خود کنید.
آنچه در بوم Figma دریافت می کنید
تفاوت اصلی در ویرایش پذیری است.
Buddy فقط قرار دادن یک بیت مپ روی بوم نیست. هدف این است که یک طرح کاربردی Figma را به شما ارائه دهیم که قابل ویرایش، بررسی و بهبود باشد.
پس از وارد کردن، می توانید به کار معمولی Figma ادامه دهید:
- متن را مستقیماً ویرایش کنید.
- جابجایی و تغییر اندازه لایه ها
- رنگ ها، فونت ها، فاصله و سلسله مراتب را تنظیم کنید.
- قاب ها و بخش ها را سازماندهی کنید.
- در جایی که لازم است، طرح خودکار را اعمال کنید.
- عناصر ناهموار را با اجزای واقعی جایگزین کنید.
- نتیجه را با سیستم طراحی خود هماهنگ کنید.
این نکته Buddy است: سرعت بدون از دست دادن کنترل.
گردش کار بهتر برای طراحی ایجاد شده توسط هوش مصنوعی
گردش کار قدیمی به این صورت بود:
- ایده ای را در ابزار هوش مصنوعی ایجاد کنید.
- اسکرین شات بگیرید
- اسکرین شات ها را در Figma قرار دهید.
- به صورت دستی طرح را از ابتدا بازسازی کنید.
- کار طراحی واقعی را شروع کنید.
گردش کار Buddy کوتاه تر است:
- منبع را ایجاد یا پیدا کنید: مصنوع، HTML، تصویر، اسکرین شات یا URL.
- آن را در Buddy قرار دهید.
- لایه های Figma قابل ویرایش را دریافت کنید.
- به طراحی روی بوم ادامه دهید.
این مهم است زیرا تیمهای بیشتری از هوش مصنوعی و الهامبخش وب شروع میکنند، اما همچنان به یک گردش کار طراحی حرفهای نیاز دارند. Buddy آن دنیاها را به هم متصل می کند.
این برای کیست؟
وارد کردن هر چیزی به Buddy برای هر کسی که نیاز به حرکت سریع بدون از دست دادن گردش کار Figma دارد مفید است.
- طراحان می تواند خروجی ها و اسکرین شات های هوش مصنوعی را به نقاط شروع قابل ویرایش تبدیل کند.
- PM ها می تواند مصنوعات کلود یا ارجاعات وب سایت را به Figma برای بحث های واضح تر محصول بیاورد.
- بنیانگذاران می تواند بدون بازسازی دستی همه چیز را از ایده به فایل طراحی منتقل کند.
- بازاریابان می توانند الهامات صفحه فرود را شبیه سازی کنند و آن را با برند خود تطبیق دهند.
- مهندسان می تواند نمونه اولیه را در ابزارهای HTML یا AI انجام دهد، سپس نتیجه را به طراحی تحویل دهد.
این در مورد جایگزینی طراحی نیست. این در مورد حذف کار بازسازی خسته کننده بین یک ایده و یک بوم قابل ویرایش است.
ایده بعدی خود را به Buddy وارد کنید
صفحه نمایش محصول عالی بعدی ممکن است در Claude Design، یک مصنوع کلود، نمونه اولیه HTML تولید شده، یک اسکرین شات، یا یک وب سایت URL شروع شود.
با Buddy، آن نقطه شروع می تواند به یک طرح Figma قابل ویرایش در گردش کار فعلی شما تبدیل شود.
آن را در Buddy قرار دهید، لایهها را روی بوم قرار دهید و به طراحی ادامه دهید.

Figma
Adobe XD
Blog


