اضافه کردن متن
زمانی که یک صفحه وب، یک بنر تبلیغاتی یا یک رابط کاربری طراحی میشود، کلمات بار اصلی انتقال پیام را به دوش میکشند. نحوه نمایش این کلمات، تفاوت بین یک طرح جذاب و یک صفحه خستهکننده را رقم میزند. یک کارشناس سئو یا استراتژیست محتوا بهخوبی میداند که اگر ظاهر متن، فاصله خطوط و رنگبندی کلمات خوانا و استاندارد نباشد، کاربر بهسرعت صفحه را ترک میکند و تمام زحمات تولید محتوا هدر میرود. در ابزارهای طراحی مدرن مانند فیگما، کار با متن صرفاً تایپ کردن چند کلمه ساده نیست؛ بلکه شما یک کنترل پنل قدرتمند برای مدیریت دقیق ساختار بصری محتوا در اختیار دارید.
روند کار بسیار روان و منطقی است. برای اضافه کردن محتوا، کافی است ابزار متن را انتخاب کرده، روی نقطه دلخواه از صفحه کلیک کنید و نوشتن را آغاز کنید. به محض اینکه اولین کلمات را تایپ میکنید، پنل تنظیمات در سمت راست صفحه فعال میشود و دنیایی از امکانات را برای فرم دادن به نوشتهها پیش روی شما قرار میدهد.
تنظیمات فونت؛ هویتبخشی به کلمات
اولین قدم برای ساختار دادن به یک نوشته، انتخاب نوع و وزن فونت است. شما میتوانید از میان فونتهای مختلف، گزینهای که با هویت پروژه همخوانی دارد (مثلاً فونت انجمن) را انتخاب کنید. اما کار به همینجا ختم نمیشود. یک فونت استاندارد معمولاً دارای وزنهای مختلفی است که هر کدام کاربرد خاص خود را دارند. شما میتوانید بسته به نیاز طرح، از وزنهای گوناگونی استفاده کنید:
- وزنهای لایت (Light) و معمولی (Regular): بهترین انتخاب برای متنهای طولانی و پاراگرافهای توضیحی که باید چشم کاربر را خسته نکنند.
- وزنهای بولد (Bold)، اکسترا بولد و هوی (Heavy): گزینههایی عالی برای تیترهای اصلی، دکمههای فراخوان (Call to Action) و بخشهایی که باید در نگاه اول توجه مخاطب را جلب کنند.
فیگما به شما اجازه میدهد تمام این جایگزینها (Alternatives) و حالتهای مختلف مانند ایتالیک را بهراحتی مشاهده و روی متن خود اعمال کنید. همچنین تعیین اندازه فونت، چه با وارد کردن عدد دلخواه و چه با استفاده از سایزهای پیشفرض، بهسادگی انجام میشود.
فواصل و ساختار؛ راز ناگفته خوانایی
زیباترین فونتها هم اگر فاصله استانداردی نداشته باشند، ناخوانا خواهند بود. یکی از مهمترین بخشهای تنظیمات متن، مدیریت فاصلههاست. ارتفاع خطوط (Line Height) دقیقاً همان چیزی است که به پاراگرافهای شما اجازه نفس کشیدن میدهد. اگر متن شما چند خطی است، تنظیم درست ارتفاع خطوط باعث میشود چشم کاربر بهراحتی از یک خط به خط بعدی سُر بخورد و درگیر فشردگی کلمات نشود.
مورد دیگری که در این بخش وجود دارد، تنظیم فاصله بین کاراکترها یا حروف است. البته این ویژگی در زبان انگلیسی کاربرد بسیار بیشتری دارد و به طراحان کمک میکند تا کلمات را منسجمتر نشان دهند؛ اما در زبان فارسی و نوع اتصال حروف ما، معمولاً تغییر فاصله کاراکترها پیشنهاد نمیشود و کمتر از آن استفاده میکنیم. در کنار اینها، میتوانید فاصله بین پاراگرافها را نیز بهدقت مشخص کنید تا ساختار محتوا منظمتر جلوه کند.
ترازبندی (Alignment)؛ نظم دادن به چیدمان
محل قرارگیری متن در کادر، تاثیر مستقیمی روی نظم بصری طرح دارد. در فیگما، ابزارهای ترازبندی به دو دسته کلی تقسیم میشوند. دسته اول برای تراز کردن افقی کاربرد دارند؛ جایی که میتوانید مشخص کنید متن راستچین، چپچین یا وسطچین باشد. دسته دوم تنظیمات بسیار کاربردیتری هستند که جایگاه متن را درون خود کادر متنی (Text Box) مشخص میکنند. شما میتوانید تعیین کنید که نوشته در بالاترین قسمت کادر، در مرکز یا در پایینترین نقطه آن قرار بگیرد. این ویژگی مخصوصاً زمان طراحی دکمهها و منوها به شما کمک میکند تا کلمات را دقیقاً در مرکز المانها نگه دارید.
استایل و جزئیات پیشرفته متن
گاهی اوقات نیاز داریم تغییرات خاصتری روی کلمات اعمال کنیم. با ورود به بخش تنظیمات بیشتر (معمولاً با کلیک روی آیکون سهنقطه)، یک منوی کامل از جزئیات در دسترس شما قرار میگیرد. در این بخش میتوانید یک پیشنمایش (Preview) زنده از تغییراتی که روی متن اعمال میکنید را ببینید. امکاناتی مانند اضافه کردن خط زیر متن (Underline) برای لینکها، کشیدن خط روی کلمات (Strikethrough) برای نشان دادن قیمتهای تخفیفخورده، یا مجبور کردن حروف انگلیسی به نمایش با حروف بزرگ (Capital)، همگی در این بخش قرار دارند.
همچنین اگر در حال ارائه اطلاعات دستهبندیشده هستید، میتوانید بهراحتی از لیستهای شمارشی (Numbered Lists) یا لیستهای نقطهای (Bulleted Lists) استفاده کنید. این لیستها به کاربر کمک میکنند تا اطلاعات پیچیده را سریعتر هضم کند و ساختار محتوا را بهشکل بهتری درک کند.
ظاهر، رنگ و ویژگیهای تسهیلکننده فیگما
پس از ساختاردهی به متن، نوبت به رنگ و لعاب میرسد. انتخاب رنگ مناسب و تنظیم میزان شفافیت (Opacity) به شما کمک میکند تا سلسلهمراتب بصری را رعایت کنید. مثلاً تیترها میتوانند مشکی پررنگ باشند، در حالی که متنهای فرعی با رنگ خاکستری و شفافیت کمتر نمایش داده میشوند تا تمرکز اصلی از روی تیتر برداشته نشود.
اما جذابترین و کاربردیترین بخش کار با فیگما، «حافظه هوشمند» آن است. این ویژگی که بهعنوان یک تسهیلکننده واقعی در روند کار شناخته میشود، سرعت طراحی را چند برابر میکند. در پروژههای واقعی، شما بارها و بارها از چند رنگ خاص یا چند فونت مشخص استفاده میکنید. فیگما هر رنگی را که یک بار در پروژه استفاده کنید، در بخشی به نام Document Colors (رنگهای این فایل) ذخیره میکند. بنابراین اگر در ابتدای کار یک رنگ قرمز خاص را برای یک دکمه انتخاب کردهاید و حالا میخواهید تیتر یک اخطار را هم دقیقاً همان رنگی کنید، اصلاً نیازی نیست به دنبال کد رنگ بگردید. کافی است پنل رنگ را باز کنید و از بخش رنگهای ذخیرهشده، همان قرمز آشنا را با یک کلیک انتخاب کنید.
این حافظه هوشمند دقیقاً برای فونتها هم کار میکند (Document Fonts). بهجای اینکه هر بار در لیست طولانی فونتها اسکرول کنید تا فونت مورد نظرتان را پیدا کنید، فیگما فونتهایی که در همان فایل استفاده کردهاید را در بالای لیست و در دسترس شما قرار میدهد. این یعنی تمرکز بیشتر روی خلق ارزش و صرف زمان کمتر برای کارهای تکراری.
تسلط بر تنظیمات متن، پایهایترین و در عین حال حیاتیترین مهارتی است که مسیر شما را برای اجرای طرحهای استاندارد و حرفهای هموار میکند. زمانی که بدانید هر ابزار دقیقاً چه کاری انجام میدهد، تبدیل کردن ایدههای خام به ساختارهای بصری منظم، بسیار سریعتر و لذتبخشتر خواهد بود.