بایدها و نبایدها در طراحی رابط کاربری (UI) و تجربهٔ کاربری (UX)

بایدها و نبایدها در طراحی رابط کاربری (UI) و تجربهٔ کاربری (UX)

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

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

در این مقاله، ۱۰ مورد از بایدها و نبایدها برای کمک به طراحان به منظور بازگشت به عقب و بررسی سایت از دید کاربران ارائه شده که به ما کمک می‌کنند تا در نهایت شناخت بهتری از کاربران خود داشته باشیم.

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

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

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

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

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

4. اطمینان حاصل کنید که تمام لینک‌ها و دکمه‌ها به درستی کار می‌کنند
بسیار ناامیدکننده است که شما برای تهیهٔ مادهٔ غذایی به فروشگاه می‌روید و چیزی که نیاز دارید در فروشگاه موجود نیست! کاربران سایت یا اپلیکیشن شما هم در مواجهه با لینکی که درست کار نمی‌کند و یا دکمه‌ای که قابل کلیک کردن نیست، احساس مشابهی خواهند داشت.

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

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

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

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

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

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

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

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

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

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

هنگام طراحی سایت‌تان به تأثیر اِلِمان‌های مختلف در سرعت لود شدن سایت توجه داشته باشید. تصاویر بزرگ، استفادهٔ زیاد از تصاویر متحرک و اجرای اسکریپت‌های مختلف مثلا لایبرری‌های گوناگون جی‌کوئری موجب می‌شود که سایت شما در مدت زمان بیشتری لود شود. بهینه‌سازی و دقت در حین طراحی و همچنین کَش کردن برخی چیزها، سرعت لود شدن سایت شما را کاهش داده و این کاهش سرعت لود سایت، در نهایت منجر به ایجاد تجربهٔ کاربری بهتری خواهد شد.

10. مواردی که موجب عدم توجه به مطلب اصلی می‌شود را حذف کنید
پُر کردن سایت با مطالب بی‌ربط و طراحی اِلِمان‌هایی که توجه مخاطب را از مطلب اصلی باز می‌دارد، می‌تواند موجب سردرگمی و حتی عصبانیت کاربران شود! به علاوه، توجه به سلسله مراتب بصری در طراحی سایت موجب می‌شود تا عواملی که در جلب توجه کاربر دخیل بوده و توجه وی را از متن اصلی باز می‌دارد، کاهش پیدا کنند.

با محدود کدن تعداد دکمه‌های CTA در صفحهٔ اصلی، کاهش دادن یا تغییر مکان تبلیغات سایت، کمترین استفاده از فایل‌های فلش و تصاویر متحرک و استفاده از عناوین مناسب می‌توانید به کاربران در داشتن تجربهٔ کاربری بهتری کمک کنید (CTA مخفف واژگان Call to Action است؛ این دکمه‌ها برای اهداف مختلفی همچون ترغیب کاربر به ثبت‌نام در سایت، شرکت در نظرسنجی، افزودن کالا به سبد خرید و غیره استفاده می‌شوند). همچنین استفاده نکردن از پاپاپ که موجب می‌شود تا کاربر برای استفاده از صفحه پنجره‌ای را ببندد، در جلب توجه مخاطب به محتوای اصلی مؤثر است.

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

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