CMS، SMO، SERP، OMG! پسر، آیا صنعت فناوری کلمات اختصاری خود را دوست دارد؟ اما برای طراحان و افرادی که با طراحی دیجیتال خود کار می کنند، UX و UI گیج کننده ترین به نظر می رسد زیرا نه تنها یک حرف از هم فاصله دارند، بلکه مفاهیم مرتبط با هم هستند. وقتی به UX در مقابل UI نگاه می کنیم، بسیار مهم است که بدانیم کدام کدام است، زیرا علیرغم نگرانی های همپوشانی، هر کدام مشکلات خاص خود را دارند – و رفع یکی دیگر را حل نمی کند.
در این راهنما، ما UX در مقابل UI را بررسی می کنیم تا سردرگمی را برطرف کنیم و توضیح دهیم که کدام یک است تا بتوانید هر دو را برای وب سایت یا برنامه خود بهینه کنید. درک تفاوت بین UX و UI بسیار مهم است، زیرا برای بهترین نتایج فقط نیازی به تسلط بر یکی یا دیگری ندارید، بلکه باید هر دو را بدانید.
طراحی UI چیست؟
–
UI به چه معناست؟ UI مخفف رابط کاربری و به کنترل‌ها، دکمه‌ها یا هر چیزی که برای تعامل (مانند میکروفون یا کنترل حرکتی) برای وب‌سایت‌ها، برنامه‌ها و بازی‌های ویدیویی استفاده می‌شود اشاره دارد. بنابراین، طراحی رابط کاربری نحوه طراحی کنترل‌های خود است، مانند قرار دادن دکمه‌ای شبیه قلب در پایین تصویر یا اینکه کاربران برای باز کردن آن روی یک برگه کشویی قرار بگیرند.
طراحی UI برای هر محصول دیجیتال تعاملی اساسی است. شما می خواهید یک رابط طراحی کنید که خود توضیحی باشد به طوری که حتی کاربران جدید نیز بتوانند نحوه استفاده از آن را درک کنند. در عین حال، می‌خواهید رابط کاربری را محجوب کنید تا کنترل‌ها مانع محتوای واقعی نشوند (به صفحه‌کلیدهای گوشی‌های هوشمند فکر کنید که فقط زمانی که نیاز به تایپ چیزی دارید ظاهر می‌شوند).
برای کمک به کاربران برای درک سریع کنترل‌ها، اکثر طراحی‌های UI بر به اصطلاح «الگوها» تکیه می‌کنند، که به سادگی استانداردها و مشترکات بین سایت‌ها، برنامه‌ها و غیره هستند. یکی از محبوب ترین الگوهای رابط کاربری استفاده از نماد ذره بین برای نوارهای جستجو است – به محض دیدن این نماد هر کجامیدونی یعنی چی
الگوهای UI همچنین می توانند به توابع اشاره کنند. آیا متوجه شده اید که اکثر وب سایت ها لوگوی خود را در گوشه بالا سمت چپ قرار می دهند و اگر روی آن کلیک کنید، شما را به صفحه اصلی باز می گرداند؟ این مدل رابط کاربری تضمین می کند که حتی اگر برای اولین بار در یک سایت هستید، در صورت گم شدن می توانید صفحه اصلی را پیدا کنید. الگوهای UI به سادگی انتخاب های کنترل معمولی را کپی می کنند تا کاربر بتواند فورا آنها را تشخیص دهد.
همچنین در مورد ظاهر اینترفیس که با طراحی رابط کاربری همخوانی دارد، حرف های زیادی برای گفتن وجود دارد. طراحان می توانند کنترل هایی را ایجاد کنند که با حال و هوای سایت یا برنامه مطابقت داشته باشد، مانند استفاده از رنگ های برند یا استفاده از تایپوگرافی امضای برند در صورت نیاز.
اما در مورد انتخاب‌های طراحی که بر نحوه استفاده افراد از سایت تأثیر می‌گذارد، مانند دکمه‌هایی که از رنگ‌های روشن استفاده می‌کنند یا انیمیشن‌هایی که مورد توجه قرار می‌گیرند، چطور؟ اینجاست که UI شروع به ورود به قلمرو UX می کند و تفاوت ها شروع به محو شدن می کنند…
طراحی UX چیست؟
–
UX به چه معناست؟ UX مخفف تجربه ی کاربر و به احساس مردم هنگام استفاده از یک سایت یا برنامه اشاره دارد. در واقع، UX را می توان برای هر چیزی اعمال کرد، حتی محصولات غیر دیجیتال، اما برای این مقاله ما فقط بر روی سایت ها و برنامه ها تمرکز می کنیم.
درک طراحی UX کمی سخت تر است زیرا انتزاعی تر است. در حالی که طراحی UI با جنبه های ملموس تر و مطلق تر سروکار دارد، UX با جنبه احساسی چیزها سروکار دارد. آیا استفاده از این سایت یا برنامه آسان و شهودی است؟ آیا کاربر وقتی نمی تواند آنچه را که به دنبالش است پیدا کند، احساس ناامیدی می کند؟
یکی از مهم‌ترین بخش‌های طراحی UX، پیش‌بینی کاری است که کاربر انجام خواهد داد و طراحی کل سایت/اپلیکیشن پیرامون آن. به عنوان مثال، سایت‌های رسانه‌های اجتماعی مانند اینستاگرام حول محور تعامل کاربران با محتوای دیگران می‌چرخند، بنابراین فضای صفحه نمایش بیشتری به مشاهده تصاویر اختصاص می‌یابد.
این پست اینستاگرام را ببینید
دیدن تصاویر بزرگ و کنترل‌های کوچک در رسانه‌های اجتماعی آنقدر رایج است که فراموش می‌کنیم این یک تصمیم عمدی طراحی است.
در عین حال، فضای بسیار کمی از صفحه نمایش به اقدامات کمتر محبوب، مانند تغییر تنظیمات برگزیده کاربر اختصاص داده می شود، که فقط با مراجعه به نمایه خود می توانید این کار را انجام دهید. یکی از اصول اصلی طراحی UX این است که اقدامات معمول را آسان کنید، با یک یا دو کلیک، اقدامات کمتر رایجی را قربانی کنید که می توانید برای صرفه جویی در فضا پشت منوهای دیگر پنهان کنید.
به عبارت دیگر، طراحی UX می‌تواند با تأکید بر برخی اقدامات و کاهش برخی اقدامات، بر کاری که کاربر انجام می‌دهد تأثیر بگذارد. اکثر وب‌سایت‌های تجاری برای جلب توجه و جذب کلیک‌های بیشتر از تصاویری روشن برای دکمه‌های فراخوان (مانند «ثبت‌نام اینجا») استفاده می‌کنند. با این حال، اطلاعات حقوقی و کپی رایت اغلب در پایین صفحه قرار می گیرد و با متنی کوچک و بدون توصیف نوشته می شود تا حواس کاربر را پرت نکند.
البته، دستکاری طراحی کنترل‌ها برای تسهیل اقدامات خاص، هم UI و هم UX را در بر می‌گیرد، بنابراین می‌توانید متوجه شوید که سردرگمی از کجا ایجاد می‌شود.
تفاوت بین UX و UI چیست؟
–
بدون در نظر گرفتن مناطق همپوشانی، UX و UI فیلدهای جداگانه ای هستند. حتی در هنگام مواجهه با مشکلات مشابه، مانند قرار دادن کنترل‌ها، UX و UI رویکردهای متفاوتی با اولویت‌های متفاوت دارند.
طراحی UI فنی تر از این دو است. با ظاهر و قرار دادن کنترل‌ها سروکار دارد، اگرچه ترجیحات کاربر (که تحت UX قرار می‌گیرند) همچنان باید بر این جنبه‌ها تأثیر بگذارد. با این حال، طراحی رابط کاربری بیشتر به عناصر کمی مربوط می شود، مانند اینکه یک دکمه باید چند پیکسل عرض داشته باشد یا کد رنگی دقیقی که برای دکمه استفاده شود.
به همین ترتیب، طراحی UX با جنبه احساسی چیزها، عناصر کیفی سروکار دارد. طراحی UX بر ساده‌سازی استفاده با توجه به نیازهای کاربر (یا آنچه مدیران سایت/برنامه می‌خواهند بر آن تأکید کنند) تمرکز دارد. UX بیشتر به انتزاعی مربوط می شود، مانند اینکه چگونه تعاملات را تا حد امکان بدون دردسر انجام دهیم.
روش های طراحی نیز متفاوت است. طراحی رابط کاربری ساده تر است. طراحان با علامت گذاری ویژگی های خاص مانند انیمیشن ها یا پنهان کردن آنها، الگوهای آیکون و کنترل را ایجاد می کنند. از طرف دیگر، طراحی UX بیشتر دوربرگردان است. طراحان باید چندین سناریو و جریان کار را برنامه ریزی کنند و طراحی UX را به یک عمل محبوب تبدیل کنند.
حتی زمانی که UI و UX با یک زمینه سروکار دارند، هر کدام مشکلات متفاوتی دارند. به عنوان مثال طراحی یک دکمه را در نظر بگیرید. اگر طراحی UI عرض پیکسل یک دکمه را انتخاب کند، طراحی UX پوشش می دهد که آیا دکمه خیلی کوچک است که کاربر نمی تواند ببیند یا خیلی بزرگ است که با محتوای اولویت بالاتر تداخل داشته باشد.
اکنون، برای دانستن اندازه پیکسل ایده آل برای یک دکمه (طراحی UI)، باید ترجیحات کاربر (طراحی UX) را بدانید. و برای ارضای نیازهای کاربر (طراحی UX) باید با دقت و فعالانه رابط (طراحی UI) را بسازید. بنابراین، همانطور که می بینید، طراحی UX و UI با هم کار می کنند، نه در برابر یکدیگر.
نحوه کار UX و UI با هم
–
با وجود تمام صحبت هایی که در مورد دشمنی UX و UI وجود دارد، اغلب آنها به عنوان شریک کار می کنند. ثمرات طراحی UX، مانند دانستن آنچه کاربر دوست دارد، انتخاب های انجام شده در طراحی UI را دیکته می کند. دانستن نحوه قرارگیری و ظاهر عالی کنترل‌ها، نه اینکه بگوییم کدام کنترل‌ها باید پنهان یا اولویت‌بندی شوند، مستلزم درک طراحی UI و UX است.
بیشترین همپوشانی UX و UI این است که رابط را تا حد امکان راحت می‌کند – شما نمی‌خواهید کاربرانتان زیاد فکر کنند یا مجبور به حرکت بیش از حد باشند. بیشترین استفاده از کنترل ها باید به راحتی در دسترس و محجوب باشند و اهداف UX و UI را برآورده کنند. آخرین روند در طراحی UX به این سمت اشاره دارد.
هنگام طراحی کنترل ها، باید اهداف UI و UX را در نظر داشته باشید. به عنوان مثال، در برنامه های تلفن و نسخه های تلفن همراه وب سایت ها، دکمه ها و کنترل ها اغلب در پایین قرار می گیرند. دلیل آن این است که هنگام نگه داشتن گوشی، این ناحیه به انگشتان شست نزدیک‌تر است و فشار دادن دکمه‌ها را آسان‌تر می‌کند که به نفع UX است. دکمه‌ها نیز باید به‌گونه‌ای طراحی شوند که متناسب با این ناحیه باشند، مثلاً به اندازه‌ای کوچک باشند که مانع ایجاد نشوند، یا در یک منوی مخفی قرار گیرند که در صورت نیاز قابل بازیابی باشد – که تصمیم طراحی رابط کاربری است.
استفاده از الگوهای ذکر شده در بالا اغلب برای هر دو زمینه کار می کند. برای UX، کاربر نیازی به یادگیری کنترل های جدید یا نگرانی در مورد نحوه انجام عملکردهای خاص ندارد. برای رابط کاربری، اصول اولیه نحوه ظاهر و عملکرد کنترل‌ها قبلاً تنظیم شده است، اما با انعطاف‌پذیری کافی که به طراح اجازه می‌دهد آنها را منحصربه‌فرد کند.
برای ارضای UI و UX، سعی کنید کاربر نهایی خود را درک کنید. مثل همیشه، این با تست واقعی کاربر به جای استفاده از حدس و گمان موثرتر است. تست تقسیم می‌تواند تعیین کند که چه طرح‌بندی‌ها یا تصاویری با نوع خاص کاربر شما بهتر کار می‌کنند، در حالی که تماشای شرکت‌کنندگان در استفاده از نمونه اولیه می‌تواند بینشی درباره نحوه فکر کاربران شما یا جایی برای بهبود ارائه دهد.
حداقل، می‌توانید با گروه کاربری خاص خود گفت‌وگو کنید، چه در حال برنامه‌ریزی رسمی یک جلسه حضوری باشید و چه به طور تصادفی یک سؤال باز در رسانه‌های اجتماعی بپرسید. وقتی صحبت از طراحی UX در مقابل طراحی UI به میان می آید، اگر برای کاربر طراحی می کنید، تفاوت ها کمتر اهمیت دارد.
خلاصه UX در مقابل UI
–
برای مرجع سریع، در اینجا خلاصه ای از UX در مقابل UI آمده است
- UI مخفف رابط کاربری است. طراحی UI با طراحی فنی دکمه ها، کنترل ها و هر چیز دیگری برای تعامل سروکار دارد.
- UX مخفف تجربه کاربری است. طراحی UX آنچه را که کاربر هنگام تعامل احساس می کند، مانند ترجیحات و آنچه متوجه می شود، مدیریت می کند.
- طراحی رابط فیزیکی تحت طراحی رابط کاربری قرار می گیرد، اما باید تحت تأثیر UX باشد، مانند اینکه کاربر چگونه فکر می کند یا چه احساسی در مورد طراحی رابط دارد.
- پیش‌بینی اقدامات کاربر و تسهیل آنها تحت طراحی UX قرار می‌گیرد، اما ذاتاً تحت تأثیر رابط کاربری، مانند ظاهر و چیدمان رابط است.
- بهترین راه برای ارضای طراحی UX و UI، درک گروه کاربر هدف است: ترجیحات، رفتارها، عادات و طرز فکر آنها. این به طور موثر با آزمایش کاربر به دست می آید.
به طراحی UX یا UI ممتاز برای وب سایت خود نیاز دارید؟
برای تحقق آن با طراحان با استعداد ما همکاری کنید.
بیا بریم!
پست UX در مقابل UI: تفاوت چیست؟ و چگونه با هم کار می کنند؟ اولین بار در 99طراحی ظاهر شد.