ترجمهای از مقاله “Eight tips for designers building branded templates in Figma Buzz”
– راهنمایی برای تمپلیتسازی در فیگما، به کوشش تیم محتوای مدرسه اینورس
برای ساختن قالبهای خودکار که انعطاف دارن اما از قواعد خارج نمیشن، طراحهای برند باید به کارشون از دیدگاه بازاریابی نگاه کنن. اینجا توضیح میدیم که چطور محدودیتهای ویرایشی و چیدمانهایی طراحی کنیم که منعطف و مقیاسپذیرن.
هدف طراحها و بازاریابهای برند، ساختن فایلهاییه که جذاب، دقیق و مطابق با برند باشن. اما هماهنگ نگهداشتن صدها فایل توی دهها نقطه تماس، به خصوص وقتی زمان کمه، میتونه سخت باشه. از یه فونت اشتباه گرفته تا یه لوگوی بدقواره، ممکنه یه جا اشتباه کنیم. به عنوان یه طراح برند، شما همیشه فرصت ندارین تکتک فایلها رو قبل از انتشار چک کنین. بازاریابها هم با درک این شرایط، با مهارت و قالبهایی که دارن کار رو پیش میبرن، اما باز هم مجبور میشن تصمیمهای یهویی بگیرن.
قالبهای Figma Buzz یه راه عالی برای اینه که هم شما توی جریان خلاقیتتون بمونید و هم نیازهای بازاریابها رو برطرف کنید. اما ساختن یه قالب عالی با ساختن یه طرح عالی فرق میکنه. برای اینکه یه قالب مؤثر باشه، طراحها باید تجربه کاربری ویرایش رو هم در نظر بگیرن. این شامل تنظیم کادرهای متن برای بزرگ شدن بر اساس محتوا و مشخص کردن نحوه تغییر ابعاد تصاویر و وکتورها برای جلوگیری از کجوکولهشدنه. در ادامه نکاتی که باید موقع ساختن فایلها توی Figma Buzz در نظر داشته باشید رو توضیح میدیم تا مطمئن بشید که قالبها با شرایط مختلف سازگارن و همکارانتون هم موفقتر عمل میکنن.
۱. از «فریم فیگما دیزاین» شروع کنید
شما به راحتی میتونید کارهای طراحیتون رو بین محصولات فیگما جابهجا کنید، پس از جایی که راحتترید شروع کنید و یه فریم توی Figma Design بسازید. اونجا میتونید کامپوننتها رو تنظیم کنید و از ابزارهای جذاب Figma Draw (مثل قلمموها، خطوط پویا و محوشدگی تدریجی) برای اضافه کردن بافت بیشتر به کارتون استفاده کنید. بعد، فریم رو کپی کنید و توی Figma Buzz پیست کنید تا قبل از منتشر کردنش به عنوان یه قالب، اون رو بهینهسازی کنید.
۲. با «Auto Layout / طرحبندی» انعطافپذیری بسازید
Auto layout ستون فقرات طراحی قالبهای واکنشگراست. اضافه کردن Auto layout باعث میشه المانهایی مثل دکمهها، کادرهای متن و نگهدارندههای تصویر، فاصله ثابتی داشته باشن و با تغییر محتوا، خودشون رو تنظیم کنن. مثلاً، اگه کسی یه عنوان طولانی توی یه فیلد متن وارد کنه، اینجوری المانهای دیگه توی قالب جابهجا نمیشن.
از Auto layout استفاده کنید تا همه چیز توی قالب مرتب بمونه.
همچنین بخوانید: همکاری Canva و Pinterest برای پیشبینی ترندهای طراحی
۳. لایههای متنیتون رو جدا کنید
ساختار طرحتون خیلی مهمه. مطمئن بشید که لایههای متنی رو برای هر ورودی مجزا جدا میکنید، به خصوص اگه از سبک یا اندازه فونتهای مختلف استفاده میکنید. این کار برای Bulk create حیاتیه؛ قابلیتی که بهتون اجازه میده با وارد کردن محتوا از یه فایل CSV یا XLSX، یه عالمه فایل رو همزمان بسازید. در این حالت، هر فیلد اطلاعاتی به یه لایه توی طرح مرتبط میشه. ترکیب کردن چند سبک یا فیلد ورودی توی یه لایه میتونه فرمبندی رو خراب کنه و بهروزرسانیها رو سختتر؛ پس همه چیز رو پیمانهای نگه دارید تا مطمئن بشید قالببندیتون توی فایلها و کمپینهای مختلف سالم میمونه.
۴. نسبت ابعاد تصاویر و وکتورها رو قفل کنید
برای قفل کردن نسبت ابعاد، تصویر یا وکتور رو انتخاب کنید، بعد روی آیکون مربع کنار فیلدهای عرض و ارتفاع چیدمان توی Figma Design یا حالت طراحی توی Figma Buzz کلیک کنید.
شاید شما چیدمان رو برای یه فرمت خاص، مثل یه پست ۱۰۸۰ در ۱۰۸۰ اینستاگرام، تنظیم کنید، اما بازاریابها ممکنه نیاز داشته باشن قالب رو برای استفادههای دیگه (مثل یه استوری عمودی یا یه بنر وب) تغییر بدن. یکی از راحتترین راهها برای ضدخطاکردن قالبهاتون اینه که نسبت ابعاد تصاویر و وکتورها رو قفل کنید تا المانهایی مثل لوگوها، عکسهای پرسنلی و ایلوستریشنها موقع تغییر اندازه کجوکوله نشن. وگرنه، ممکنه تصاویر کشیده یا فشرده بشن.
۵. به هر لایه یه اسم واضح بدید
به طور پیشفرض، اسم یه لایه متنی، همون متنیه که روی بوم هست. برای تغییر این اسم، از کلید میانبر Command + R استفاده کنید تا متن جایگزین بشه، یا مستقیماً روی لایه دوبار کلیک کنید.
اگه لایههای زیادی برای مرتب کردن دارین، میتونید از Figma AI برای تغییر سریع اسم لایهها استفاده کنید.
بعد از اینکه یه قالب رو توی Figma Buzz منتشر میکنید، همتیمیهاتون میتونن هر لایه متن یا تصویر قفلنشده رو با تغییر فیلدهای ورودی توی پنل Edit Content، شبیه پر کردن یه فرم، ویرایش کنن. برای اینکه مطمئن بشید این فرآیند تمپلیتسازی در فیگما تجربه کاربری آسون و روونی داره، به هر لایه یه برچسب واضح بدید. اگه همکار شما یه کادر با اسم «Text 45» یا «Rectangle 12» ببینه، نمیدونه چی رو داره بهروزرسانی میکنه و احتمالاً با محتوای اشتباه و نیاز به اصلاحات بیشتر مواجه میشید.
به جای این کار، لایههاتون رو با برچسبهایی مثل «عنوان رویداد»، «متن دکمهٔ فراخوان» یا «عکس سخنران» نامگذاری کنید. همچنین، اگه فرمت خاصی مدنظرتونه، میتونید یه متن نمونه هم قرار بدید؛ مثل «تاریخ رویداد (مثلاً ۱۰ جولای ۲۰۲۵)». این کار نه تنها به ثبات خروجیها کمک میکنه، بلکه به کاربرها هم میفهمونه که چه فرمتبندیای توی چیدمان طرح بهترین نتیجه رو میده.
با نامگذاری درست لایههاتون، حدس و گمان رو از فیلدهای محتوا حذف کنید.
همچنین بخوانید: چطور یکنفره، با سوپر دوره تولید محتوای ویدیویی با AI کار یه استودیو رو انجام بدیم؟
۶. برای چند گزینه، از «گونههای کامپوننت / Component set» استفاده کنید
برای ساختن یه component set، تمام فریمهایی رو که میخواین توی Figma Design قرار بدین انتخاب کنید. توی پنل طراحی سمت راست، روی سه نقطه کلیک کنید و «Create component set» رو انتخاب کنید. اگه از قبل به عنوان کامپوننتهای جداگانه تنظیم بودن، «Combine as variants» رو انتخاب کنید.
اینجا کلیک کنید تا اطلاعات بیشتری درباره ساخت و استفاده از variants به دست بیارید.
گونههای کامپوننت بهویژه زمانی به کار طراحها میاد که بخوان جزئیات کوچیکی مثل چیدمان لوگو، طرح پسزمینه یا آیکون رو بسته به کاربرد تغییر بدن. با استفاده از یه component set که از قبل توی Figma Design تعریف کردید، به همکاران بازاریابیتون اجازه میدین بدون اینکه دستشون برای ویرایشهای دستی زیاد باز باشه، طرح رو شخصیسازی کنن.
به یه لوگو با جهتهای افقی و عمودی، یا یه ایلاستریشن برند با سه سبک رنگی فکر کنید. به جای اینکه قالبهای جدا برای هر گزینه بسازید، میتونید این گزینهها رو توی یه component variant set ترکیب کنید و یکی از variants رو توی طرح به نمایش بذارید. بعد، هر کسی که از تمپلیتسازی در فیگما استفاده میکنه و فایل رو ویرایش میکنه میتونه اون کامپوننت رو انتخاب کنه و روی Swap Content توی نوار ابزار خطی کلیک کنه تا گزینه مناسب برای کارش رو انتخاب کنه.
۷. قالبتون رو از دیدگاه یه کاربر بررسی کنید
درسته که وقتی یه قالب توی Figma Design خوب به نظر میاد، خیلیها فکر میکنن کار تموم شده، اما هدف فقط طراحی یه چیز زیبا نیست؛ هدف، ساختن یه تجربه خودکار و بدون دردسره. تجربه تمپلیتسازی در فیگما تیمتون رو قدرتمند میکنه و راه رو برای کارهای خلاقانه ارزشمند باز میکنه. قبل از اینکه قالبتون رو همهجا به اشتراک بذارید، وقت بذارید و اون رو توی Figma Buzz تست کنید؛ دقیقاً همونطوری که همتیمیهاتون تجربهش خواهند کرد.
با باز کردن قالبتون توی یه فایل جدید Figma Buzz شروع کنید تا فایلها رو توی نمای ویرایش متمرکز تجربه کنید. آیا فیلدهای درست توی پنل Edit Content قابل مشاهدهان؟ یا همه لایههای درست قابل ویرایشان و اسمشون واضح و مشخصه؟ المانهای غیرمنتظرهای مثل لایههای تکراری یا فریمهای خالی وجود دارن؟ در ادامه، رفتار چیدمانتون رو وقتی محتوای واقعی اضافه میشه بررسی کنید. متنهای طولانی پیست کنید، تصاویر رو جابهجا کنید، و سعی کنید اندازه فایل رو تغییر بدین (به خصوص اگه قالبتون رو برای تغییر اندازه توی فرمتهای مختلف طراحی میکنید). این نوع کنترل کیفیت کاربری بهتون کمک میکنه مشکلات رو زودتر پیدا کنید؛ مشکلاتی مثل تداخل متن، محتوای نامرتب یا رفتار گیجکننده لایهها.
همتیمیهاتون میتونن قالبهای دیگه رو هم ببینن، پس سازماندهی کلی رو فراموش نکنید. آیا عنوان فایل واضح و قابل جستوجوئه؟ آیا قواعد نامگذاری برای استاندارد کردن ساختار فایل بین قالبها دارین؟ این فرصت رو غنیمت بشمارید و بررسی کنید که هر فایل قالب بهطور جداگانه چه نامگذاری و سازماندهیای داره. اگر از ردیفها استفاده میکنید، مطمئن بشید که ترتیب و گروهبندیها منطقیه و ردیفها اسمهای توصیفی دارن.
۸. قالبهاتون رو با «بافت» مناسب به اشتراک بذارید
وقتی تمپلیتسازی در فیگما تست و منتشر شد، وقتشه که اونها رو با تیمتون به اشتراک بذارید. لینک قالب رو کپی کنید تا با همکارهاتون به اشتراک بذارید. این لینک یه فایل جدید Figma Buzz رو باز میکنه و اونها رو مستقیماً به قالب مورد نیاز میرسونه، پس لازم نیست دنبال فایل بگردن. برای کمپینهایی که به فایلهایی با ابعاد چندگانه برای پلتفرمهای مختلف نیاز دارن، گزینهٔ= اضافه کردن کل مجموعهٔ قالب به بوم هم وجود داره.
این لحظه واگذاری، فرصتیه برای ارائه راهنماییهای مفید. چه نوع فایلهایی توی مجموعه قالب وجود داره؟ آیا فیلدهای قفلشده، کامپوننتهای قابل تعویض یا باید و نبایدهای فرمتبندی خاصی وجود داره که باید در نظر گرفت؟ صرف چند دقیقه وقت برای توضیح محتوا و هدف میتونه از کارهای تکراری غیرضروری جلوگیری کنه و جلوی اشتباهات «مغایر با برند» رو بگیره.
فرقی نمیکنه که برای یه کمپین اجتماعی، المانهای یه رویداد حضوری، یا تبلیغات دیجیتال برای پلتفرمهای مختلف فایل میسازید، قالبها کمک میکنن تا مطمئن بشید هر نقطه تماس دقیق و بینقص باشه. Figma Buzz توی نسخه بتای عمومیه و ما مشتاقیم ببینیم چی میسازید. شما میتونید طرحهاتون رو توی Figma Buzz کپی کنید و ساخت فایلهای تأثیرگذار و مطابق با برند رو در مقیاس بالا شروع کنید.
- نوشتهشده توسط مالوری دین
- Designer Advocate در فیگما