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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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