1 . Dev Mode :
فیگما یک فضای کاری جدید به نام Dev Mode را معرفی کرد که به طور خاص برای توسعه دهندگان طراحی شده است. این شامل چندین ویژگی است که به پر کردن شکاف بین طراحی و توسعه کمک می کند.
این یک فضای کاری در Figma است که برای پاسخگویی به نیازهای توسعه‌دهندگان طراحی شده است و هدف آن این است که آنها در داخل پلتفرم احساس کنند که در خانه هستند. Figma به طور سنتی به عنوان یک ابزار طراحی دیده می شود و با معرفی Dev Mode، Figma به دنبال پر کردن شکاف بین طراحی و توسعه است.
2 . Connect to your tools & codebase
با Dev Mode، توسعه‌دهندگان می‌توانند به‌طور یکپارچه با ابزارها و پایگاه‌های کد موجود خود، از جمله ابزارهای محبوب مانند Jira، GitHub و Storybook یکپارچه شوند. این امکان گردش کار ساده‌تری را برای تیم‌های محصول و توسعه‌دهندگان فراهم می‌کند.
3. Track what needs to go to production
یک ویژگی مفید است که به توسعه دهندگان کمک می کند تا عناصر طراحی و تغییراتی را که باید در محصول نهایی پیاده سازی شوند، پیگیری کنند.
این به ساده‌سازی فرآیند اجرای تغییرات و به‌روزرسانی‌ها در یک محصول زنده با ارائه یک نمای کلی روشن و سازماندهی شده از عناصری که آماده انتقال به مرحله تولید هستند، کمک می‌کند.
4. Inspect files alongside code with Figma in VS Code
با استفاده از این ویژگی، توسعه‌دهندگان می‌توانند فایل‌های طراحی را در همان جایی که با استفاده از کد ویژوال استودیو کد می‌نویسند، بررسی کنند. این امر طراحی و توسعه را حتی به هم نزدیکتر می کند و نیاز به جابجایی بین ابزارهای مختلف را کاهش می دهد.
پسوند Figma for VS Code به شما امکان می‌دهد فایل‌های طراحی را پیمایش و بازرسی کنید، با طراحان همکاری کنید، تغییرات را دنبال کنید و اجرای طراحی را تسریع کنید - همه اینها بدون ترک محیط توسعه‌تان. از پسوند Figma for VS Code برای موارد زیر استفاده کنید:
5. Variables
این به‌روزرسانی بزرگ Config بود. معرفی متغیرها به فرآیندهای طراحی ساده تر و کارآمدتر اجازه می دهد. متغیرها می‌توانند رنگ، عدد، متن و مقادیر بولی را ذخیره کنند که می‌توانند در طول طراحی مجدداً استفاده شوند.
6. Aliasing support in variables
این ویژگی امکان استفاده بیشتر مبتنی بر زمینه از متغیرها را فراهم می کند و درک و استفاده از آنها را برای کل تیم آسان تر می کند.
نام مستعار به شما این امکان را می دهد که نام دیگری (نام مستعار) برای یک متغیر ایجاد کنید، که می تواند زمانی مفید باشد که یک مقدار ممکن است به روش های مختلف در یک پروژه ارجاع داده شود.
به عنوان مثال، ممکن است یک رنگ برند اصلی داشته باشید که در برخی مکان ها به عنوان رنگ پس زمینه و در برخی دیگر به عنوان رنگ حاشیه استفاده می شود. به جای ایجاد متغیرهای جداگانه برای هر یک از اینها، می توانید یک متغیر برای مقدار رنگ ایجاد کنید و سپس نام مستعارهایی مانند "Background Color" یا "Border Color" ایجاد کنید که به متغیر اصلی اشاره می کند. به این ترتیب، اگر رنگ برند تغییر کند، فقط باید متغیر اصلی را به‌روزرسانی کنید و همه نام‌های مستعار تغییر را منعکس می‌کنند.
7. Scoping support in variables
محدوده به زمینه ای اشاره دارد که یک متغیر در آن در دسترس است. در زمینه سیستم های طراحی، یک محدوده ممکن است یک پروژه خاص، یک صفحه خاص در یک پروژه یا حتی یک جزء واحد باشد. محدوده به مدیریت پیچیدگی سیستم های طراحی کمک می کند و مشخص می کند که یک متغیر در کجا کاربرد دارد.
به عنوان مثال، ممکن است متغیری داشته باشید که اندازه بالشتک را تعریف می کند که معمولاً در کل طراحی شما استفاده می شود. این می تواند یک متغیر دامنه جهانی باشد. اما در یک جزء خاص، ممکن است شما یک اندازه بالشتک متفاوت بخواهید. شما می توانید یک متغیر جدید با همان نام تعریف کنید که فقط به آن جزء محدود شده است. هنگامی که به متغیر padding در آن کامپوننت ارجاع می دهید، از مقدار محدوده مولفه استفاده می کند. اگر به متغیر padding در جای دیگری ارجاع دهید، از مقدار جهانی استفاده می کند.
8. Variable modes with different values
هنگام استفاده از حالت های متغیر در Figma، می توانید مجموعه ای از متغیرها را برای هر موضوع تعریف کنید.
به عنوان مثال، ممکن است برای تم روشن خود متغیرهای رنگی مانند پس زمینه روشن و متن روشن و متغیرهای متناظر برای تم تیره خود مانند پس زمینه تیره و متن تیره داشته باشید.
این متغیرها فقط به رنگ ها محدود نمی شوند، بلکه می توانند سایر عناصر طراحی مانند تایپوگرافی، فاصله گذاری یا مقادیر بولی را نیز در بر گیرند که نمایش عناصر خاص را کنترل می کنند.
هنگامی که این متغیرهای مرتبط با موضوع تعریف شدند، می توانید به راحتی با تغییر حالت متغیر، بین تم ها در طراحی خود جابجا شوید. برای مثال، اگر می‌خواهید ببینید طراحی شما در حالت تاریک چگونه به نظر می‌رسد، به سادگی حالت متغیر را به «تاریک» تغییر دهید، و تمام عناصر طراحی که به متغیرهای موضوع اشاره می‌کنند، به‌روزرسانی می‌شوند تا مقادیر تم تیره را منعکس کنند.
9. Plugin and REST API support
این کارکرد متغیرها را گسترش می دهد و به شما در ایجاد مقیاس و مدیریت کمک می کند.
پشتیبانی پلاگین به توسعه دهندگان اجازه می دهد تا پلاگین های Figma را ایجاد کنند که با متغیرها تعامل دارند. به عنوان مثال، یک افزونه می‌تواند برای خودکارسازی فرآیند اعمال متغیرهای خاص بر روی مجموعه‌ای از اشیاء یا ایجاد گزارشی درباره نحوه استفاده از متغیرها در یک فایل طراحی طراحی شود. این می تواند به طور قابل توجهی سرعت کارهای تکراری را افزایش دهد، ثبات را اعمال کند و بینش های ارزشمندی را در مورد سیستم طراحی شما ارائه دهد.
پشتیبانی REST API ادغام داده های طراحی Figma را با سایر سیستم ها از طریق رابط برنامه نویسی برنامه (API) آن امکان پذیر می کند. این بدان معناست که متغیرهای موجود در Figma را می توان به صورت برنامه نویسی از خارج از Figma مورد دسترسی قرار داد و دستکاری کرد و به همین ترتیب، از داده های خارجی می توان برای به روز رسانی متغیرها در Figma استفاده کرد.
10. Advanced prototyping
با استفاده از متغیرها، شرایط و عبارات، طرح‌های خود را با پویایی و تعامل بیشتر زنده کنید، که به شما امکان می‌دهد نمونه‌های اولیه ایجاد کنید که به ورودی کاربر به روشی بسیار واقعی‌تر و پاسخگوتر واکنش نشان دهند.
متغیرها در نمونه سازی می توانند مقادیری مانند اعداد، متن، رنگ ها یا بولی (درست/نادرست) را داشته باشند. این مقادیر را می توان برای ایجاد تعاملات پویاتر در نمونه اولیه استفاده کرد و دستکاری کرد. به عنوان مثال، یک متغیر ممکن است تعداد دفعات کلیک روی یک دکمه را در خود نگه دارد یا وضعیت فعلی یک سوئیچ را ذخیره کند.
شرایط به شما اجازه می دهد تا در نمونه های اولیه خود منطق ایجاد کنید. شما می توانید اقدامات یا نتایج مختلفی را بر اساس مقدار فعلی یک متغیر مشخص کنید. به عنوان مثال، می‌توانید قانونی داشته باشید که می‌گوید «اگر دکمه بیش از 5 بار کلیک شده است، به صفحه دیگری بروید».
عبارات شما را قادر می سازد تا محاسبات یا تبدیل ها را روی متغیرهای خود انجام دهید. برای مثال، می‌توانید با هر بار کلیک کردن روی یک دکمه، یک متغیر شمارنده را افزایش دهید یا رنگ جدیدی را بر اساس ورودی کاربر محاسبه کنید.
11. In-context editing and inline preview
این به‌روزرسانی‌های قابلیت استفاده به ما اجازه می‌دهند تا نمونه‌های اولیه خود را در یک نمای مشابه ویرایش و پیش‌نمایش کنیم و روند طراحی را تسریع کنیم.
به طور سنتی، طراحان برای ایجاد تغییرات در یک طرح باید بین نماها یا حالت‌های مختلف جابجا شوند و سپس پیش‌نمایش چگونگی ظاهر این تغییرات در نمونه اولیه را مشاهده کنند. این می‌تواند فرآیندی زمان‌بر باشد، به‌ویژه زمانی که بر روی یک طرح بر اساس بازخورد یا آزمایش تکرار می‌شود.
با این به‌روزرسانی، طراحان اکنون می‌توانند تغییراتی در طرح‌های خود ایجاد کنند و بلافاصله ببینند که این تغییرات چگونه بر نمونه اولیه تأثیر می‌گذارد بدون اینکه نیازی به تغییر نماها باشد. این ویژگی ویرایش درون متنی و پیش نمایش درون خطی می تواند با امکان تکرار سریع و بازخورد فوری در مورد تغییرات طراحی، روند طراحی را به میزان قابل توجهی سرعت بخشد.
12. Improved auto layout
ویژگی طرح‌بندی خودکار اکنون به عناصر اجازه می‌دهد تا به اندازه کانتینر پاسخ دهند که هرگز قبلاً نبوده است.
ویژگی (ٌWrap) اساساً عناصر طراحی شما را قادر می سازد مانند متن جریان پیدا کنند. اگر گروهی از عناصر را به صورت افقی مرتب کنید، و گروه برای قاب والد خود بیش از حد عریض شود، عناصر به طور خودکار به خط بعدی می‌پیچند. این به ویژه هنگام طراحی اجزایی که نیاز به تطبیق با مقادیر مختلف محتوا یا اندازه صفحه دارند، مانند برچسب‌ها در لیست برچسب یا موارد در یک شبکه، مفید است.
حداقل یا حداکثر ارتفاع/عرض به حفظ ثبات و یکپارچگی طراحی کمک می کند. با تعریف این محدودیت‌ها، می‌توانید اطمینان حاصل کنید که یک عنصر بدون توجه به محتوایی که در خود دارد یا اندازه صفحه‌ای که در آن مشاهده می‌شود، هرگز خیلی کوچک نمی‌شود (که ممکن است آن را غیرقابل خواندن یا غیرقابل کلیک کند) یا خیلی بزرگ (که ممکن است طرح‌بندی شما را از بین ببرد یا با عناصر دیگر همپوشانی داشته باشد).
13.Upgraded font picker
انتخابگر فونت جدید و بهبود یافته به طراحان امکان می دهد فونت مناسب را سریعتر و راحت تر از همیشه پیدا کنند.
جستجو در انتخابگر فونت به روز شده به طراحان این امکان را می دهد که فونت مورد نظر خود را به سرعت با تایپ نام آن پیدا کنند. این به ویژه هنگام کار با یک کتابخانه فونت بزرگ مفید است، زیرا نیاز به پیمایش دستی در لیست برای یافتن فونت مورد نظر را از بین می برد. این می تواند روند طراحی را تا حد زیادی سرعت بخشد و آزمایش با فونت های مختلف را آسان تر کند.
فیلتر کردن راهی برای محدود کردن لیست فونت ها بر اساس معیارهای خاص، مانند serif، sans-serif، monospace و موارد دیگر فراهم می کند. زمانی که مطمئن نیستید از کدام فونت استفاده کنید و می خواهید چند گزینه را در یک دسته بندی خاص مقایسه کنید، می تواند بسیار مفید باشد. این باعث می‌شود فرآیند انتخاب فونت مناسب کمتر و متمرکزتر شود.
پیش نمایش نام فونت ها در فونت خود یک به روز رسانی کوچک اما مهم است. پیش از این، برای اینکه ببینید چه شکلی است، باید یک فونت را روی برخی از متن های طراحی خود اعمال کنید. اکنون، می‌توانید پیش‌نمایش هر فونت را مستقیماً در انتخابگر فونت مشاهده کنید، که می‌تواند در زمان و کلیک‌های شما بسیار صرفه‌جویی کند. همچنین به شما این امکان را می دهد که در یک نگاه ببینید که چگونه ویژگی ها و شخصیت هر فونت ممکن است در طراحی شما قرار بگیرد.
14. Updates to the file browser
یکی از پیشرفت های قابل توجه قابلیت جستجوی پیشرفته است. به روز رسانی جدید به کاربران اجازه می دهد تا به سرعت فایل ها یا پروژه هایی را که توسط تیم های خارجی با آنها به اشتراک گذاشته شده است با استفاده از کلمات کلیدی یا عبارات خاص پیدا کنند. این امر به ویژه هنگام برخورد با تعداد زیادی پروژه در Figma مفید است.
مرورگر فایل اکنون گزینه های مرتب سازی و فیلتر کردن را بهبود داده است. کاربران می توانند فایل ها را بر اساس پارامترهای مختلفی مانند تاریخ آخرین اصلاح، مالک فایل یا تیمی که فایل را به اشتراک گذاشته است، مرتب کنند. این امکان پیمایش آسان‌تر را فراهم می‌کند و به سازماندهی فضای کاری شما کمک می‌کند.
علاوه بر این، یک بخش جدید "فایل های مشترک" وجود دارد. این یک فضای اختصاصی است که در آن تمام فایل ها و پروژه های به اشتراک گذاشته شده با یک کاربر توسط تیم های خارجی در کنار هم قرار می گیرند. این می‌تواند مقدار قابل توجهی در زمان برای کاربرانی که اغلب با تیم‌های خارجی مختلف همکاری می‌کنند، صرفه‌جویی کند، زیرا دیگر نیازی به جستجوی فایل‌های خود برای یافتن فایل‌های به اشتراک گذاشته شده با آنها ندارند.
ممنونم از زمانی که برای خواندن این مطلب گذاشتید ?
