رابط کاربری
با قسمت سوم از مقاله «ویژگی های یک سایت موفق» با ما همراه باشید.
قطعا یکی از اصلی ترین دلایل موفقیت یک سایت ، رابط کاربری آن است (در برخی آمار ها 80 درصد موفقیت یک سایت را به رابط و تجربه کاربری نسبت داده اند)
در این مقاله، ابتدا به این میپردازیم که رابط کاربری چیست؟! بعد از آن به ویژگی ها یک رابط کاربری خوب اشاره میکنیم و در انتها ابعاد مختلف آن را بررسی میکنیم. لطفا تا انتهای مقاله با ما همراه باشید.
رابط کاربری ( UI ) چیست؟
وقتی میخوایید یه در رو باز کنید، دستگیره چیزیه که باعث میشه بتونید بازش کنید! اگه دستگیره (یا هر چیز جایگزین) نبود، «در» قابل استفاده نبود.
وقتی میخوایید تلویزیون رو از جاش بلند کنید، کناره‌هاش دو تا جای دست هست که باعث میشن انجام این کار راحتتر بشه.
به بیان بسیار ساده: هر چیزی که باعث میشه بتونید از یه محصول استفاده کنید (بکارش بگیرید) رو رابط کاربری میگیم.
رابط کاربری در علوم کامپیوتر
با مثال‌هایی که زدم احتمالا به این فکر میکنید که رابط کاربری از اولین باری که بشر یه محصول اختراع کرده مطرح بوده. نه، نه بشکل امروزی.
تعریف ویکی پدیا اینطوریه:
«رابط کاربری فضاییه که تعاملات بین انسان و ماشین درش اتفاق میفته.»
مفومی که امروزه به عنوان رابط کاربری میشناسم در مواجهه با کامپیوترها شکل گرفت. بنابر این هرچی در این حوزه میبینیم با فناوری اطلاعات و محصولات دیجیتالی (نرم افزاری) گره خورده.
با اینکه خیلی‌ها UI Design یا طراحی رابط کاربری رو به خاطر داشتن عنوان «طراحی» تو خودش زیرمجموعه هنر و طراحی صنعتی به حساب میارن، اما واقعیت اینه که امروزه در دانشگاه‌های بزرگ دنیا مثل MIT، رابط کاربری در دانشگده‌های علوم مهندسی و کامپیوتر تدریس میشه.
اما اگر تا این جا متوجه مفهوم رابط کاربری در یک سایت یا نرم افزار نشدید، بهتره با تعدادی مثال موضوع رو کاملا ملموس کنیم. همین حالا یک وبسایت دلخواه رو باز کنید. ما تمام آن چیزی که قابل مشاهده است (از دیزاین ظاهری سایت و رنگ بندی ها تا شکل دکمه ها، محل قرارگرفتن منو ها، شکل و فونت منو ها، تصاویر و آیکون های به کار رفته و همه و همه آن چیزی که قابل مشاهده است) رابط کاربری میگوییم.
ویژگی های یک رابط کاربری خوب!
یک رابط کاربری قابل قبول و استاندارد دارای یکسری اصول و قائده است که با رعایت اون ها و البته یکسری جزئیات دیگه (که قصد ورود به مطالب تخصصی تر رو در این مقاله نداریم) میتونیم به اون لقب یک رابط کاربری خوب رو بدیم. اما اصول طراحی رابط کاربری چیست؟
- اصل ساختار: رابط کاربری باید معنادار، هدفمند، کاربردی و تر و تمیز باشه. باید یک مدل ثابت و مشخص داشته باشه که برای کاربر قابل درک باشه. چیزهایی که به هم ربط دارن باید کنار هم باشن و چیزهایی که به هم ربط ندارن جدای از هم.
- اصل سادگی: رابط کاربری باید ساده باشه، کارهای متداول رو باید بشه به آسانی انجام داد، به همون زبانی باشه که کاربر میفهمه و راه‌های میانبر مناسب واسه فرایند‌های دشوار یا طولانی ارائه بده.
- اصل پدیداری (قابلیت دیده شدن): طراحی باید همه اطلاعات و گزینه‌های لازم برای انجان شدن یک کار رو در اختیار کاربر قرار بده، بدون اینکه با اطلاعات فرعی یا غیرضروری براش مزاحمت ایجاد کنه.
- اصل بازخورد: طراحی باید کاربر رو به زبانی که براش قابل فهم باشه نسبت به تغییرات، وضعیت‌ها، عملیات‌ها، خطاها و استثنائات آگاه نگه داره.
- اصل تحمل: طراحی باید انعطاف‌پذیر و تحمل‌پذیر باشه، هزینه خطاها و اشتباهات رو کاهش بده (مثل امکان undo کردن)، در عین حال تا جایی که ممکنه از بروز اشتباه پیشگیری کنه.
تفاوت طراح رابط کاربری با گرافیست
طراحی رابط کاربری کارش رو با جزییات پایین (low fidelity) شروع میکنه که ممکنه رنگ و لعابی نداشته باشن.
با خودش فکر می کنه: المان‌های مختلف کجای صفحه قرار می‌گیرن؟ (البته بخشی از این موارد تجربه کاربری محسوب میشن که بزودی در مقاله ای جداگانه ، به طور کامل بهش میپردازیم) اگه یه فرم ارسال شد چه اتفاقی باید بیفته؟ خطا ها رو کجا و چطور به کاربر نمایش بدیم؟ آیا اطلاعات فرم به یه صفحه جدید ارسال می شه؟ دکمه ارسال فرم کجا باشه؟
اما گرافیست کارش اینه که رنگ‌بندی، تصاویر مناسب و حس و حال زیبایی‌شناسانه رو طراحی کنه.
گرافیک خوب یعنی نرم افزار باید خوشگل باشه. رابط کاربری خوب یعنی کار با نرم افزار باید ساده باشه
(همون طور که در بخش قبل گفتم دو مفهوم کاربط کاربری و تجربه کاربری شباهت های زیادی با هم دارند و نباید با همدیگه اشتباه گرفته بشن. به طور خلاصه تجربه کاربری یعنی کاربر با تجربه و خاطره خوب از وبسایت شما خارج بشه، روند کار ها در تجربه کاربری نیز شباهت هایی با رابط کاربری داره. مثلا در رابط کاربری مشخص میکنیم یک دکمه اگر فلان جا باشه، کاربر راحت تره. در گرافیک مشخص میکنیم اگر اون دکمه فلان رنگ رو داشته باشه زیباتره ، اما در تجربه کاربری مشخص میکنیم اگر اون دکمه رنگ آبی داشته باشه، کاربر در سایت احساس آرامش بیشتری میکنه ، برای همینه که معمولا طراحای تجربه کاربری، اطلاعات خوبی در مورد روان شناسی، جامعه شناسی و این طور مسائل دارند)
یه طراح UI چی باید بلد باشه؟
با اینکه گفتیم گرافیست ها با طراحان رابط کاربری متفاوت هستن، اما واقعیت اینه که معمولا یه طراح UI باید طراحی دیداری رو هم بلده باشه. علتش اینه که معمولا اغلب شرکت‌ها یه نفر رو استخدام می‌کنن تا کار هر دو رو انجام بده (البته تعداد این شرکت ها با این که زیاده اما دلیل به کیفیت پایین کار ها نمیشه، دلیل هم این که فردی که به هر دو این تخصص ها مسلطه، عملا میتونه نتیجه بهتری خلق کنه) بنابراین طراح رابط کاربری نیاز داره که بتونه با ابزارهای گرافیکی مثل Photoshop و یا Illustrator کار کنه.
البته منظور من اصلا این نیست که برای طراحی فوری فتوشاپ رو باز میکنند! بلکه اول از طراحی نمونه اولیه شروع میکنند.
اما امروزه یه مفهوم جدید به اسم UI Developer هم بوجود اومده. این دسته متخصصین افرادی هستن که هم مهارت‌های یه طراح رابط کاربری رو دارن و هم یه برنامه‌نویس. (تعدادشون بسیار کمه!)
توسعه‌دهنده‌های رابط‌کاربری باید در HTML، CSS و Javascript مهارت و تخصص کافی داشته باشن. این ها زبان ها یا بهتره بگیم تکنولوژی های لازم برای پیاده سازی رابط کاربریه.
اگه تمرکزتون روی وب سایته، خیلی خوبه که سبک های مختلف طراحی رو بشناسید. به عنوان مثال بهتره به مزایا و معایب سبک هایی مثل تخت، رئالیسم، سه بعدی و .. آشنایی کافی داشته باشید.
تست کاربردپذیری
اینم یکی از چیزهایی هست که یه طراح رابط کاربری باید بلد باشه. اما چون اغلب علیرغم اهمیتش بهش بی‌توجهی میشه ترجیح دادم جداگانه بهش بپردازم. (سعی میکنیم به زودی یه مقاله مفصل و جامع در مورد تست کاربرد پذیری آماده کنیم)
کاربردپذیری بخشی از یک مفهوم وسیع‌تر به نام «تجربه کاربری» هست و اشاره داره به سادگی دسترسی یا استفاده از یک محصول یا وبسایت خاص.
کاری که یه طراح رابط کاربری قبل از گرافیکی شدن وبسایت انجام میده اینه که کاربردپذیر بودنش رو با استفاده از ابزارهای نمونه‌سازی بارهای بار تست می کنه، تا مطمئن شه همه چیز همونجوری کار میکنه که کاربر انتظارش رو داره و میفهمه.
تست کاربردپذیری یکی از اون چیزهایی هست که باید خیلی بهش توجه ویژه داشته باشید. نتایجی که بعد از آزمایش به‌دست میاد اغلب براتون قابل پیش‌بینی نیست. (زمان سفارش یک پروژه خیلی مهمه که طراح رابط کاربری، بدونه تست کاربرد پذیری چی هست و برای شما توضیحاتی در این باره بده. باید بدونید تعداد زیادی طراح رابط کاربری هستند که این مفهوم تا حالا به گوششون نخورده!)
انواع رابط کاربری از نظر مدل پیاده سازی سه نوع عمده دارد:
اول. رابط کاربری سایت
اگر UI سایت بصورت درست و کارشناسی شده طراحی و پیاده گردد کاربران به راحتی خواهند توانست با سایت تعامل خوبی برقرار کنند. اما در غیر اینصورت حتی با وجود ساختار و محتوای ارزشمند در سایر بخش های سایت، نمی توان انتظار بازخورد مناسبی از تعمال کاربران با سایت داشت. برای اینکه بتوانیم UI مناسبی را طراحی و پیاده سازی کنیم می بایست بیش از همه به دنبال این باشیم که کاربران با چه رابط کاربری راحتتر هستند.
دوم. رابط کاربری موبایل
هر شرکت سازنده موبایل، رابط کاربری خاصی را بر روی محصول خود ارائه می کند. اگر توجه داشته باشید UI موجود در برخی گوشی ها چنان هوشمندانه و دقیق، طراحی و پیاده شده است که در هنگام استفاده از آن احساس خوبی به ما دست می دهد. اما اگر این موضوع رعایت نشود حس خوبی به کاربر منتقل نخواهد شد. توجه به راحتی، سبک طراحی، دسترسی بهتر و سریعتر از جمله مواردی هستند که می بایست در UI موبایل به آنها توجه شود.
سوم. رابط کاربری نرم افزارها
در واقع UI نرم افزارها و اپلیکیشن ها نماینده ای از سمت ساختار و محتوای آن است. به این معنی که در مراحل اولیه کار با آن، این حق را به کاربر می دهد تا در مورد کلیت نرم افزار اظهار نظر کرده و قضاوت کند. اگر نرم افزار یا اپلیکیشنی دارید که می خواهید بهترین UI ممکن را برای آن طراحی کنید به موارد زیر توجه داشته باشید:
- سبک طراحی متناسب با نرم افزار
- تعیین ابزارهای شاخص و پراهمیت
- دسترسی آسان به بخش های پراستفاده
- پرهیز از شلوغی بخصوص در اپلیکیشن های موبایل
- آنالیز رفتار کاربران و بهبود UI در آپدیت های بعدی
- آنالیز رقبا و استفاده از سبک های موفق
کاربران چه چیزی می خواهند؟
پاسخ به این سوال بسیار مهم و اساسی است. چرا که فلسفه وجودی UI برای کاربران است. اگر بدانیم کاربران واقعا چه چیزهایی می خواهند بخش مهمی از کار را با موفقیت انجام داده ایم. برای مثال:
- طرح ظاهری و الگوی گرافیکی
- سرعت و کارایی حداکثر
- دسترسی آسان به بخش های دیگر
- توجه به نیازهای آتی کاربران
جمع بندی:
اگر بخواهیم از اهمیت رابط کاربری بگوییم همین قدر بسنده میکنیم که اگر ظاهر سایت یا نرم افزار شما کاربران را جذب نکند، به شما مهلت اثبات دیگر بخش ها را نمیدهند.
فرض کنید برای یک قرارکاری مهم اطلاعات خود را به شدت تکمیل کرده اید. فرد متخصصی هستید و در کار خود حرف ندارید. حالا زمان جلسه کاری فرا رسیده. شما چه نوع لباسی بر تن میکنید؟! شما میدانید یک لباس نامناسب تمام معادلات آن جلسه را به ضرر شما تغییر میدهد. به این دلیل که لباس شما اولین چیزی است که به چشم می آید! رابط کاربری نیز اولین چیزی است که کاربر با آن سر و کار دارد و هیچ وقت نباید از اهمیت آن قافل شد