نرم افزار فیگما ✒️ یکی از ابزارهای پرکاربرد برای طراحی رابط کاربری و نمونه سازیهای اولیه است.
با این حال برخی اوقات کاربران با مشکلاتی مثل گم شدن فونتها (Missing Fonts) و یا عدم نمایش درست آنها مواجه میشوند. این مسئله ممکن است به دلایل مختلفی مثل نصب نبودن فونت در سیستم و یا هماهنگ نبودن افزونه فیگما باشد. به همین دلیل در این مطلب از انزل وب به آموزش جامع حل مشکل فونت در فیگما باری فونتهای فارسی و انگلیسی خواهیم پرداخت.
آموزش رفع مشکل فونت در فیگما (تایپ و لود)
Guide to Resolving Font Problems in Figma
به طور کلی برای حل مشکلات فونت فارسی در فیگما، لازم است به مواردی مثل نصب و فعالسازی Figma Font Installer برای نسخه وب فیگما، توجه به نصب صحیح فونتها، آپلود کردن فونت مورد نظر در Figma Organization توجه داشته باشید. همچنین لازم است از فونتهای استانداردی استفاده کنید که شامل اعداد و تمامی حروف فارسی بشوند و برای طراحی وب سایت مناسب باشند. در غیر این صورت میتوانید نوشتهها را فونتهای دیگری جایگزین کنید. در ادامه به صورت کاملتر به مشکلات رایج فونت و نوشتار در این برنامه و روش حل آنها اشاره خواهیم کرد.
از نصب فونت مطمئن شوید
در اولین مرحله لازم است بررسی کنید که آیا فونت موردنظرتان را به درستی بر روی سیستم نصب کردهاید یا خیر. در ادامه توضیحات کاملتر اینکار در سیستم عاملهای مختلف را خواهیم داد.
نصب فونت در ویندوز
برای نصب فونت فارسی در ویندوز، لازم است وارد بخش Settings> personalize> fonts شوید و فونت مدنظرتان را به این صفحه انتقال دهید و نصب کنید. پس از انجام صحیح مراحل نصب، میتوانید وارد برنامه موردنظرتان مثل فیگما شوید و نام آن را جستجو کنید. علاوه بر آن برای دسترسی به فونتها میتوانید از طریق جستجوی عبارت Fonts در پنجره Run نیز اقدام کنید. به گفته سایت فیگما، نصب صحیح فونت میتواند برای دسترسی به آن بسیار موثر باشد.
نصب درست فونتها میتواند برای سایر برنامهها مثل حل مشکل فونت نستعلیق در فتوشاپ نیز موثر باشد.
نصب فونت در سیستم عامل مکینتاش
برای نصب فونت در سیستم عامل macOS،ابتدا باید دانلود فونت فارسی را با فرمت ttf و otf انجام دهید. سپس روی فایل دو بار کیلک نمایید تا پنجره Font Book برایتان باز شود. در اینجا لازم است Install Font را انتخاب کنید تا فونت به صورت اتوماتیک در قسمت All Fonts ذخیره شود. برای آنکه همه کاربران بتوانند از فونت نصب شده استفاده کنند، میتوانید آن را به مسیر /Library/Fonts منتقل کنید. پس از تکمیل مراحل میتوانید به سادگی از آن در برنامههایی مثل Figma، Photoshop، Word و… استفاده کنید.
روش دسترسی به فونتها در فیگما
در ابتدا لازم است دانلود فیگما را از صفحه دانلود سایت فیگما بر اساس نسخه سیستم عامل مک یا ویندوز برای دسکتاپ انجام دهید و سپس آن را اجرا نمایید. شما میتوانید اینکار را از طریق وبسایتهای ایرانی نیز انجام دهید. برای دسترسی و استفاده از فونتها شما میتوانید از دو روش استفاده کنید. در روش اول استفاده از فونتهای local یا محلی که در سیستم شما وجود دارد. برای اینکار میتوانید از برنامه Font installers فیگما در نسخه وب استفاده کنید. در نرم افزار دسکتاپ فونتهای موجود در سیستم به صورت خودکار شناسایی و در لیست فونتها نمایش داده میشوند.
روش دوم استفاده از فونتها نیز از طریق مجموعه Google Web Fonts است.
حل مشکل عدم نمایش فونت فارسی
گاهی ممکن است در زمان استفاده از فونتهای فارسی در فیگما مشکلاتی مثل عدم نمایش برخی از حروف ایجاد شود. این مسئله میتواند به دلیل عدم پشتیبانی فیگما از آن فونت باشد. به همین دلیل برای رفع این مشکل، بهتر است از فونتهای معتبر مثل وزیر، ایران سنس و… استفاده کنید. همچنین اگر قصد استفاده یا خیر فونتی را دارید، از سازگاری آن با طراحی وبسایت و نرم افزار فیگما مطمئن شوید. این مسئله میتواند در زمینه نمایش اعداد فارسی در فیگما نیز وجود داشته باشد.
شما میتوانید فونت موردنظرتان را در برنامه ورد نیز تست کنید. در صورتی که مشکلی در عملکرد فونت وجود داشت، بهتر است آن را یکبار به صورت کامل از روی سیستم حذف و مجددا نصب کنید. در صورت نیاز میتوانید برای حل مشکل نصب نشدن فونت در ویندوز، اقدامات لازم را انجام دهید.
استفاده از پلاگین فارسی نویسی در فیگما
در حال حاضر پلاگینهایی همچون RTS PLZ برای فیگما طراحی شدهاند که مناسب نوشتار متن فارسی در این برنامه هستند. این افزونه میتواند مشکلاتی مثل جابهجایی و بهم خوردگی متن را برطرف کند. برای استفاده از این پلاگین در برنامه پس از نصب و راه اندازی آن، روی دکمه Text بزنید و کلمه یا عبارت دلخواهتان را بنویسید. حالا از نوار ابزار قرار گرفته در سمت راست صفحه، فونت مد نظرتان را انتخاب کنید. در اینجا روی متن کلیک راست کنید و از لیست پلاگینها RTS PLZ را انتخاب کنید. این پلاگین میتواند با راست چین کردن متن و نوشتهها، به نمایش بهتر آنها کمک کند.
جایگزین کردن فونتهای گمشده (Missing Fonts)
بر اساس مطلب سایت پشتیبانی فیگما، اگر با وارد کردن و استفاده از یک فونت مشخص به طور مداوم ارور Missing Fonts را دریافت میکنید، در صورت امکان آن را با فونت دیگری جایگزین کنید. برای اینکار میتوانید در پنجره هشدار نمایش داده شده، یک فونت و وزن جایگزین دیگر را با استفاده از دکمه Replace fonts انتخاب کنید. در صورتی که پنجره هشدار را به صورت اتفاقی بستید یا رد کردید، میتوانید آیکون زرد رنگ A در بالای نوار ابزار فیگما را بزنید تا بتوانید مجددا پنجره جایگزینی فونت را مشاهده کنید. این گزینه برای زمانی که قصد جایگزینی فونت پیشفرض به فونت مورد نظرتان را دارید، می تواند کاربردی باشد.
آموزش رفع ارور missing fonts فیگما در زمان استفاده از نسخه وب
برخی از کاربران ممکن است در زمان استفاده از نسخه وب فیگما (Figma Web) با مشکل عدم شناسایی فونتهای نصب شده بر روی سیستم و در نتیجه خطای Missing Fonts مواجه شوند. یکی از اصلیترین عوامل ایجاد این مشکل، میتواند عدم نصب نرمافزار کمکی فونت فیگما (Figma Font Installer) بر روی سیستم باشد.
در واقع فیگما تحت وب به صورت پیشفرض به فونتهای نصب شده بر روی دستگاه شما دسترسی ندارد. به همین دلیل لازم است ابتدا Font installers را نصب کنید تا فونتها شناسایی شود. البته حتی اگر از نسخه وب استفاده نمیکنید، و ورژن دسکتاپ را بر روی سیسمتان نصب کردهاید نیز، پیشنهاد میشود Figma Font installers را نصب کنید. بسیاری از طراحان با همین روش میتوانند باعث حل مشکل فونت در فیگما شوند.
حل مشکل به هم خوردن تصادفی متنها در فیگما
برخی اوقات ممکن است به دلیل کار کردن چندین فرد از سیستمهای مختلف بر روی یک پروژه باعث اختلال در فونتها و به هم ریختگی آنها شود. این مشکل در حالی ایجاد میشود که روی سیستمها مونت مدنظر یا وزن و حالت آن وجود نداشته باشد. بهترین روش برای جلوگیری از این موضوع، نصب درست و دقیق فونت دلخواه بر روی همه سیستمها و دادن اولویت بیشتر به آن است.
برای اینکار فرد مسئول پروژه، میتواند از نوار سمت چپ فایل و بخش Admin settings، روی تب Resources بزند. سپس لازم است از بخش Fonts، گزینه Font را انتخاب و فایل فونتهای موردنظرتان را در سیستم انتخاب کنید و روی Open بزنید. با اینکار فونت انتخاب شده برای طراحی، در اولویت بالاتری نسبت به سایر فونتهای موجود در کامپیوتر قرار میگیرد و دسترسی به آن سادهتر خواهد بود.
در برنامه فیگما فونتها به ترتیب قرار میگیرند. در ابتدا فونتهای آپلود شده در سازمان یا Figma Organization Fonts نمایش داده میشوند. سپس شما میتوانید فونتهای نصب شده بر روی کامپیوتر (Local Fonts) را مشاهده کنید. در آخر نیز فونتهای وب گوگل (Google Web Fonts) قرار میگیرند. به همین دلیل در صورتی که قصد دارید به صورت تیمی بر روی طراحی کار کنید، آپلود فونت در سازمان میتوانید بهترین روش برای جلوگیری از به هم ریختگی باشد.
رفع به هم خوردن وزن فونتهای گوگل (Google Web Fonts) در فیگما
برخی اوقات ممکن است کاربرانی که از فونتهای گوگل یا Google Web Fonts استفاده میکنند، با مسئله به هم خوردن وزن حروف مواجه شوند. فونتها میتوانند دارای وزنهای مختلفی مثل Bold، Light یا Medium باشند که به هم خوردن این تنظیمات میتواند باعث نمایش نادرست متن در طراحی شود. دلیل این مسئله میتواند آن باشد که نسخهای از آن فونت در بخش سازمان فیگما آپلود شده باشد. همچنین در صورتی که فونت مدنظر را بر روی کامپیوتر به صورت کامل و نصب نکرده باشید و یا داده وزنهای آن وجود نداشته باشد، فونت دچار ایراداتی خواهد شد.
به همین خاطر لازم است توجه داشته باشید که همیشه اولویت فیگما باری نمایش و استفاده، فونتهای آپلود و یا نصب شده بر روی سیستم هستند. به همین خاطر ممکن است فونتهای استفاده شده از طریق Google Font نادیده گرفته میشوند و یا با مشکلاتی در زمان استفاده مواجه میشوند. برای رفع این مشکل خودتان و سایر همکاران میتوانید فونت مدنظر را از سازمان فیگما در بخش Admin settings و همچنین سیستم به طور کامل حذف کنید. با اینکار فیگما تنها از نسخه کامل و بروز Google Font به همراه تمامی وزنهای صحیح استفاده خواهد کرد.
حل مشکل عدم نمایش فونتهای ادوبی (Adobe fonts) در فیگما
اگر قصد استفاده از فونتهای Adobe را دارید ولی نمیتوانید آنها را در فیگما یا لیست فونتها مشاهده کنید، لازم است مراحل فعال سازی آنها را انجام دهید. برای این منظور ابتدا لازم است از نصب بودن برنامه Adobe Creative Cloud روی سیستم مطمئن شوید و آن را اجرا کنید. سپس با حساب کاربری ادوبی وارد سایت Adobe Fonts شوید و فونت موردنظرتان را پیدا کنید. حالا روی دکمه Activate Fonts، Install family یا Add to Creative Cloud کلیک کنید تا فونت در Adobe Creative Cloud نمایش داده شود. در صورتی که فونت به درستی آپلود شده باشد، در کنار آن میتوانید متن Available in Adobe and other apps را ببینید. این مسئله نشان میدهد که فونت در برنامههایی همچون فیگما نیز قابل مشاهده و استفاده است.
حل مشکل فونت در فیگما پس از وارد کردن فایل از Sketch
در صورتی که یک فایل را از Sketch به فیگما وارد کردهاید، و با ارور Missing Fonts مواجه شدید، باید نام گذاری فونتها توسط Sketch را بررسی کنید. اگر از قبل فونتها نصب کرده باشید، ممکن است خود برنامه Sketch نام فونت را به صورت OpenSans ثبت کرده باشد. این در صورتی است که فیگما تنها قادر به شناسایی نسخهی صحیح Open Sans است. به همین خاطر باید به نوشتار صحیح نام فونتها هم توجه کافی را داشته باشید. برای حل این مشکل نیز میتوانید با استفاده از قابلیت Replace Fonts، فونت صحیح نصب شده را شناسایی و استفاده کنید.
جمع بندی
به طور کلی برای حل مشکل فونت در فیگما، در ابتدا لازم است از نصب درست فونت موردنظرتان در سیستم مطمئن شوید. اگر از نسخه وب فیگما استفاده میکنید، لازم است ابتدا Font Installer را نصب کنید تا فیگما بتواند به فونتهای دستگاه شما دسترسی پیدا کند. برای جاستیفای در فیگما و بهبود نوشتن متنهای فارسی در برنامه نیز توصیه میشود از پلاگین RTS PLZ استفاده کنید.
در صورت امکان اگر خطای Missing Fonts را برای برخی از فونتها دریافت میکنید، بهتر است آنها را با استفاده از گزینه Replace fonts با فونتهای سازگارتر برای طراحی وب و استاندارد جایگزین کنید. همچنین اگر به صورت گروهی بر روی پروژه طراحی کار میکنید، بهتر است فونت پروژه را از طریق Admin settings در اولویت بالاتری قرار دهید تا همه افراد از ان استفاده کنند.
سوالات متداول
برای انجام اینکار در نسخه وب، ابتدا لازم است Font installers را نصب کنید تا برنامه به فونتهای نصب شده بر روی کامپیوتر دسترسی پیدا کند. در نسخه دسکتاپ فیگما نیز به مسیر Admin Settings > Resources > Fonts بروید تا بتوانید با آپلود فونتها دسترسی به آنها را سادهتر کنید. فیگما بصورت پیشفرض اعداد را به صورت لاتین مینویسد، حتی در زمانی که کاربران از زبان فارسی استفاده کنند. به همین دلیل برای نمایش اعداد فارسی، باید از فونتی مثل Vazir استفاده کنید که از اعداد فارسی پشتیبانی میکند. همچنین زبان متن را روی RTL (راست به چپ) تنظیم کنید. چطور به فیگما فونت اضافه کنیم؟
چرا اعداد در فیگما فارسی نمیشوند؟
نظرات و پیشنهادات شما؟
برنامه فیگما یکی از ابزارهای ساده و کاربردی برای طراحی رابط کاربری و وبسایتها است. آیا شما هم تا به حال در زمان استفاده از این برنامه با مشکلات فونت فارسی مواجه شدهاید؟ بر اساس تجربه شما موثرترین راهکار برای رفع این مشک چیست؟ اگر در این زمینه نظری دارید، لطفاً آن را با ما و سایر خوانندگان این مطلب به اشتراک بگذارید.