Web Designآموزشمفاهیم پایه

معرفی رابط کاربری (UI)

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

وابستگی روزافزون بسیاری از مشاغل به برنامه های وب و برنامه های تلفن همراه باعث شده است كه بسیاری از شركت ها برای بهبود تجربه كلی کاربر اولویت بیشتری را برای UI قائل شوند.

تاریخچه رابط کاربری (UI)

در رایانه های اولیه، به جز چند دکمه در کنسول اپراتور، رابط کاربری بسیار کمی وجود داشت. بسیاری از این رایانه های اولیه از کارت های پانچ شده که با استفاده از دستگاه های کلید پانچ تهیه شده بودند، به عنوان روش اصلی ورودی برای برنامه ها و داده های رایانه استفاده می کردند. در حالی که از سال 2012 کارت های پانچ اساساً در محاسبات منسوخ شده اند، برخی از دستگاه های رأی دهی هنوز از سیستم کارت پانچ استفاده می کنند.

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

سرانجام رابط کاربری گرافیکی وارد کار شد که عمدتا در مرکز تحقیقات Palo Alto زیراکس (Xerox) بود که توسط اپل تصویب و بهبود یافته و توسط مایکروسافت در سیستم عامل های ویندوز خود استاندارد شده است. عناصر GUI شامل مواردی مانند پنجره ها، منو های کشویی، دکمه ها، میله های پیمایش و نماد ها هستند. با افزایش استفاده از ارتباطات و تصاویر چند رسانه ای به عنوان بخشی از رابط کاربری گرافیکی، صدا، فیلم متحرک و واقعیت مجازی به طور فزاینده ای تبدیل به GUI برای بسیاری از برنامه ها می شوند.

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

اجزای رابط کاربری

اجزای رابط کاربری

رابط کاربری (UI) “سطح بیرونی” هر برنامه یا وب سایت است. این بخش کل آرایش بصری نرم افزار و نحوه انتقال تمام قسمت های مختلف نرم افزار به کاربر است. UI از سه دسته اصلی تشکیل شده است:

  • چیدمان (Layout): چیدمان رابط کاربری، ظاهر و احساس کلی یک برنامه یا وب سایت را نشان می دهد، از جمله ساختار و فاصله هر صفحه و ارتباط بین اجزای موجود در صفحه، قرارگیری کلی اجزای اصلی برای ایجاد و تعریف کادر در صفحه، زبان طراحی کلی که به نرم افزار هویت می بخشد، انتقال بین صفحات و اجزا و رنگ ها، شکل ها، فونت ها و چشم انداز ها استفاده می شود که به ایجاد یک برند تجاری منسجم کمک می کنند.
  • المان ها: عناصر UI قسمت هایی از برنامه یا وب سایت هستند که آن را تعاملی می کنند یعنی باعث ایجاد تعامل کاربر با سایت می شوند. عناصر معمول شامل دکمه ها، اسلایدر ها، لیست های کشویی و قسمت های متنی است. اخیراً، حرکات فیزیکی به عناصر اصلی UI، به ویژه برای برنامه های تلفن همراه تبدیل شده اند.
  • گرافیک ها: در UI گرافیک، تصاویری است که قاب، صفحه یا عنصر را روایت می کند. نمونه هایی از گرافیک ها تصاویر، انیمیشن ها، فیلم ها و… هستند.

انواع رابط کاربری (UI)

  • رابط کاربری گرافیکی (GUI)
  • رابط خط فرمان (CLI)
  • رابط کاربری منو محور
  • رابط کاربری لمسی
  • رابط کاربری صوتی (VUI)
  • رابط کاربری مبتنی بر فرم
  • رابط کاربری زبان طبیعی

طراحی رابط کاربری چیست؟

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

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

طراحی رابط کاربری چگونه است

یک طراح UI چه کاری انجام می دهد؟

یک طراح UI مسئول ایجاد و اجرای ظاهر یک برنامه یا وب سایت است. در دنیای نرم افزار معمولاً به طراحان رابط کاربری (UI) طراحان گرافیک گفته می شود. آن ها زیبایی همه قطعات UI را تعیین می کنند و هدف برند تجاری را به کاربر منتقل می کنند.

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

یکی از روش های طراحان رابط کاربری برای تعیین اینکه آیا UI برای کاربران خوب است یا نه، این است که مستقیماً از آن ها بخواهند که با آن ارتباط برقرار کنند.

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

چگونه UI های چشمگیر ایجاد کنیم؟

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

  1. دکمه ها و سایر عناصر رایج را به طور قابل پیش بینی تنظیم کنید تا کاربران بتوانند ناخودآگاه از آن ها در همه جا استفاده کنند. فرم ها باید عملکرد را دنبال کند.
  2. قابلیت پیدا کردن سریع عناصر را در نظر بگیرید. آیکون ها را به وضوح برچسب گذاری کنید و همچنین شامل زیبایی های ظاهری مشخص شده باشد: به عنوان مثال سایه ها برای دکمه ها
  3. رابط ها را ساده نگه دارید (فقط از عناصری که به اهداف کاربران کمک می کند استفاده کنید) و احساس “رهایی و سبکی” را ایجاد کنید.
  4. به چشم و توجه کاربر در مورد چیدمان عناصر احترام بگذارید. تمرکز بر سلسله مراتب و خوانایی:
    1. از صف بندی مناسب استفاده کنید. به طور معمول گوشه های صفحه (دور تر از مرکز) را انتخاب کنید.
    2. توجه را به ویژگی های کلیدی جلب کنید با استفاه از رنگ، روشنایی و کنتراست. از درج بیش از حد رنگ ها یا دکمه ها خودداری کنید و همچنین با استفاده از نوشتن متن از طریق اندازه فونت، نوع / وزن پر رنگ بودن آن، حروف کج، حروف بزرگ و فاصله بین حروف. کاربران باید معانی را فقط با یک اسکن سریع انتخاب کنند.
  5. تعداد اقدامات مربوط به انجام task را به حداقل برسانید اما بر روی یک عملکرد اصلی در هر صفحه تمرکز کنید. با نشان دادن راهنمایی های ترجیحی، راه را به کاربران نشان دهید و کار های پیچیده را آسان کنید.
  6. کنترل ها را نزدیک اشیایی قرار دهید که کاربران می خواهند آن ها را کنترل کنند. به عنوان مثال یک دکمه برای ارسال فرم باید نزدیک فرم باشد.
  7. با بازخورد های به دست آمده کاربران را در مورد پاسخ ها / اقدامات سیستم مطلع کنید.
  8. از الگو های مناسب طراحی UI برای کمک به راهنمایی کاربران و کاهش سردرگمی استفاده کنید (به عنوان مثال فرم های از قبل پر شده). مراقب استفاده از الگو های تیره باشید که شامل کاهش دید در پیدا کردن checkbox شده و موارد مشکل سازی را در سبد خرید کاربران به وجود می آورد.
  9. ثبات برند را حفظ کنید.
  10. همیشه مراحل بعدی را که کاربران می توانند به طور طبیعی و بدون توجه به زمینه آن ها نتیجه گیری کنند را ارائه دهید.

برای مطالعه مطالب مرتبط با این مقاله می توانید به مقاله زیر رجوع کنید:

تجربه کاربری (UX) چیست و ارتباط آن با سئو چه می باشد؟

منابع: pendo.io و interaction-design.org و searchapparchitecture.techtarget.com

نوشته های مشابه

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

نشانی ایمیل شما منتشر نخواهد شد.

دکمه بازگشت به بالا