نکاتی درباره ی رابط کاربری و تجربه کاربری

Tips-About-UI&UX

سلام و درود خدمت دوستان خوبم !

 

امیدوارم که سلامت باشید و ایام بکام … همون طور که می دونید این هفته آخرین هفته سال هست. وقت خداحافظی با سال ۱۳۹۲٫ برای همین تصمیم گرفتم در آخرین هفته سال مطلبی رو در وبلاگم بنویسم. موضوع مطلب خیلی کلی هست و به علاوه این که مبحثی هست با شاخه ها و موضوعات مختلف. و مطمئنم خیلی جاها درموردش شنیدید یا مطالعه کردید … اما هدف اصلی من ارائه یه توضیح کلی ، بیان نکات و ارائه تجربیات اندکم در این زمینه هست …

 

رابط کاربری (User Interface) و تجربه کاربری (User Experience) دو معقوله ی اصلی و مهم در یک پروژه هستن. برای مثال : یک اپلیکیشن یا یک وب سایت و …

 

:: رابط کاربری به طور ساده یعنی محیطی که کاربر باهاش سروکار داره که این محیط شامل موارد زیادی می شه. مثلا در یک اپلیکیشن شامل دکمه ها ، منو ها ، فضاها و … می شه.

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

 

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

 

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

۱- در ابتدا فقط و فقط طرح کلی رو در ذهنتون ترسیم کنید و کاری به جزئیات نداشته باشید و تمرکزتون رو روی جزئیات قرار ندید در غیر این صورت همش تغییراتی رو در ذهنتون در طرحتون ایجاد می کنید و به فکر تصحیحشون هستید و نمی تونید کار رو درست شروع کنید. پس در ابتدا از آنالیز کردن طرح پرهیز کنید !

۲- در ابتدا برای طراحی رابط کاربری یک طرح دنبال منابع مناسب بگردید و اونها رو مطالعه کنید و ازشون ایده بگیرید و این رو در شروع طراحی رابط کاربری هر پروژه ای انجام بدید. بنظرم بزرگترین اشتباهی که خیلی افراد حتی بعضی طراحان رابط کاربری انجام می دن اینه که بی پروا شروع به طراحی طرحشون در فتوشاپ می کنن یا در همون ابتدا اسکچ طرح رو روی کاغذ میارن. شما برای شروع هرکاری باید یک چیز به اصطلاح پایه در ذهنتون داشته باشید و سپس با ایده های خودتون و تجربیاتتون بهش شکل بدید.

۳- برای طراحی رابط کاربری باید خیلی موارد در نظر گرفته بشن. برای مثلا شما نباید ناگهانی شروع به طراحی کنید بلکه باید یک پترن خاص رو برای خودتون داشته باشید و اون هم نه هر پترنی. مثلا نه پترنی که خودتون ارائه کردید یا … باید استانداردهای یک پترن رو یادبگیرید ( برای مثال پترن مایکروسافت برای طراحی اپلیکیشن برای مترو ) سپس با توجه به اون پترن و رعایت استانداردهاش طرح خودتون رو شکل بدید تا یک طرح درست و صحیح داشته باشید.

۴- در طراحی رابط کاربری از یک شاخه به چند شاخه نپرید. یعنی برای خودتون بر اساس موضوع و حجم پروژه اولویت بندی کنید و سپس شروع به طراحی بخش های مختلف طرح بکنید و هر بخش رو نصفه نیمه رها نکنید.

۵- بخش های پایه ای طرحتون مثل منو ها ، ستون ها ، فضاهای خالی و … رو به طور جداگونه در نظر نگیرید و طراحی نکنید بلکه اولویت بندیشون کنید و اونها رو باهم به جلو ببرید و هارمونی میان اجزای هر بخش رو رعایت کنید.

۶- به هنگام طراحی هر بخش کاغذ دیگه ای در کنار دستتون بگذارید و تجربه کاربری هر بخش رو پیش بینی کنید چون تجربه کاربری موردی هست که ممکنه از دست طراح خارج بشه و در بعضی بخش ها فراموش بشه و بهش توجه کمتری بشه. و این که چرا گفتم پیش بینی دلیلش این هست که بنظرم تجربه کاربری رو نمی شه ایجاد کرد حداقل نه همیشه و گاهی اوقات شما فقط می تونید اون رو پیش بینی کنید و تا حدودی خودتون رو جای کاربر بگذارید اما به هر حال نمی شه اون رو در همه وقت به طور کامل ایجاد کرد. “تجربه کاربری باید توسط کاربر ایجاد بشه نه این که شما سعی کنید اون رو برای کاربر ایجاد کنید. شما فقط سعی کنید اون رو پیش بینی کنید.”

۷- مواردی مثل رعایت استانداردها هم بنظرم نیازی به ذکر ندارن و شما باید اون ها رو از قبل مطالعه کرده باشید و بدونید. مثل استانداردهای پالت رنگ یا فضای خالی یا …

۸- به نظر من بعضی از استانداردهای خیلی پایه ای و مهم رو هم به صورت تیتروار در یک کاغذ در کنار کاغذ تجربه کاربری بنویسید و اونها رو درکنار هم قرار بدید.

۹- نکته ای که خیلی طراح های رابط کاربری باهاش مشکل دارن اینه که به مشکلاتی که طرحشون می تونه برای برنامه نویس ایجاد کنه فکر می کنن و تمرکز روی این مورد در هر بخش رشته افکار رو پاره می کنه و اون رو از مسیر خارج می کنه. برای حل این مشکل شما فقط کافیه با توجه به استانداردها جلو برید و هارمونی رو حفظ کنید. اگر طرح شما درست طراحی شده باشه مشکلی هم برای برنامه نویس بوجود نمیاره.بجز بعضی موارد خاص کلی که باید بهشون توجه بشه نباید روی مشکلات دیگه مراحل برنامه نویسی توجه کنید.

۱۰- هیچ وقت همزمان چند طرح رو برای یک پروژه جلو نبرید و روی یکی تمرکز کنید سپس بعد از اتمام می تونید هر کدوم رو جداگونه توسعه بدید و درنهایت بهترین رو انتخاب کنید.

۱۱- شاید این مورد کمی نیاز به تمرکز داشته باشه و از توجهتون روی موارد دیگه کم کنه اما اگر به این مورد توجه نشه کل طرح درست طراحی نمیشه و اون این هست که طرح کلی رو نگه دارید. طوری جلو نرید که در هر بخش فکر کنید دارید رابط دیگه ای رو طراحی می کنید. برای حل این مشکل هم در هر بخش کلی یک نگاه کلی به طرحتون بکنید و اون رو با طرح اولیه مقایسه کنید.

۱۲- همچنین در پایان این رو اضافه کنم که می تونید نکات بالا و نکات دیگه رو جمع بندی کنید و در یک کاغذ اولویت بندی کنید و بنویسید و همیشه کنار دستتون بگذارید تا با این کار ذهنتون رو به این موارد عادت بدید و فراموششون نکنید.

 

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

 

امیدوارم تونسته باشم در حد خودم با تجربیات اندک کمکی در این زمینه کرده باشم.

موفق و سربلند باشید !

آرین

ارسال شده در : ۲۷ اسفند ۱۳۹۲ | موضوع : آموزش, توسعه وب, رابط کاربری
آرمان تشکر گفته :
اسفند ۲۸ام, ۱۳۹۲

عزیزم مثل همیشه عالی بود ………..
موفق باشی

آرین گفته :
اسفند ۲۸ام, ۱۳۹۲

ممنوم عزیزم 🙂

گودزیلای وب فارسی گفته :
فروردین ۹ام, ۱۳۹۳

آقا بسیار مفید بود. بسی لذت بردیم
اسکچ کشید رو من تازه شروع کردم (یاد گرفتم) و خیلی خیلی مفید هست.

آرین گفته :
فروردین ۹ام, ۱۳۹۳

سلام و درود پیام جان.
خوشحال شدم که لذت بردی.

موفق و سربلند باشی

پریجهان گفته :
مرداد ۳ام, ۱۳۹۴

سلام
واقعا ممنون
ممکنه درباره استاندرادها در شماره ۸ توضیح مفصل تری برام ای میل کنید؟
همچنین پترن ها در شماره ۳.
ممنون میشم.

آرین گفته :
مرداد ۳ام, ۱۳۹۴

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

همچنین برای طرحتون می تونید تایپوگرافی خاصی رو در نظر بگیرید با استاندارد های سایزی. مثلا این که فلان بخش ها باید نسخه regular فونت مورد نظرتون در اونها استفاده بشه و در یک سری بخش های دیگه بالعکس نسخه ی bold فونت مورد نظر.
و و و…

پ.ن. البته استاتدارد هایی که بنده بالا ذکر کردم بیشتر مربوط به رابط کاربری هستن.

موفق و سربلند باشید
آرین

ارسال نظر




To view this website please upgrade your browser or use other modern browsers ! :)