19 نکته در بهبود تجربه کاربری

24 مهر 1395
علی رضاجو

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

 

 

بخش طراحی تعاملی (Interaction Design)

 

1. آیا عملیات و درخواست های تکراری برای کاربر، به طور سریع و آسان قابل انجام است؟

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

در این مرحله باید تمامی مراحل رفتار و حرکت کاربر در محصول را مورد بررسی قرار دهید. شما باید اقدام لازم برای مسیر کاربرانی که احتمالا با یک بخش تکراری یا طولانی مواجه خواهند شد، انجام داده باشید. مثلا  در بخش تکمیل فرم، استفاده از اطلاعات قبلی کاربر می تواند بسیار کاربردی باشد. به عنوان مثال در فروشگاه آنلاین در هنگام نهایی سازی فرآیند خرید از شما آدرس دریافت کننده ( Shipping Address )  و در بخش دیگر آدرس پرداخت کننده ( Billing Address ) پرسیده می شود ، در این بخش می توان تنها با انتخاب یک گزینه ( یکسان بودن آدرس دریافت کننده و پرداخت کننده ) آدرس را در هر 2 فرم کپی کرد.

 

 

 

2.آیا کاربر براحتی عملیات را درک و اصلاح میکند؟

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

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

 

 

3.آیا نیاز کاربران با هر سطحی از تجربه و دانش برطرف می شود؟

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

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

 

 

4.آیا راهنمایی و آموزش به کاربر، در روند حرکتی و فعالیت او اختلال ایجاد می کند؟

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

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

 

بخش طراحی بصری (Visual Design)

 

5.بهتر است بیش از 3 رنگ اصلی استفاده نکنید.

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

در یک پالت مجزا رنگ های استفاده شده را وارد کنید و در نهایت این موضوع را بررسی کنید که از چه کد و چه تعداد رنگ های طیف سرد و گرم استفاده کرده اید و این موضوع را به تعادل برسانید.

 

 

6.آیا رنگ های به کاربرده شده برای افراد با ناراحتی های بینایی بهینه شده است؟

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

از طریق سرویس Colorblind Web Page Filter می توان رنگ بندی محصول آنلاین خود را با تمام گروه های بیماری کور رنگی مورد ارزیابی قرار داده و این موضوع  را بهینه سازی کنید.

 

7.آیا ترتیب اولویت ارائه محتوا و طراحی به حرکت و انجام فعالیت، به کاربر کمک می کند؟

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

 

 

8.آیا مهمترین موارد در بخش ابتدایی - بالایی صفحه قرار دارد؟

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

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

برای اطلاعات بیشتر در این مورد می توانید مطلب : کاربران در صفحات وب چه می بینند و چه می خوانند؟ را مطالعه کنید.

 

 

9.آیا عمل اصلی با عمل ثانویه از هم متمایز هستند؟

در طراحی بصری می بایست 2 عمل اصلی و ثانویه از هم متمایز باشند ، به عنوان مثال در طراحی 2 دکمه ( ثبت و انصراف ) 2 عملکرد متفاوت و طراحی متفاوتی را نیازمند است که کاربر می بایست در نگاه اول متوجه این موضوع شود.

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

 

 

10.عناصر تعاملی، طراحی انتزاعی نداشته باشند.

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

 

11.آیا بعد از تایید و ارسال فرم و بخش های تعاملی، کاربر متوجه موفقیت یا عدم موفقیت عملیات می شود؟

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

 

12.آیامفهوم نوشتاری،  طراحی بصری پیام و اعلان ها در سایت قابل درک هستند؟

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

 

بخش معماری اطلاعات (Information Architecture)

 

13.بخش منو (ناوبری) مشخص و گویای ساختار محتوایی است؟

آیا کاربران در صفحات شما متوجه مسیر طی شده هستند؟  آیا کاربران براحتی می توانند در صفحات شما حرکت کنند و این موضوع آیا در کمترین کلیک و کوتاه ترین مسیر انجام می شود؟

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

 

 

14.آینده نگری در سیستم

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

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

 

بخش تایپوگرافی (Typography)

 

15.بیش از 2 نوع فونت به کار نبرید.

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

 

16.آیا حداقل سایز فونتی که به کار برده اید 12 پیکسل است؟

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

 

17.آیا ابعاد و زخمات فونت ها در بخش های محتوایی متفاوت است؟

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

 

 

بخش رابط کاربری (User Interface)

 

18.آیا المان های مرتبط ، نزدیک و در دسترس یکدیگر هستند؟

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

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

 

 

 

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

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

یکی از راه های آزمودن این مورد استفاده از سرویس Colorblind Web Page Filter برای بیماری های کورنگی چشم است ، تکنیک دیگر این است که شما می توانید یک تصویر از کل طرح خود تهیه کرده و از افکت Gaussian blur  به میزان 3 الی 5 پیکسل  بر روی طرح خود استفاده کنید ، حال به نقاطی که بخش های حساس و تمرکز عناصر بیشتر است توجه کنید،  آیا می توانید به خوبی عناصر زمینه و اصلی را تشخیص دهید؟

 

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

 

 

علی رضاجو

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

You have no rights to post comments