Posts Tagged with “ux”

ابزارهای طراحی رابط کاربری و تجربه کاربری

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

UI چیست

طراحی ui

UI مخفف عبارت User Interface یا به فارسی رابط کاربری است. در واقعه رابط کاربری همان ارتباط بصری و گرافیکی بین سایت و کاربر بازدید کننده از آن است. وقتی شما یک سایت را باز می کنید، دکمه هایی که می بینید، طراحی قالب آن، عکس ها و انیمیشن ها و حتی گرافیک هایی که ممکن است در یک سایت تماشا کنید تماما رابط کاربری یک سایت را تشکیل می دهند. وظیفه طراحی یک رابط کاربری در ابتدا بر عهده طراح رابط کاربری است. یک طراح رابط کاربری باید با استفاده از برنامه های گرافیکی مثل فتوشاپ سایت را طراحی کند. پس از طراحی رابط کاربری نوبت به برنامه نویس فرانت اند است تا این طرح های گرافیکی را به کد تبدیل کند تا کاربر آن را بتواند در کامپیوتر خود مشاهده کند.

UX چیست

تجربه کاربری

UX مخفف User Experience و ترجمه آن به فارسی تجربه کاربری است. تجربه کاربری دقیقا همان چیزی است که شما به خاطر آن از یک سایت استفاده می کنید اما آن را نمی بینید. بگذارید از تعریف ها فاصله بگیریم و با یک مثال معنی تجربه کاربری را به شما بگوییم. هنگامی که گوگل را باز می کنید و یک جستجو انجام می دهید، این که شما به چه صورت جستجو کنید، چه کدهایی برای انجام اجرا شدن یک جستجو لازم است و باید هر بخش از سایت به چه صورت فعالیت داشته باشد. تمامی این موارد به عنوان تجربه کاربری شناخته می شود و یک طراح تجربه کاربری به همراه برنامه نویس بک اند وظیفه دارد تا آن را طراحی کنند و سپس برنامه نویسی آن را انجام بدهند.

مسئولیت طراح UX و UI چیست

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

وظایف یک طراح رابط کاربری عبارتند از:

  • طراحی بصری
  • انتخاب رنگ ها
  • طراحی گرافیک
  • طرح بندی سایت
  • تایپوگرافی

و در مقابل آن وظیفه یک طراح تجربه کاربری عبارتند از:

  • طراحی شیوه تعامل کاربر با سایت
  • معماری اطلاعات
  • طراحی نمونه اولیه
  • تحقیق در مورد مشتری و نیازهای او
  • روانشناسی کاربران
  • طراحی استراتژی

 

شیوه ساخت تجربه کاربری و رابط کاربری

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

نرم افزار MockFlow

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

نرم افزار  Mason

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

برنامه Overflow

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

ابزار Visual Inspector

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

 

برنامه Adobe XD

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

برنامه Sketch

برای طراحانی که از سیستم عامل Mac OSX استفاده می کنند برنامه Sketch در دسترس است که به شما این اجازه را می دهد تا با آن بتوانید رابط کاربری و تجربه کاربری مورد نظر خود را تولید کنید.

برنامه UserTesting

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

 

 

برنامه JustInMind

یکی از برنامه های سریع برای تولید تجربه کاربری و رابط کاربری برنامه JustInMind است. این برنامه با دارا بودن کتابخانه بسیار بزرگ از ویجت ها مسیر و روند طراحی رابط کاربری و تجربه کاربری را برای شما آسان می کند.

JustInMind

نتیجه گیری

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