UI و UX

منظور از UI و UX در طراحی سایت چیست؟

 UI و UX دو اصطلاح مهم و جذاب در دنیای طراحی سایت و فناوری است. در واقع یو آی و یو ایکس در مورد کاربری سایت صحبت می کنند. واژه UI مخفف عبارت “User Interface” و به معنی رابط کاربری می باشد. واژه‌ی UX نیز مخفف عبارت “User Experience” و به معنی تجربه‌ کاربری است.

بدون شک برایتان اتفاق افتاده که صدا و واژه ای را بشنوید و یک موضوع در ذهن شما تداعی شود. به عنوان مثال نوای ربنای استاد شجریان، همه ما را به یاد زمان افطار و ماه مبارک رمضان می اندازد. واژه های UI و UX نیز به طور ناخودآگاه ذهن را به سمت طراحی سایت سوق می دهد.

با مفاهیم UI و UX آشنا شوید:

در ابتدا بیایید کمی بیشتر با مفهوم این دو اصطلاح آشنا شویم:

  • UI به چه معناست و هدف آن چیست؟

UI مخفف عبارت User Interface  به معنی رابط، واسط یا نمای کاربری است. از UI به عنوان رابط کاربری نام برده می شود. رابط کاربری شامل المان‌ های بصری یا دیداری یک محصول می‌شود. UI یا رابط کاربری در وبسایت، شامل تمام المانهای تصویری مثل رنگ بندی ها، ریسپانسیو، طراحی، جای لینک ها، دکمه ها و به طور کل ترتیب و ظاهر تمام آنچه که در یک سایت میبینید، می شود.

طراحی و ساخت UI با UI Designer‌‌ است. UI Designer‌‌ فردی است که به علم طراحی آگاه است.  طراح UI یا UI Designer‌‌ها مسئول ایجاد یکپارچگی و زیبا سازی ظاهری تمام صفحات سایت از جمله طراحی صفحه اول سایت و عناصر وابسته به آن هستند. طراحی UI یک محصول، به سلیقه UI Designer‌‌ بستگی دارد.

UI فقط مختص به وبسایت ها نیست. طراحی هر چیزی مثل طراحی یک کالا، یک محصول،یک برنامه و …. مربوط به اجرای UI است.

  • UX به چه معناست و هدف آن چیست؟

UX مخفف عبارت User experience است. در واقع به تجربه کاربری اتلاق می شود. این فرایند به نحوه تعامل کاربر با محصول یا بهینه سازی یک محصول برای استفاده کاربردی تر یا راحت تر است. به عنوان مثال این 2 فنجان را در نظر بگیرید.

UI UX

 

استفاده از کدام یک برای شما راحت تر است؟ سمت راست یا سمت چپ؟ فنجان سمت چپ، بسیار شیک و با طراحی فانتزی و نوین است. خلاقیت طراحی آن از نگاه بسیاری از افراد جذاب خواهد بود. این طراحی مورد تایید، حاصل خلاقیت یک طراح UI است. بسیار چشم نواز است. اما استفاده از فنجان سمت راست برای همه ما راحت تر است. زیرا با قلاب کردن انگشت در دسته آن، جای آن را در دست محکم کرده و از خود و چای داغ داخل آن محافظت خواهیم کرد. در حالی که احتمال سر خوردن فنجان سمت چپ از بین انگشتان بسیار بالاست. از این رو می توان گفت UX فنجان سمت راست بسیار بهتر از فنجان خلاقانه ماست. این یعنی تمام طراحی ها با UI خوب، UX خوبی ندارند.

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

UX بر اساس معیارهای زیر ارزیابی می شوند:

۱- میزان ارزشمندی سایت یا Value

۲- عملکرد یا Function

۳- قابلیت استفاده آسان یا Usability

۴- تایید نهایی کلی یا General impression

Ux desing به چه کسی می گویند؟

طراح UX یا UX designer به کسی می گویند که بتواند یک طراحی خلاقانه برای استفاده کاربردی بهتر برای یک محصول، برنامه یا سایت معرفی کند. مهارت و کیفیت کار UX designer زمانی مشخص می شود که در طراحی کار خود، سلیقه شخصی را در نظر نگیرد. بلکه می بایست راهکاری برای ایجاد حس بهتر در مخاطب برای کار با سایت خلق کند.

تاریخچه طراحی UX

برای نخستین بار در دهه نود میلادی و توسط دونالد نورمن این اصطلاح عنوان شد. دونالد نورمن در شرکت اپل به عنوان دانشمند شناختی کار می‌کرد.

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

مثالی ساده برای معرفی UX

بگذارید یک مثال ساده برایتان بزنیم. زمانی که سس سالاد به اتمام می رسد، بخشی از آن کف ظرف یا روی دیواره ها می ماند. هر چه ظرف را تکان بدهید، سس از آن خارج نمی شود. اگر یه قاشق بردارید و آن را جمع کنید، می بینید حجم زیادی از سس را نتوانسته اید به راحتی استفاده  کنید. در نتیجه دور انداخته می شود. بنابراین تجربه کاربری خوبی از ظرف سس سالاد دریافت نکرده اید.

یکی از شرکت های تولید کننده سس سالاد در داخل کشور، یک شعار تبلیغاتی جالب داشت: ” استفاده تا قطره آخر” احتمالا این تبلیغ را در پیامهای بازرگانی داخلی دیده اید. این شرکت با کمی تغییر در جنس پلاستیک ظرف و تغییر در ابعاد در آن، باعث شد تا کاربر بتواند سس را به صورت وارونه در یخچال یا روی میز قرار دهد. در این صورت با توجه به جنس ظرف، سس باقی مانده از کف و دیواره ها، سر می خورد و به سمت در سرازیر می شود. در نتیجه به راحتی می توانید سس باقی مانده در ظرف را تا قطره آخر استفاده کنید.

 این سبک طراحی در بسیاری از محصولات و کالاهای خارجی و ایرانی مثل انواع شامپو ها، لوازم آرایشی و بهداشتی نیز دیده می شود.

UX

 

آشنایی با مفاهیم UI و UX در دنیای طراحی سایت

سایت های مختلفی که وارسی کرده اید را به یاد بیاورید. برخی از آنها به لحاظ ظاهر و رنگ بندی در نگاه اول برایتان خیلی جذاب بودند. اما کار کردن با برخی از آنها برای شما راحت تر بوده و زودتر به مقصد رسیده اید. سایت هایی هم بوده اند که در کنار ظاهر جذابشان، کاربری خوبی داشته اند. در این میان، شما کدام یک را می پسندید؟

قطعا مورد سوم از نظر همه مورد تایید است. یک وبسایت می‌تواند هم از لحاظ ظاهری زیبا و جذاب باشد، و هم احساس خوبی در کاربر ایجاد کند. بنابراین می توان گفت طراحی UI بخشی از زیر مجموعه طراحی UX است. در اکثر مواقع زمانی که کاربر با مشکل طراحی تجربه کاربری نامناسب روبرو شود، از آن برنامه یا وبسایت راضی نیست. به عنوان مثال فردی وارد یک سایت فروشگاهی شده و قصد خرید دارد. سایت های فروشگاهی مختلف، محصولاتشان را به شکل های مختلفی دسته بندی می کنند. برخی از سایت ها محصولات خود را با مگا منو دسته بندی می کنند. این کار مخاطب را گیج کرده و برای دیدن محصولات، باید صفحات مختلف را بگردد. در حالی که برخی از سایتها، محصولاتشان را به نوعی دسته بندی می کنند که مخاطب از طریق نوار منو، به زیر مجموعه ها دسترسی خواهد داشت.

شباهت UI و UX در چیست؟

UI و UX به 2 مقوله مجزا از هم تمرکز دارند. اما می توان UI یا رابط کاربری را بخشی از UX دانست. در واقع مشخص کردن دسترسی ها برای تجربه کاربری بهتر، بخشی از UI را نیز درگیر می کند. طراح باید بداند که چه روشی را با چه شکل و شیوه ای و با چه ترکیب رنگی در کجای سایت قرار دهد تا مخاطب بهترین تجربه کاربری را از سایت داشته باشد.

 طراحی UI و UX در 6 بخش اصلی دسته‌بندی می شود:

  • محتوای مناسب و کاربردی

مهمدترین دلیلی که یک فرد به سایتی مراجعه کند، محتوایی است که نیاز او را پاسخگو باشد. این نیاز می تواند یک موضوع علمی باشد یا یک خرید آنلاین. از این رو اولین نکته ای که در طراحی UI و UX باید در نظر گرفته شود، نیاز کاربر و تلاش برای رفع آن است. به تولید محتوایی که بارگذاری می کنید، توجه ویژه داشته باشید.

  • طراحی ظاهری زیبا و جذاب

فراموش نکنید، سایت شما، معرف شماست. این سایت ویترینی از خدماتی است که شما ارائه می دهید. 2 فروشگاه لباس را در نظر بگیرید. یکی بسیار ساده و بدون نور پردازی و دیگری، لوکس با دکوراسیون جذاب و نور پردازی مدرن. تمایل دارید از کدام یک خرید کنید؟ ممکن است لباس مورد نظر شما در بوتیک اول باشد. و شما به ناچار به آن مراجعه کنید. اما قطعا ته دلتان تمایل داشتید سری به فروشگاه دوم بزنید. این در حالی است که خیلی از افراد حتی تمایلی ندارند که به بوتیک اول سر بزنند. بنابراین ظاهر ویترین آنلاین، برای جذب مخاطب خیلی مهم است.

طراحی زیبا و چشم نواز، صفحه بندی اصولی و منظم، رنگ‌بندی صحیح، نظم و آراستگی ظاهری، استفاده از المان ها و تصاویر گرافیکی با کیفیت و جذاب، استفاده از فونت‌ های مناسب و … می تواند مخاطب شما را جذب کند. جذب مخاطب احتمال افزایش کاربر و درامد بیشتر را ایجاد می کند.

  • طراحی کاربری برای استفاده بهتر

بسیاری از سایتها، چهره جذاب و زیبایی دارند. تمام اصول زیبا شناختی در آن رعایت شده است. اما کاربر را برای دسترسی به اطلاعات، گیج می کند. مثلا نمیتواند موضوع مورد نظر را در سایت سرچ کند، یا اسکرول راحتی در سایت برای او تعبیه نشده است. یا نمی تواند به راحتی به صفحه اول سایت باز گردد و مجبور است که مدام بک بزند. این ضعف در طراحی UX کاربر را منزجر کرده و تجربه‌ کاربری خوبی برای او ایجاد نخواهد کرد.

قرارگیری المانهایی مثل سرچ یا جای مشخص و صحیح برای دکمه‌ها، دسته‌ بندی و ساختار مناسب برای محتوا، نام گذاری اصولی و استاندارد برای صفحات، روشهایی برای بالا بردن سرعت دسترسی، قالب‌بندی اصولی و … باعث می شود تا کاربر راحت تر با سایت شما ارتباط بر قرار کند. در نتیجه تجربه‌ کاربری خوبی در او ایجاد می شود.

  • معتبر بودن محتوا

معتبر بودن محتوایی که بار گذاری کردید، مورد مهمی است که مخاطب شما را حفظ می کند. ممکن است سایت شما UI قدرتمندی داشته باشد. مخاطب در نگاه اول جذب شود. اما به علت یک محتوای بی کیفیت و بی اعتبار، کاربر خیلی زود از سایت شما خارج شده و اعتنایی به آن نمی کند. یک ویترین شیک ولی با محصول بی کیفیت، هیچ وقت فروش خوبی نخواهد داشت. برای یک تولید محتوای با کیفیت، تلاش کنید.

  • بازاریابی کاربردی

بازاریابی برای معرفی سایت خود به مخاطبین، نکته مهمی است که مخاطبین را به سمت شما روانه می کند. یک سایت خوب، سایتی است که شناخته شده باشد. و اولین نام برای انتخاب باشد. به عنوان مثال، گوگل، دیجی کالا، ورزش 3 و … جز سایت هایی هستند که شناخته شده اند و اولین گزینه انتخابی هستند. در کنار آن سئو خوب سایت می تواند یک روش برای رتبه بندی سایت شما و قرار گرفتن آن در لول بالای موتورهای جستجو باشد. این امر، اعتماد کاربر و حس یک تجربه کاربری ایده آل را به مخاطب می بخشد.

  • کاربردی بهینه

سرویس شما هرچقدر هم باکیفیت، معتبر و زیبا باشد ولی کاربر نتواند به صورت کاربردی از آن استفاده کند تجربه‌ خوبی در کاربر ایجاد نخواهد کرد. قرارگیری صحیح دکمه‌ها، دسته‌بندی و ساختار مناسب برای محتوا و قالب‌بندی وبسایت، نام‌گذاری مناسب و صحیح صفحات و… می‌تواند احساس خوبی را به کاربر منتقل کرده و در نتیجه تجربه‌ کاربری خوبی را در وی ایجاد کند.

  • در دسترس بودن

سایت شما در وهله اول باید در دسترس مخاطب قرار بگیرد. هر چقدر بر روی UI و UX آن کار کنید ولی در دسترس نباشد، ارزشی برای مخاطب ایجاد نمی کند. به عنوان مثال شما کلی لباس زیبا برای فروش دارید. اما آنها را در کمد پنهان کرده اید. قطعا کسی آنها را نمی بیند تا بخواهد بخرد. در نتیجه خیلی مهم است که سایت شما همیشه در دسترس مخاطب باشد. خطای 500، خطای 404 و ایردات سروری می تواند کیفیت کار شما را به مخاطره بیاندازد.

آیا UX بر روی سئو تاثیر می گذارد؟

قطعا همین طور است. اگر به شش الویت و دسته بندی بالا توجه کرده باشید، خواهید دید که UX موضوع مهمی است. اولین تاثیر یک UX خوب در جذب مخاطب است. همانطور که در مقاله “سئو چیست” گفته ایم، هر چه مخاطبین بیشتری به سایت شما مراجعه کنند، گوگل سایت شما را به عنوان یک سایت معتبر و پر طرفدار می پذیرد. در نتیجه، رتبه سایت شما افزایش می یابد. هر چه حضور کاربر در فضای سایت و زمان ماندنش در صفحات بیشتر باشد، رتبه سایت بالاتر خواهد رفت. این ماندگاری، در گرو یک UX خوب و کاربردی است.

در نهایت UI و UX چه تفاوتی با هم دارند!

تفاوت UI و UX در تصویر زیر کاملا مشخص است. طراح UI وظیفه دارد بهترین و زیبا ترین مسیر را خلق کند، طراحی او باید ارزش بصری داشته باشد و بیننده از دیدن آن لذت ببرد. اما گاهی همه چیز محدود به زیبایی نیست. در این جا طراح UX با توجه به الویت ها و در نظر گرفتن یک مسیر کاربردی تر مسیر را شکل بدهد.

طراحی UI و UX

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

یکی دیگر از تفاوت های بارز بین UI و UX این است که در طراحی UI، کد نویسی و زبان های برنامه نویسی دخیل هستند. در حالی که در UX فقط مشخص می کنید کدهای مشخص شده در کجا قرار بگیرند.

از کجا بدانیم که UI و UX ما خوب یا بد است؟

گاهی تشخیص UI و UX  خوب از بد خیلی هم راحت نیست. اما ساده ترین حالت برای تشخیص آن میتواند عکس زیر باشد.

UI و UX خوب

 

ظاهرا هدف هر دو فرم دیجیتال یکی است. اما کاربر با فرم سمت چپی احساس راحت تری دارد. و راحت تر فرم را پر می کند. فرم سمت راستی کمی پیچیده به نظر می آید؛ حتی اگر واقع پیچیده نباشد. در تصویر سمت چپ نوار اسکرول نیز به راحتی در دسترس کاربر قرار گرفته است.

همچنین، اگر در تصویر زیر نگاه کنید، هر دو سایت یک نوع امکانات را در اختیار کاربر قرار داده اند. اما نمونه سمت راست نظم و نظام مشخص تری دارد. در نتیجه بیننده را گیج نمی کند. ضمن آنکه به جزئیات بیشتری اشاره کرده است.

UI و UX خوب 2

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *