
UI (User Interface)
فضایی است که تعامل بین انسان و ماشین در آن رخ میدهد. واسط کاربری، بخش دیدنی و قابل لمس یک ابزار است که کاربر مستقیماً با آن سر و کار دارد. در واقع عامل تعامل سیستم مورد نظر با کاربر است. عامل UI در حالت های مختلفی بر روی انواع سیستم ها وجود دارد. از سایت گرفته تا نرم افزار، سیستم عامل، موبایل و … همگی به نوعی دارای رابط کاربری هستند.
به طور کلی به رابط میان کاربر و یک سیستم رابط کاربری گفته می شود. برای مثال رابط کاربری در یک وبسایت است که مشخص می کند شما برای انجام عمل ثبت نام باید از چه طریقی اقدام و چه مراحلی را باید طی کنید. یا به عنوان مثالی دیگر رابط کاربری موبایل است که مشخص می کند شما برای گرفتن عکس و یا رفتن به گالری تصاویر خود باید چه اقداماتی را انجام دهید.
هر رابط کاربر، به دو سازوکار اساسی مجهز است:
• درونداد؛ کاربر از طریق رابط کاربر، به ماشین فرمان میدهد.
• برونداد؛ ماشین از دریچه رابط کاربر، به دستورهای کاربر، پاسخ و عکسالعمل نشان میدهد.
در این حالت اصطلاحاً میگویند که کاربر و رابط کاربر، با یکدیگر تعامل دارند.
رابط کاربری یا همان UI نقش بسیار مهمی در فرآیند جذب و نگهداری مشتری ایفا می کند. اگر UI در یک سایت به صورت حرفه ای طراحی و پیاده سازی شده باشد، کاربران به راحتی می توانند با سایت تعامل برقرار کنند و به اهداف خود برسند. اما اگر UI یک وبسایت دارای مشکل باشد و نتواند انتظارات یک کاربر را برآورده کند، حتی در صورتی که از محتوایی غنی استفاده کند، نمی توان انتظار جذب بالا و یا بازگشت (Retention) کاربران را داشت.
بنابراین باید توجهی ویژه به این حوزه داشته باشید و سعی کنید با طراحی رابط کاربری مناسب، تعامل کاربران را با وبسایت خود به حداکثر خود برسانید.
اگر از سیستم های مدیریت محتوا و تم های آماده آنها (وردپرس، جوملا و…) استفاده می کنید، خیلی نباید نگران UI وبسایت خود باشید چرا که معمولا این تم ها بر اساس استانداردهای UI ساخته می شوند و کاربران احساس خوبی از تعامل با آنها دارند.
اهمیت UI:
احتمالا تا به حال به وب سایت ها و اپلیکیشن هایی برخورد کرده اید که برای کاربر جذابیت لازم رو نداره و کاربر پس از مدت زمان کوتاهی کار کردن با اون ها خسته میشه و وب سایت رو ترک میکنه و یا اپلیکیشن رو میبنده. برای جلوگیری از این اتفاقات باید وب سایت یا اپلیکیشن شما از رابط کاربری خوبی برخورد باشه. اگر در سایت یا اپلیکیشن شما المان های گرافیکی در جای مناسب خود قرار داشته باشن و محیط ظاهری اون جذاب باشه به راحتی میتونین کاربرا رو به سمت خودتون بکشین و به سرعت پیشرفت کنین.
UI Design یا طراحی رابط کاربری چیست :
UI Design یا طراحی رابط کاربری، مبحثی است که به طراحی UI برای دستگاهها، نرمافزارها و همچنین محیط وب میپردازد و بر تناسب و زیبایی تمرکز دارد؛ با این هدف که امکان استفاده بیشتر و بهتری از طرح و محتوای مورد نظر فراهم شود و تجربه کاربری بهتری برای مخاطب رقم بخورد. طراحی UI بخشی از مبحث گسترده تری با نام طراحی UX (User Experience) یا تجربه کاربری است که بیشتر بر روی رنگها و تایپوگرافی یا طرح نوشتهها تمرکز دارد. به عبارت دیگر، UI متشکل از همه مؤلفههایی است که امکان تعامل کاربر با سیستم یا محصول ما را فراهم میکنند، اما UXدستاورد کلی کاربر از تجربه خود در تعامل با سیستم یا محصول ماست. به طور خلاصه، طراحی UI معمولاً ترکیبی از موارد زیر است:
• طرح بصری؛ یعنی حال و هوا و حسی که به دنبال انتقال آن هستیم و
• طراحی تعامل؛ یعنی نحوه عملکرد طرح ما و تأثیر آن بر تعامل مخاطب با طرح و محتوا.
با ذکر یک مثال میتوان کاملاً تفاوت طراحی UI و UX را درک کرد. اگر فرض را بر این بگیریم که میخواهیم یک دکمه به طرحمان اضافه کنیم، طراحی UX روی این تمرکز میکند که دکمه مورد نظر را در کجا قرار بدهد تا کاربر بتواند آن را به آسانی پیدا کند؛ اما طراحی UI به این فکر میکند که چطور میتوان دکمه مزبور را زیباتر و جذابتر کرد تا کاربر به فشار دادن یا لمس آن رغبت پیدا کند.
طراحی رابط کاربری ریسپانسیو :
امروزه کاربران موبایل و تبلت به طور چشم گیری در حال افزایش هستند و اکثر افراد با موبایل خود از سایت ها دیدن میکنن. به همین دلیله Responsive UI یا همون رابط کاربر ریسپانسیو اهمیت پیدا میکنه. Responsive UI در هر صفحه نمایشی با هر اندازه ای به درستی نمایش داده میشه و کاربر میتونه به هر دستگاهی به وب سایت شما دسترسی داشته باشه و از اون استفاده کنه. در حال حاضر رابط کاربری ریسپانسیو دیگه یک امتیاز خاص محسوب نمیشه و تقریبا جزو لازمه های یک وب سایت کامله و میشه گفت اگه اون رو نداشته باشه ناقصه.
یه طراح UI چی باید بلد باشه :
با اینکه گفتیم طراحان دیداری (گرافیست ها) با طراحان رابط کاربری متفاوت هستن، اما واقعیت اینه که معمولا یه طراح UI باید طراحی دیداری رو هم بلد باشه. علتش اینه که معمولا اغلب شرکتها یه نفر رو استخدام میکنن تا کار هر دو رو انجام بده. بنابراین طراح رابط کاربری نیاز داره که بتونه با ابزارهای گرافیکی مثل Photoshop و یا Illustrator کار کنه.
اما امروزه یه مفهوم جدید به اسم UI Developer هم بوجود اومده. این دسته متخصصین افرادی هستن که هم مهارتهای یه طراح رابط کاربری رو دارن و هم یه برنامهنویس front-end.
توسعهدهندههای رابطکاربری باید در HTML، CSS و Javascript مهارت کافی داشته باشن. بعلاوه اینکه یکی از فریمورکهای React، VueJS یا Angular رو کار کنن. البته اگه بخوان توسعه دهنده باشن، که هنوز خیلی واجب نیست.
اگه تمرکزتون روی وب سایته، خیلی خوبه که سبک های مختلف طراحی رو بشناسید. به عنوان مثال بهتره به مزایا و معایب سبک هایی مثل تخت، رئالیسم، سه بعدی و .. آشنایی کافی داشته باشید.
چرا به UI نیاز داریم :
واضح است که هر چیزی که به مخاطب خود ارائه میکنید باید از لحاظ بصری جذاب و زیبا باشد و به مذاق وی خوش بیاید. یک رابط کاربری مناسب یک زبان بصری واحد به وجود میآورد که به بهبود تعامل کاربران با محصول شما کمک خواهد کرد. در واقع، UI یا رابط کاربری فصل مشترک طراحی تعامل (Interaction Design)، طراحی بصری (Visual Design) و معماری اطلاعات (Information Architecture) به شمار میرود و خواه ناخواه همه ابعاد آنچه که به مخاطب خود عرضه میکنید را تحت تأثیر قرار خواهد داد. در غیاب یک UI مناسب، تعامل کاربر به نحو مطلوبی انجام نمیشود و لذا نتایج چندان ایده آلی را شاهد نخواهیم بود.
Mobile UI :
همون طور که گفته شد طراحی رابط کاربر در اپلیکیشن های موبایل نیز دارای اهمیت خاصیه و یک اپلیکیشن برای پیشرفت، یک UI کامل و جذاب نیاز داره.
تست کاربردپذیری :
اینم یکی از چیزهایی هست که یه طراح رابط کاربری باید بلد باشه. اما چون اغلب علیرغم اهمیتش بهش بیتوجهی میشه ترجیح دادم جداگانه بهش بپردازم.
کاربردپذیری بخشی از یک مفهوم وسیعتر به نام تجربه کاربری هست و اشاره داره به سادگی دسترسی یا استفاده از یک محصول یا وبسایت خاص.
کاری که یه طراح رابط کاربری قبل از گرافیکی شدن وبسایت انجام میده اینه که کاربردپذیر بودنش رو با استفاده از ابزارهای نمونهسازی بارهای بار تست می کنه، تا مطمئن شه همه چیز همونجوری کار میکنه که کاربر انتظارش رو داره و میفهمه.
تست کاربردپذیری یکی از اون چیزهایی هست که باید خیلی بهش توجه ویژه داشته باشید. نتایجی که بعد از آزمایش بهدست میاد اغلب براتون قابل پیشبینی نیست.
اصول طراحی UI:
یک طراح خوب در هنگام نمونه سازی و طراحی رابط کاربری از 6 اصل طراحی UI پیروی میکند:
• ساختارمندی: این اصل با کلیت معماری رابط کاربری در ارتباط است و اعتقاد دارد که طرح باید واضح، هماهنگ و قابل درک بوده و موارد مرتبط را در کنار هم و موارد بی ربط را از هم جدا کند؛ به گونهای که ساختار قابل قبولی بر تمامیت مدل UI حکمفرما شود.
• سادگی: طراحی UI باید باعث ساده سازی و تسهیل انجام فعالیتهای مختلف برای کاربر شود، به گونهای که مخاطب با محیط کاربری احساس غریبگی نکند.
نمایانی: طراحی باید به گونهای انجام شود که همه گزینهها و مؤلفههای مورد نیاز کاربر بدون وجود هیچ عامل مزاحم و بلا استفادهای آشکار بوده و در دسترس وی قرار داشته باشند. هیچ اطلاعات تکراری و گزینههایی که دلیل موجهی برای وجودشان متصور نیست در طراحی UI جایی ندارند.
واکنش پذیری: کاربر باید متناسب با هر عملی که انجام میدهد و هر اتفاقی که در سطح سیستم یا UI روی میدهد، واکنش و پیامهای مناسبی را دریافت کند.
تولرانس (Tolerance) یا خطاپذیری: طراحی باید انعطاف پذیر باشد و امکان لغو و تکرار عمل قبلی undo و redo را مهیا کند تا از اشتباه و استفاده نامطلوب جلوگیری شود.
اصلاح و بازیافت پذیری: باید بتوان مؤلفههای داخلی و خارجی مورد استفاده در طراحی را اصلاح و مجدداً از آنها استفاده کرد.
کاربران چه چیزی می خواهند :
پاسخ به این سوال بسیار مهم و اساسی است. چرا که فلسفه وجودی UI به کاربران باز می گردد. اگر بدانیم کاربران واقعا چه چیزهایی می خواهند بخش مهمی از کار را با موفقیت انجام داده ایم. برای مثال:
• طرح ظاهری و الگوی گرافیکی
• سرعت و کارایی حداکثر
• دسترسی آسان به بخش های دیگر
• توجه به نیازهای آتی کاربران
انجام فرایند UI:
با توجه به مطالب گفته شده نتیجه میگیریم که برای داشتن یک وب سایت یا اپلیکیشن جذاب و کامل باید رابط کاربری سایتتون یا اپلیکیشنتون خیلی خوب باشه. در صفحات وب برای پوشش انجام فرایند UI بیشتر از نرم افزار هایی مثل فتوشاپ و زبان های برنامه نویسی JavaScript و JQuery و CSS و HTML استفاده میشه.
تاثیر رابط کاربری بر روی سئو :
یکی از نتایج مهم UI مناسب، جذب و حفظ موفق کاربران است. این موضوع در سایت ها به عنوان نشانه ای مثبت در جهت اثبات کیفیت و کارایی است. همانطور که می دانید در دنیای دیجیتال مارکتینگ، مدت زمانی که یک جستجوگر گوگل در وبسایت شما باقی می ماند (Dwell Time) و به فعالیت خود ادامه می دهد، یک فاکتور مهم برای گوگل جهت رتبه بندی صفحات است.
یکی از عوامل بسیار مهم در افزایش این مدت زمان، رابط کاربری است. اگر کاربر با وبسایت شما احساس راحتی کند و در کنار آن از محتوای شما لذت ببرد، به طور قطع صفحات دیگری از وبسایت شما را نیز بررسی خواهد کرد که این خود برای گوگل یک سیگنال قوی برای رضایت کاربر است.
به دقت در مورد اندازه و محل قرارگیری المان ها فکر کنید.
قانون Fitts، یک اصل اساسی در تعامل انسان و کامپیوتر(HCI)، بیان می کند که:
زمان به دست آوردن یک هدف، تابع فاصله با هدف و اندازه هدف است.