آموزش تغییر فرمت در نرم‌افزارهای رایج طراحی UI

01 اردیبهشت 1399
1-RDymZixphpVUTpyBfyT7Bw

تعداد نرم افزارهای طراحی رابط کاربری روز به روز در حال گسترش است و این موضوع یک مشکل با عنوان نحوه تبدیل فرمت ها و فایل های مرتبط با آن ها به یکدیگر به وجود می آورد. از همین رو این آموزش را به نحوه تغییر فرمت در طراحی UI و تبدیل فرمت های نرم افزارهای رایج طراحی رابط کاربری یعنی Adobe XD و Sketch و Figma به یکدیگر اختصاص دادیم.

چرا باید فرمت ها را تغییر دهیم؟

ممکن است این سوال برای شما پیش بیاید که اصلا چرا باید فرمت های فایل مرتبط با طراحی رابط کاربری را تغییر داد. در پاسخ به این سوال باید به دلایل زیر اشاره کنیم:

  • راحتی: همه کاربران از سیستم عامل مک بهره مند نیستند. بنابراین توانایی نصب و استفاده از نرم افزار اسکچ را ندارند. همچنین هر کاربر ممکن است بخواهد تنها با نرم افزار و پلتفرم اختصاصی خودش کار کند. بنابراین چنین مواقعی لازم می شود برخی از فرمت ها را تغییر داد.
  • هزینه: درست است که آدوبی ایکس دی و فیگما تا به امروز کاملا رایگان مانده اند اما اسکچ دارای دوره آزمایشی است و پس از آن باید هزینه پرداخت کنید. این مورد ممکن است برای برخی کاربران مشکل ساز شود و لازم باشد برای حل آن فرمت فایل را تغییر داد تا بتوان آنرا در نرم افزاری دیگر نیز اجرا کرد.
  • ارتباطات: فرآیند دریافت بازخورد یکی دیگر از دلایلی است که ممکن است باعث شود نیاز به تغییر فرمت فایل های طراحی شده باشد.
  • پروتوتایپ: برخی از نرم افزارهای طراحی رابط کاربری قابلیت های بیشتری در پروتوتایپ دارند که این موضوع گاهی مواقع تغییر فرمت ها را برای اجرا در نرم افزاری که پروتوتایپ بهتری ارائه می دهد، می طلبد.
  • خواسته های مشتری: گاهی اوقات مجبور هستید فرمت هایی مطابق میل خواسته مشتری خود داشته باشید.
  • انعطاف پذیری: با گذشت زمان ممکن است احساس کنید که با نرم افزار دیگری بهتر می توانید کار کنید. چنین مواقعی لازم می شود فایل های قبلی خود را با نرم افزار جدید سازگار کنید.
  • ابزار ها: گاهی اوقات نیاز به استفاده از یک ابزار خاص در طراحی پیدا می کنید که تنها در یک فرمت خاص پشتیبانی می شود. بنابراین دانش تغییر فرمت ها اینجا نیز به کار شما خواهد آمد.

برترین نرم افزارهای طراحی UI

بر اساس نظر سنجی Uxtools.co در سال 2019 محبوب ترین نرم افزار های طراحی رابط کاربری به ترتیب اسکچ، فیگما و آدوبی ایکس دی بوده اند.

اسکچ که نوآور دنیای طراحی رابط کاربری محسوب می شود، از همان ابتدا تا کنون جایگاه خود در صدر جدول را حفظ کرده است.

فیگما نرم افزاری است که هر کاربری می تواند از آن استفاده کند چرا که تنها با یک مروگر نیز قابلیت اجرا و استفاده دارد.

و در نهایت آدوبی ایکس دی هم با توجه به پیشرفت روز افزون در سرعت و عملکرد و همچنین قابلیت های جدید که ادوبی همواره در حال ارائه و ارتقا آن است توانسته رتبه سوم محبوب ترین نرم افزار طراحی رابط کاربری را به خود اختصاص دهد.

تبدیل از XD به Sketch

تبدیل از ایکس دی به اسکچ از دو راه زیر قابل انجام است:

  • تبدیل به کمک SVG: در این حالت می توانید تمام صفحات خود را با فرمت SVG خروجی بگیرید و به نرم افزار اسکچ وارد کنید. این راه را اصلا توصیه نمی کنیم چرا که فرآیندی شلوغ و سرشار از بی نظمی را تجربه خواهید کرد.
  • استفاده از مبدل (converter): ابزار آنلاین XD2Sketch.com می تواند این کار را برای شما انجام دهید. همچنین به کمک این ابزار می توانید فایل های فیگما را نیز به فایل های سازگار با اسکچ تبدیل کنید. (البته این قابلیت توسط سازندگان این ابزار در مرحله تست است و در زمان نگارش این مقاله امکان انجام ان وجود ندارد.)

تبدیل از Figma به Sketch

در حالی باز کردن پرونده های اسکچ در فیگما بسیار راحت است اما گویا فیگما نمی خواهد کاربرانش به سمت استفاده از اسکچ بروند. از این رو برعکس این کار، یعنی تبدیل از فیگما با اسکچ بسیار مشکل است. تنها راه انجام اینکار خروجی SVG است که در بالا به اشاره کردیم و گفتیم بی نظمی و حجم کاری زیادی را به همراه دارد و توصیه نمی شود. البته همانطور که گفته شد وب سایت XD2Sketch.com در حال تست ابزار تبدیل فیگما به اسکچ است که ممکن است بزودی اجرایی شود و در دسترس کاربران قرار بگیرد.

تبدیل از XD به Figma

به طور کلی مهاجرت از هر نرم افزاری به فیگما راحت ترین کار است! برای تبدیل فایل های آدوبی ایکس دی می توانید از هر یک از روش های زیر استفاده کنید:

  • به عنوان راحت ترین روش می توانید آرتبوردهای خود در ایکس در را به راحتی در فیگام کپی و پیست (Paste) کنید!
  • دومین روش همان روش غیرپیشنهادی همیشگی یعنی استفاده از خروجی SVG است.
  • سومین روش نیز استفاده از مبدل معرفی شده است. البته این مبدل تنها فایل ایکس دی را به اسکچ تبدیل می کند. اما چون فیگما می تواند مستقیما فایل های اسکچ را باز کند این روش نیز جوابگو است. هرچند با این روش بی دلیل کار خود را دو چندان خواهید کرد.

تبدیل از Sketch به Figma

در این حالت اصلا نیازی به تبدیل فایل نیست. فیگما مستقیما از فایل های اسکچ پشتیبانی می کند و کافیست همانند تصویر زیر از منو File > New from Sketch File فایل اسکچ خود را به فیگما وارد کنید و ویرایشات خود را شروع کنید.

تبدیل از Figma به XD

تنها راه برای انجام این کار همان روش اعصاب خورد کن SVG است! گویا فیگما در برابر مهاجرت کاربرانش به نرم افزار های دیگر قصد دارد تا آخرین نفس مقاومت کند!

تبدیل از Sketch به XD

اگر فایل شما توسط نسخه 43 به بعد از نرم افزار اسکچ ساخته شده باشد، بدون هیچ مشکلی می توانید آن را مستقیما در نرم افزار آدوبی ایکس دی باز کنید. اگر فایل شما توسط نسخه قدیمی تر ایجاد شده باشد با خطای زیر مواجه خواهید شد:

تغییر فرمت در طراحی UI

برای باز کردن فایل جدید در ایکس دی نیز می توانید از کلیدهای میانبر Ctrl+O بر روی سیستم عامل ویندوز و Cmd+O در سیستم عامل مک استفاده کنید.

تغییر فرمت در طراحی UI

پروتوتایپ: مسئله ای مهم

هنگام تبدیل فرمت و مهاجرت از یک نرم افزار به نرم افزاری دیگر ممکن است لینک ها و انیمیشن های موجود در بخش پروتوتایپ را از دست بدهید. نمودار زیر آمار انیمیشن ها و لینک هایی را نشان می دهد که در نرم افزارهای مختلف برای پروتوتایپ پشتیبانی می شود.

تغییر فرمت در طراحی UI

اگر دقت کنید InVision دارای افت هماهنگی می باشد که به دلیل پشتیبانی آن از ابزارهای متنوع تر پروتوتایپ است که در نرم افزار های دیگر پشتیبانی نمی شود. رقابت در این زمینه پروتوتایپ بین نرم افزارهای مختلف بالا گرفته و برنده این رقابت نرم افزاری است که کاملترین ویژگی ها را به کاربران خود ارائه دهد. به طور کلی خوب است بدانید که در Sketch ابزارها و انیمیشن های پروتوتایپ بهتر از رقبا کار می کند و به نظر می رسد این ابزار سخت در تلاش است که فاصله خود در این زمینه با رقبا را بیشتر کند.

در پایان امیدواریم آموزش ارائه شده برای شما مفید واقع شده باشد. همچنین مایل هستیم نظر شما را نیز درباره آینده نرم افزارهای طراحی رابط کاربری بدانیم. به نظر شما در بروزرسانی های بعدی چه ویژگی هایی به این نرم افزارها اضافه می شود؟ آیا سازگاری لینک ها و انیمیشن ها در پروتوتایپ ها بیشتر خواهد شد؟


منبع: سایت UX Design

نویسنده شوید
دیدگاه‌های شما (2 دیدگاه)

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.

zahra
27 تیر 1402
دوستان کسی میدونه چجوری داخل فیگما خروجی webp بگیرم؟ اصن امکانش هست؟؟

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.

امیرحسین فضلی
01 آبان 1399
سلام. سایت xd2sketch پولی هست. روش دیگه ای وجود نداره؟

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.

سعید طاهری
11 مهر 1400
فیگما رو تحت وب با مرورگر باز کنید و پلاگین زیر رو نصب کنید https://www.figma.com/community/plugin/849159306117999028/Convertify-Figma-to-Sketch%2FXD artboard رو در فیگما انتخاب کنید و از منوی فایل و پلاگین ها convertify رو انخاب کنید و به هر فرمتی که میخواید تبدیل کنید گزینه اش رو انتخاب کنید نسخه دسکتاپ این پلاگین رو نداره فک کنم اما با نسخه تحت وب میتونید

در این قسمت، به پرسش‌های تخصصی شما درباره‌ی محتوای مقاله پاسخ داده نمی‌شود. سوالات خود را اینجا بپرسید.