این مقاله را میتوانید در مدت زمان
6 دقیقه
مطالعه کنید


 

منتشر شده در تاریخ:
خرداد ۲۳ام, ۱۴۰۲

 
آخرین بروزرسانی:
تیر ۶ام, ۱۴۰۲

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

در این مقاله، راهنمای گام به گام در مورد نحوه استفاده از ۴ ابزار هوش مصنوعی برای افزایش سرعت فرآیند طراحی آورده شده است. 

 

در ادامه، می‌بینیم که چطور از ChatGPT، Midjourney، Adobe sensei & VisualEyes می‌شود برای طراحی رابط کاربر و تجربه کاربر بهره برد. هر یک از این ابزارها در مرحله‌ای از فرآیند طراحی به تیم طراحی محصول و طراحان UI/UX کمک می‌کند.

با ChatGPT شروع می‌کنیم. 

 

۱.  به کمک ChatGPT برای طراحی برنامه‌ریزی کنید

قبل از ورود به فرآیند طراحی لازم است که برنامه‌ریزی داشته باشید. استفاده از ابزارهای هوش مصنوعی مانند ChatGPT برای ایجاد ساختار درختی و سایت‌مپ (نقشه کلی سایت) و کپی‌ رایتینگ یکی از روش‌های برنامه‌ریزی مؤثر است. ChatGPT یک سایت‌مپ از وبسایت مدنظر را با نمونه‌هایی از لایه‌بندی‌ها (layout)، عنوان‌ها (headline)، عنوان‌های فرعی (subheadline) و پاراگراف‌های ممکن ایجاد می‌کند. پس دیگر نیازی به لورم ایپسوم (Lorem Ipsum) نخواهد بود.

Lorem Ipsum عباراتی بی‌معنا است که طراحان برای پُرکردن فضا‌های خالی وبسایت از آن استفاده می‌کنند تا بعدا  محتوای متنی مناسب و معنادار در آن قرار بگیرد. Lorem Ipsum کمک می‌کند تا نشان داده شود که پس از اتمام یک محتوا، در مرحله برنامه‌ریزی، متن چگونه به نظر می‌رسد. این بدان معناست که وقتی یک طراح الگوی خود را برای مشتری می‌فرستد، حواس او با متن‌های روی صفحه پرت نخواهد شد و فقط به طرح توجه خواهد کرد.

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

در ادامه به آموزش سریع نحوه استفاده از ChatGPT برای پروژه‌های UI/UX می‌پردازیم. برای هر مرحله تصویری قرار داده شده است که نشان می‌دهد این چت بات چطور به دیزاینر پاسخ می‌دهد. (عکس‌ها از وبسایت medium برداشته شده است.)

  • اول باید درباره‌ی کسب و کار خود به ChatGPT آموزش و اطلاعات دهید و مشتریان هدف خود را به او معرفی کنید.

 

 

  • کار مدنظر خود را به او بگویید تا انجام دهد.

 

 

  • خروجی را مرور و تغییرات لازم را اعمال کنید.

 

 

 

۲. به کمک Midjourney طراحی‌‌های گرافیکی را انجام دهید

Midjourney یک ابزار هوش مصنوعی است که از ماشین لرنینگ برای ایجاد گرافیک‌های حرفه‌ای استفاده می‌کند. با Midjourney می‌توان به راحتی لوگو، پست‌ شبکه‌های اجتماعی، بنر وبسایت‌ و سایر موارد گرافیکی جالب را طراحی کرد. این ابزار برای تولید ایده‌های طراحی از ماشین لرنینگ استفاده می‌کند. شما با استفاده از آن امکان تغییر عناصر طراحی را مطابق میل خود خواهید داشت.

Midjourney همچنین امکانی عالی برای همکاری‌های گروهی ارائه می‌دهد. در این ابزار اعضای تیم می‌توانند ایده‌های طراحی خود را در آنِ واحد به اشتراک بگذارند. یک ابزار عالی برای متمایز کردن کیفیت تصاویر شما و به تحسین واداشتن مخاطبان است. در ادامه ببینید که چگونه این ابزار جادو می‌کند.

 

 

 


طراح محصول از ابزارهای مختلفی در فرآیند طراحی استفاده می‌کند. همه‌ی آن ابزارها مبتنی بر هوش مصنوعی نیستند. «ابزارهای طراحی UI در آینده چه شکلی خواهند بود؟» را بخوانید تا با ابزارهای تخصصی طراحان UI آشنا شوید. 


 

مراحل کار با Midjourney

۱. ابتدا باید موتور stable diffusion را در سیستم خود راه‌اندازی و اجرا کنید. Stable Diffusion یک مدل یادگیری عمیق است که دستورات متنی را دریافت می‌کند و خروجی را به صورت تصویر ارائه می‌دهد. به عنوان مثال، اگر در stablediffusionweb.com بنویسید «یک سیب روی سطح ماه»، تصاویر زیر را به شما تحویل می‌دهد. 

 

 

۲ . Discord (دیسکورد) را دانلود کنید و در آن حساب کاربری بسازید. دیسکورد یک پلتفرم پیام‌رسان رایگان است که به افراد امکان می‌دهد چت صوتی، تصویری و متنی را با دوستان، انجمن‌های بازی و برنامه‌نویسان وب به اشتراک بگذارند. دیسکورد صدها میلیون کاربر دارد که آن را به یکی از محبوب‌ترین راه‌های ارتباط آنلاین با مردم تبدیل می‌کند.

 

 

پس از طی مراحل عضویت، در کانال newbies در دیسکورد، عبارت settings/ را تایپ کنید. برای بسیاری از افراد تنظیمات موجود کار می‌کنند. مهمترین تنظیم اولین تنظیم و یا همان موتوری است که طراحی شما را ایجاد می‌کند. اگر می‌خواهید یک عکس واقعی داشته باشید، با  MJ version 4 کار کنید و اگر می‌خواهید وبسایت خود را انیمیشنی و متحرک طراحی کنید، مود Niji را انتخاب کنید.

 

 

۳. حالا به هوش مصنوعی بگویید که چه می‌خواهید. در نظر بگیرید که شما می‌خواهید تصاویر بسیار متفاوت برای وبسایت خود تولید کنید. در  prompt  می‌بایست علاوه بر توضیحات ضروری عبارت UI/UX هم باشد تا هوش مصنوعی بداند که به طراحی رابط کاربر نیاز دارید. مقیاسی که می‌خواهید طرح شما در آن ابعاد ایجاد شود نیز باید نوشته شود. 

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

 

۳. برای ویرایش تصاویر از Adobe Sensei کمک بگیرید

Adobe Sensei یک ابزار مجهز به هوش مصنوعی است که به شما در ویرایش تصویر کمک می‌کند. این ابزار از ماشین لرنینگ برای تجزیه و تحلیل تصاویر استفاده می‌کند و پیشنهاداتی برای بهبود آن‌ها ارائه می‌دهد.

برای مثال، اگر عکسی با پس‌زمینه‌ای مزاحم دارید، Sensei آن را حذف و پس‌زمینه بهتری را جایگزین می‌کند. این ابزار همچنین اصلاح رنگ‌ها را پیشنهاد و تصاویر را برش می‌دهد و حتی جلوه‌های ویژه‌ای را به تصاویر شما اضافه می‌کند. با این ابزار به راحتی می‌شود تصاویری که با Midjourney ساخته شده است، ویرایش کرد. 

 

 

 


تصاویر و طرح‌ها در طراحی UI/UX با رعایت اصولی انتخاب و در کنار هم چیده می‌شوند. «ویژوال دیزاین: تضمین زیبایی و کاربردپذیری محصول دیجیتال» را بخوانید تا با آن اصول آشنا شوید. 


 

۴.  با ابزار  VisualEyes تست‌های کاربری را انجام دهید

VisualEyes ابزار هوش مصنوعی است که به طراحان کمک می‌کند تا از طریق نمایاندن مسیر چشم کاربر نحوه تعامل کاربران با طرح‌های خود را درک کنند. استفاده از Visual Eyes برای طراحی UI/UX شامل چندین مرحله است:

  • ابتدا طراح باید طرحی را که می‌خواهد آزمایش کند (وبسایت یا اپلیکیشنی را که کامل و آماده است) انتخاب کند.
  • سپس، پارامترهای تست را در VisualEyes با مشخص کردن مخاطب هدف، تعداد کاربران و مدت زمان تست تنظیم می‌کند. در طول آزمایش، VisualEyes مسیر چشم کاربر در هنگام تعامل با طراحی را شبیه‌سازی و حرکات چشم، کلیک‌ها و اسکرول‌های او را ثبت می‌کند.
  • پس از انجام تست، VisualEyes گزارشی از نتایج آزمایش شامل زمان صرف‌شده برای هر المان و بخش از طراحی که بیشترین توجه را به خود جلب کرده است، ارائه می‌دهد.
  • طراح نتایج را تجزیه و تحلیل  و از بینش به‌دست‌آمده برای بهینه‌سازی طراحی و تجربه کاربر استفاده می‌کند.
  • در نهایت، دیزاینر آزمایش را با گروه‌های کاربری مختلف تکرار می‌کند تا مسائل دیگری را که ممکن است وجود داشته باشند و نیاز باشد به آن‌ها رسیدگی شود، شناسایی کند.

 

 

 

 

جمع‌بندی و نتیجه‌گیری

 ابزارهای هوش مصنوعی به طور قابل توجهی فرآیند طراحی UI/UX را بهینه و در زمان صرفه جویی می‌کنند و کیفیت کلی طراحی را نیز بهبود می‌بخشند. با استفاده از ابزارهایی مانند ChatGPT، Midjourney، Adobe Sensei و VisualEyes می‌توانید فرآیند طراحی خود را ساده و طرح‌های حرفه‌ای را به‌ راحتی ایجاد کنید.

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

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

 

 

 



دوره غیرحضوری کاربـردی و عملی طراحـی تجربـه کاربـر (UX Design)


آموزش طراحی تجربه کاربر برای ورود به بازار کار


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


به زبان ساده تر، تجربه کاربری مناسب دقیقا همان عاملی است که باعث می شود مشتری تصمیم بگیرد که آیا دوباره به وب سایت شما بازگردد یا خیر، و هم‌چنین تعیین می‌کند که شما در ذهن مشتری به فراموشی سپرده می‌شوید یا ماندگار; تجربه‌ی کاربری خوب در هنگام تعامل با سایت شما به مشتری حس لذت بخشی را القا می‌کند، این حس هم می‌تواند از طریق مرتب بودن، با کیفیت بودن و سرعت مناسب فرایندهایی که قرار است مشتری برای رسیدن به یک هدف خاص طی کند باشد و هم موارد دیگر از قبیل مکان مناسب قرار گرفتن المان‌ها و…


ادامه…


0 دیدگاه

دیدگاهتان را بنویسید

Avatar placeholder

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *