ui-ux-designing

آشنایی با رابط کاربری (UI):

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

به طور کلی رابط کاربری همان ظاهر سایت یا اپلیکیشن و یا … می باشد که باعث ارتباط انسان (کاربر) با نرم افزار می شود.

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

نوع بصری رابط کاربری با عنوان GUI شناخته میشود که مخفف عبارت  Graphical User Interfaceاست و تمرکز طراحان رابط کاری بیشتر بر نیازهای کاربران می باشد تا بفهمند که کاربران چه نیازهایی ممکن است داشته باشند تا دسترسی به این عناصر را در طراحی  UI خود رعایت کنند. در ادامه به طبقه بندی انواع رابط کاربری می پردازیم:

انواع رابط کاربری از نظر ماهیت:

رابط کاربری سخت افزاری :

این نوع رابط کاربری ها بصورت سخت افزاری هستند و به صورت فزیکی با کاربر در ارتباط و تعامل می باشند.
همانند ماوس ، کیبورد ، بلندگو و…

رابط کاربری نرم افزاری :

همان طور که از نامش پیداست این نوع رابط کاربری ها بصورت نرم افزاری میباشند و عملا قابلیت لمس و تعامل فزیکی را ندارند.
همانند منوها ، آیکون ها ، پنجره ها و…

طراحی سایت

انواع رابط کاربری از نظر عملکرد :

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

رابط گزینشی : به این صورت است که یک سری فرمان ها از طریق فهرست های گزینشی در اختیار کاربر قرار می گیرد و کاربر می تواند از میان آنها فرمان مورد نظرش را انتخاب نماید.

رابط گرافیکی :رابطی است که اطلاعات را به صورت گرافیکی نمایش می دهد و برای برقراری ارتباط با کاربر به یک وسیله ی اشاره ای نیاز دارد.

آشنایی با تجربه کاربری (UX):

ux مخفف عبارت User Experience به معنای تجربه کاربری می باشد(میزان رضایت کاربر از کاربردی بودن سایت دارد) و راحتی کابر و ایجاد رضایت کاربر در کار کردن با سایت را UX می گوییم. در نتیجه می توان گفت: حس خوب یا بدی را که کاربران از سایت شما میگیرند را UX به آنها منتقل می کند.

اهمیت UX در چیست؟

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

ux تاثیر مستقیم روی سئوی سایت دارد

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

مراحل شروع به ایجاد یک سایت با تجربه کاربری مناسب

  • تحقیق و پژوهش در مورد نیازهای مخاطبین یک سایت
  • شخصیت کاربران سایت را در نظر بگیرید و تجسم کنید که به چه چیزی نیاز دارند
  • ساخت مسیر کاربر از ابتدای ورود تا اینکه چطور به خدمات یا خرید از سایت می رسد
  • ساخت وایرفریم و پروتوتایپ که به کاربر سایت خط درست بدهد
  • طراحی رابط کاربری و تحویل به توسعه دهنده
  • تحلیل و بررسی – آزمون و خطا برای کل سایت و بخش های گوناگون که در منو و یا ساید بار های سایت قرار دارد.
ux تاثیر مستقیم روی سئوی سایت دارد

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

1.

قدم اولیه

تحقیق و پژوهش در مورد نیازهای مخاطبین یک سایت

2.

قدم دوم

شخصیت کاربران سایت را در نظر بگیرید و تجسم کنید که به چه چیزی نیاز دارند.

3.

قدم سوم

ساخت مسیر کاربر از ابتدای ورود تا اینکه چطور به خدمات یا خرید از سایت می رسد.

4.

قدم چهارم

ساخت وایرفریم و پروتوتایپ که به کاربر سایت خط درست بدهد.

5.

قدم پنجم

طراحی رابط کاربری و تحویل به توسعه دهنده.

6.

قدم ششم

آزمون و خطا برای کل سایت و بخش های گوناگون که در منو و یا ساید بار های سایت قرار دارد.

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

گوگل چگونه UX را تشخیص میدهد ؟

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

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

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

به طور کلی عناصر رابط کاربری به صورت زیر دسته‌بندی می‌شوند:

 کنترل‌های ورودی: شامل دکمه‌ها، فیلد‌های متنی، چک‌باکس‌ها، دکمه‌های رادیویی، فیلدهای داده و …

 بخش‌های ناوبری: شامل اسلاید‌ها، فیلدهای جستجو، تگ‌ها، آیکن‌ها و …

بخش‌های اطلاعاتی: شامل جعبه‌های پیام، نوار پیشرفت (Progress bar)، آگاه‌سازی‌ها و …

رابط کاربری نهایی ترکیبی از عناصر فوق می‌باشد. انتخاب نوع عناصر و چگونگی به کارگیری آن‌ها بسته به نوع رابط کاربری متفاوت خواهد بود و چیدمان مناسب عناصر بسیار حائز اهمیت می‌باشد.

نکات مهم در طراحی رابط کاربری:

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

ساده طراحی کنید:

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

قدرت رنگ ها :

از رنگ ها شناخت درستی داشته باشید شما با استفاده از رنگ و نور می توانید به راحتی توجه کاربر را به یک قسمت بیشتر کنید و یا به عکس می توانید بخش های غیر ضروری را کمرنگ کنید.

هدفمند طراحی کنید:

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

تایپوگرافی و فونت ها:

استفاده از یک فونت مناسب تاثیر بالایی در خوانایی محتوا دارد ، با استفاده از ویژگی هایی همچون بولدکردن ، تغییر سایز می توانید تمرکز کاربر را هنگام مطالعه بالا ببرید.

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

  •  در صفحات نمایش مختلف با هر ابعاد و اندازه‌ای عملکرد مناسبی داشته باشد؛
  •  حروف استفاده شده در آن به راحتی قابل تمیز باشند؛
  •  به تناسب سلسله مراتبی محتوا توجه شده باشد تا آنچه که ارائه می‌شود قابل هضم تر شود.

طراحی UI مدرن و امروزی علاوه بر موارد یاد شده تا حد زیادی به طراحی متحرک یا Motion Design نیز وابسته شده است. انیمیشن‌ها، جلوه‌های بصری و افکت‌هایی که در هنگام جابجایی در صفحه مشاهده می‌شوند، همگی تأثیر چشمگیری بر کاربرانی خواهند داشت که برای اولین بار با محصول شما تعامل می‌کنند.

اهمیت UI و UX :

باید اینکه را توجه داشته هر چیزی که به کاربران خود ارائه میدهید باید از لحاظ گرافیکی و بصری جذاب و زیبا باشد.

یک رابط کاربری مناسب یک زبان بصری واحد به وجود می آورد که به بهبود تعامل کاربران با محصول شما کمک می کند در واقع، UI یا رابط کاربری فصل مشترک طراحی تعامل (Interaction Design)،  طراحی بصری (Visual Design) و معماری اطلاعات (Information Architecture) به شمار می‌رود و خواه ناخواه همه ابعاد آنچه که به مخاطب خود عرضه می‌کنید را تحت تأثیر قرار خواهد داد. در غیاب یک UI مناسب، تعامل کاربر به نحو مطلوبی انجام نمی‌شود و لذا نتایج چندان ایده آلی را شاهد نخواهیم بود.

رابط کاربری سایت

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

رابط کاربری موبایل

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

رابط کاربری نرم افزارها

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

  • سبک طراحی متناسب با نرم افزار
  • تعیین ابزارهای شاخص و پراهمیت
  • دسترسی آسان به بخش های پراستفاده
  • پرهیز از شلوغی بخصوص در اپلیکیشن های موبایل
  • آنالیز رفتار کاربران و بهبود UI در آپدیت های بعدی
  • آنالیز رقبا و استفاده از سبک های موفق

تاثیر بهبود رابط کاربری سایت در سئو

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

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

تفاوت UI و UX :

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

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