آیا شده که تابحال وارد یک وبسایت یا برنامه موبایل بشوید و بعد از چند دقیقه کار کردن با آن، با خودتان بگویید که "عجب سایت خوشگلی!"؟ اگر این اتفاق برای شما افتاده باشد شاید برایتان جالب باشد که دلیل این زیبایی را بدانید. می‌دانید؟ اگر نمی‌دانید من به شما می‌گویم: چیزی که باعث شده شما احساس خوبی نسبت به این وبسایت پیدا کنید رابط کاربری یا همان user interface آن وبسایت بوده است که در ادامه مقاله به جزئیات در موردش حرف می‌زنیم.
اول یک مثال ساده از رابط کاربری ببینیم!
فرض کنید که به یک رستوارن ایتالیایی خیلی شیک رفتید و بعد از دیدن منو یک پیتزا سفارش می‌دهید. بعد از کمی انتظار (که خیلی دردآور است!) غذای شما را می‌آورند. اولین چیزی که از این غذا می‌بینید چیست؟ قطعا ظاهر و بوی آن است: اینکه مواد پیتزا چقدر است و با چه ظرافتی روی خمیر قرار گرفته، پنیرش زیر مواد است یا روی آن، اصلا ضخامت خمیرش چقدر است و چه بویی می‌دهد.
آیا با دیدن این موارد در پیتزا می‌توانید طرز تهیه آن را هم ببینید؟ اینکه این مواد از کجا خریداری شده‌اند، چطور به رستوران آورده شده‌اند و کلا برای قرار گرفتن روی پیتزا، چه فرایندهایی را پشت سر گذاشته‌اند؟ طبیعتا نه! حالا این چطور می‌تواند به رابط کاربری ربط داشته باشد؟ ربطش خیلی واضح است! چیزی که شما از پیتزا دیدید در حقیت رابط کاربری بوده است! یعنی شما ظاهر و امکانات پیتزا را دیدید بدون اینکه از کارهای پشت پرده و آشپزخانه‌ای اطلاعاتی داشته باشید! رابط کاربری در وبسایت هم دقیقا همین شکلی است!
حالا رابط کاربری بصورت تخصصی چیست؟
هدف من از آوردن مثال بالا این بود که کمی مفهوم رابط کاربری در ذهن شما دوست عزیز ساده‌تر شود. اگر این اتفاق افتاده باشد (امیدوارم) وقتش رسیده که یک قدم رو به جلو برداشته و رابط کاربری را در یک سطح تخصصی‌تر و علمی‌تر بررسی کنیم.
شما با هر وسیله دیجیتالی که کار می‌کنید، با هر نرم‌افزاری که سر و کار دارید یا وارد هر وبسایتی که می‌شوید با محیطی خاص روبرو می‌شوید و کارتان را در این محیط انجام می‌دهید. مثلا زمانی که صفحه کامپیوتر خودتان را روشن می‌کنید روی آیکون کامپیوتر کلیک می‌کنید و وارد درایوهای سیستم می‌شوید و الی آخر. در علم دیجیتال و کامپیوتر، به این محیط "رابط کاربری" می‌گوییم.
حالا چرا رابط؟ چون اگر دقت کرده باشید این ویژگی رابطهای بین شما و سیستم شما برقرار می‌کند بدون اینکه شما از جزئیات این رابطه اطلاع داشته باشید. مثلا زمانی که شما روی علامت کامپیوتر کلیک می‌کنید یک سری کد به هسته کامپیوتر شما ارسال شده و دستور داده می‌شود که این بخش باز شود. اما آیا شما این کدها را می‌بینید؟ یا مستقیما خودتان کد می‌نویسید؟ نه!
پس خیلی خلاصه و مختصر مفهوم رابط کاربری را مرور کنیم تا بتوانیم وارد جزئیات آن بشویم: رابط کاربری در حقیقت همان محیطی است که شما در آن بدون نیاز به کدنویسی دستور خودتان را صادر می‌کنید! الان دیگر تقریبا تمام رابطهای کاربری در همه نرم‌افزارها و وبسایت‌ها کاملا گرافیکی (تصویری) شده است چون هر چه باشد درک و کار کردن با تصاویر خیلی راحت و جذاب است.
آیا رابط کاربری از اول همین بوده است؟ (تاریخچه رابط کاربری)
چیزی که من و شما امروز به عنوان رابط کاربری در وبسایت‌ها و نرم‌ازارها و تلفن‌های هوشمندمان می‌بینیم با حالت اولیه رابط کاربری زمین تا آسمان فرق دارد! در این قسمت تحول و تکامل رابط کاربری را برای شما توضیح می‌دهم تا ببینید که چقدر سریع پیشرفت کرده‌ایم:
دوره اول: رابط کاربری دسته‌ای
اگر به شما بگویم که زمانی کامپیوترها صفحه نمایش نداشتند باورتان می‌شد؟ بله واقعا اینطور بوده است. تنها چیزی که شما به عنوان کامپیوتر می‌دیدید صفحه‌ای به شکل صفحه کلید بود که با استفاده از آن شما دستوری را به صورت دستی وارد سیستم می‌کردید و "کامپیوتر" هم خروجی خودش را روی کاغذ برایتان پرینت می‌کرد!
در این نوع از سیستم تنها رابط کاربری که شما با آن سر و کار دارید همان صفحه کلید دستور و شکل ظاهری دستگاه است که راستش را بخواهید چنگی به دل نمیزند!
دوره دوم: رابط کاربری خط فرمان
با به وجود آمدن این نوع رابط کاربری است که دنیای دیجیتال یک قدم به شکل امروزی خودش نزدیک شد. این نوع از رابط کاربری یک صفحه نمایش برای شما نشان می‌دهد و از شما می‌خواهد که دستورتان را بصورت کد وارد کنید. اگر به کدنویسی مسلط بوده و دستور درستی را وارد می‌کردید دستور شما توسط سیستم انجام شده و نتیجه آن هم از طریق همان صفحه نمایش به شما نشان داده می‌شد.
رابط کاربری خط فرمان حتی امروز هم در سیستم‌های مدرن وجود دارد و برنامه‌نویسان خیلی از آن استفاده می‌کنند. اگر می‌خواهید از این نوع رابط کاربری استفاده کنید خیلی راحت می‌توانید گزینه استارت ویندوز را باز کرده و عبارت "command" را آنجا تایپ کنید و روی آیکون آن کلیک کنید.
محیطی که در این عکس می‌بینید همان رابط کاربری از نوع خط فرمان است که فقط با ورود کد صحیح کار می‌کند.
دوره سوم: رابط کاربری گرافیکی
قطعا همه شما با این نوع از رابط کاربری آشنا هستید. اصلا همین که الان با کامپیوتر یا موبایل دارید این مطلب را می‌خوانید در حقیقت در محیط رابط کاربری گرافیکی هستید. در این نوع رابط کاربری، همه دستورات با استفاده از شکل برای شما نشان داده می‌شوند و هیچ نیازی نیست که شما برای اجرای یک دستور کدنویسی بکنید.
مثال رستوران در اول مقاله یادتان است؟ که شما پیتزا را دیدید ولی هیچ اطلاعاتی از کارهای پشت پرده نداشتید. در اینجا هم قضیه همان است: شما پیتزا را که وبسایت است جلوی خودتان می‌بینید و فقط با چند کلیک در صفحات مختلف آن می‌گردید و کارهای مختلفی انجام می‌دهید اما هیچ چیزی در مورد ارسال و انجام شدن کدهای دستوری نمی‌بینید!
در ایجاد رابط کاربری چه اصولی را بهتر است رعایت کنیم؟
اینکه شما چه نوع رابط کاربری و چه نوع ظاهری برای وبسایت خودتان انتخاب کنید به نوع وبسایت و کاربران شما بستگی دارد. یعنی چه؟ منظورم این است که کاربران همه وبسایت‌ها یکی نیستند و اگر می‌خواهید به عنوان شخصی که یک وبسایت دارید موفق شوید حتما باید نیازها و اهداف کاربران‌تان را بدانید.
مثلا شما این دو وبسایت را در نظر بگیرید: وبسایت اول برای یک وکیل است که مطالب حقوقی روی وبسایتش قرار داده و نوبت دهی را از آنجا انجام می‌دهد. وبسایت دوم هم یک وبسایت سفارش غذای آنلاین است. به نظر شما ظاهر این دو وبسایت (یا رابط کاربری آن‌ها) باید یکی باشد؟ قطعا نه. اما این به این معنی نیست که همیشه شما باید از صفر شروع کنید چراکه رابط کاربری یک سری اصول دارد که اگر آن‌ها را رعایت بکنید احتمال زیبایی و موفقیت وبسایت‌تان بیشتر خواهد شد. این اصول را در ادامه همین مطلب برای شما آماده کرده‌ام:
سعی کنید ساده باشید!
موفق‌ترین رابط کاربری رابطی است که اصلا خودش را به چشم کاربر نمی‌آورد! حالا چه نوع رابطی می‌تواند ساده باشد؟ خیلی کلی بخواهم بگویم اگر از عناصر غیرضروری مثل تصاویر و پیام‌های نافهموم استفاده نکنید و همچنین زبان محتوا و راهنمای وبسایت‌تان مشخص و ساده باشد می‌توانید بگویید که یک رابط کاربری ساده دارید. اصلا اینطور بگویم که اگر کاربری برای اولین بار وارد وبسایت شما شد باید خیلی راحت بتواند محتوای مورد نظرش را پیدا کرده و بین صفحات شما بگردد.
صفحه‌تان را هدفمند بچینید!
در طراحی رابط کاربری یک صفحه شما فضایی محدود دارید و بخش بزرگی از زیبایی و جذابیت وبسایت شما بستگی به این دارد که شما چطور از این فضا استفاده می‌کنید. مثلا شما باید در چیدمان بخش‌های مختلف سایت (چه از بالا به پایین و چه از راست به چپ) اولویت‌شان را در نظر داشته باشید تا کاربری که در وبسایت شما دنبال اطلاعات است خیلی راحت به هدفش برسد.
قدرت رنگ و فونت را دست کم نگیرید!
جذاب‌ترین بخش رابط کاربری گرافیکی، رنگ و لعاب آن است! شما اگر بتوانید از رنگ‌ها و فونت‌های مختلف به طرز درستی استفاده کنید قطعا جذابیت سایت‌تان را تا چندین برابر افزایش خواهید داد. همچنین این موارد می‌توانند به شما کمک کنند که توجه کاربران را به سمت خاصی بکشانید و حتی آن‌ها را بیشتر در سایت‌تان نگه دارید.
خب، حرف آخر...؟
در این مقاله بصورت خلاصه اما مفیدی وارد بحث رابط کاربری شدیم و با مثال و تعریف فهمدیدم که رابط کاربری چیست. چیز مهمی که اینجا می‌خواهم برایتان بگویم بحث "تجربه کاربری" است که ممکن است برایتان آشنا باشد. متاسفانه اکثر افراد این دو را بصورت اشتباه به جای هم استفاده می‌کنند اما این دو تفاوت دارند. اگر به این بحث هم علاقه داشته باشید نگاهی به مقاله تجربه کاربری بیندازید.
اگر سوال یا نظری در مورد این مطلب یا مطالب دیگر بلاگ ما دارید حتما به ما هم بگویید!
