آموزش و معرفی پلاگین Adobe XD گوگل Sheets برای کار با داده های واقعی در طراحی UI

  • پیش گفتار این مقاله
  • ایمان کمالی در 1399/08/18

در این مقاله می پردازیم به پلاگین Google Sheets که با استفاده از آن می توانید داده های واقعی را از گوگل sheets وارد Adobe XD کنید.

Array
(
    [0] => adobe xd
    [1] => Ui UX
    [2] => پلاگین های Adobe XD
)

اگر با Google sheets آشنا نیستید پیشنهاد می کنیم ” مقاله Google sheets چیست و چه کاربرد هایی دارد؟ ” را مطالعه کنید.

این ابزار گوگل به شما کمک می کند تا اسناد خود را در فرمت های مختلف مانند فایل های word یا Exel و حتی PowerPoint به صورت آنلاین ایجاد و ویرایش کنید.

یکی از قابلیت های ویژه و عالی این ابزار امکان ویرایش همزمان و گروهی است که در آن یک گروه می توانند سندی را به همکاری یک دیگر مدیریت کنند.

پلاگین Google sheets در Adobe XD چه کاربردی دارد؟!

پلاگین Google sheets در Adobe XD
پلاگین Google Sheets

با یک مثال کابرد این پلاگین Adobe XD را بیان می کنیم!

تصور کنید می خواهیم برای صفحه Archive یا بلاگ سایت آخرین پست های ارسال شده را در قالب کارت نمایش دهیم.

قطعا پیش از این نمونه آن را دیده اید، اگر این گونه نیست می توانید صفحه آخرین پست های UI / UX در بیت بنگ را مشاهده کنید.

هر کارت شامل عنوان، توضیحات، تصویر ( که یک لینک است ) و احتمالا تاریخ و نویسنده می شود.

می توانیم این قسمت ها را به صورت دستی وارد کنیم و برای هر کارت عنوان، توضیحات و تصویر مجزا در نظر بگیریم، همچنین راه دیگر استفاده از ابزار ریپیت ( Repeat ) در Adobe XD است که یک عنصر را برای ما در محور عمودی یا افقی تکرار می کند.

اما با استفاده از این ابزار یعنی پلاگین Google sheets در ادوبی اکس دی می توانیم علاوه بر امکان Repeat برای هر کارت به صورت جداگانه اطلاعات و مشخصات مجزا قرار دهیم.

در پلاگین Google sheets اطلاعات هر فایل از کجا خوانده می شود؟

پس از نصب این پلاگین که در ادامه به آن می پردازیم، با مراجعه به این پلاگین، مشابه تصویر زیر می توانیم فایل حاوی اطلاعات متنی را بارگذاری کنیم :

Google sheets in Adobe XD
Goole sheets

همان طور که مشاهده می کنید هر فایل حاوی اطلاعات طرح را ( مانند مثال کارت ها ) می توانیم به شیوه های زیر وارد XD کنیم :

  • Google sheets
  • URL Link
  • Upload Csv File

استفاده از Google sheets برای بارگذاری فایل در Adobe XD

در این روش می بایست ابتدا وارد اکانت خود در گوگل شوید تا پلاگین به اسناد شما در google sheets دسترسی داشته باشد.

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

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

استفاده از URL Link برای بارگذاری فایل

در این روش کافی است URL فایل را به پلاگین بدهید، پس از وارد کردن لینک پلاگین فایل را دانلود کرده و در نرم افزار قرار می دهد.

در این روش نیز باید به اینترنت متصل باشید.

آپلود فایل از روی کامپیوتر شما

در این روش نیازی به اتصال به اینترنت نیست، تنها کافی است فایل CSV را که با استفاده از excel ایجاد شده انتخاب کرده و استفاده کنید.

در مثال زیر از همین روش استفاده کردیم.

آموزش استفاده از پلاگین Google sheets در Adobe XD

در ویدئو زیر یک مثال خیلی ساده را برای نحوه آشنایی با این پلاگین برای شما به صورت عملی آماده کرده ایم.

آموزش استفاده از Google sheets

برای نصب پلاگین می توانید به آموزش نصب پلاگین در Adobe xd مراجعه کنید.

نتیجه گیری و چکیده این مقاله

تا این جا با پلاگین Google sheets آشنا شدید.

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

اگر می خواهیم در طراحی های خود از داده های واقعی نیز استفاده کنید و طرح UI را با دوستان و همکاران خود به اشتراک بگذارید هم این پلاگین می تواند بسیار مفید باشد.

امیدوارم از این مقاله استفاده لازم را ببرید.

شاد و پیروز باشید.