ویرگول
ورودثبت نام
majid faridshad
majid faridshadطراح محصول با پیش‌زمینه طراحی گرافیک و بیش از ۸ سال تجربه در طراحی UI/UX اپلیکیشن‌های مالی، فروشگاهی و بهره‌وری. تمرکز من بر خلق تجربه‌ای ساده، مؤثر و کاربرمحور است.
majid faridshad
majid faridshad
خواندن ۲ دقیقه·۹ ماه پیش

موقعیت اسکرول کاربر رو فراموش نکن، احترام به تجربه کاربری یعنی حفظ جای قبلی

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

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

چرا موقعیت اسکرول این‌قدر مهمه؟

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

  • کاربر حس سردرگمی می‌کنه،

  • تمرکزش به‌هم می‌ریزه،

  • ممکنه ادامه نده و از صفحه خارج بشه.

طبق تحقیقات NN/g، نبودن این قابلیت باعث افت تجربه کاربری و حتی ترک فرایند خرید می‌شه، مخصوصاً تو موبایل.


کجاها بیشتر اذیت می‌کنه؟

۱. لیست محصولات (مثلاً فروشگاه آنلاین)

فرض کن ۸۰ تا محصول رو اسکرول کردی، یکی رو باز کردی، بعد برگشتی... دوباره اومدی بالا.
چند نفر حاضرن دوباره از اول برن پایین؟ خیلیا ول می‌کنن و می‌رن.

۲. مقالات طولانی یا بلاگ‌ها

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

۳. سوییچ بین تب‌ها یا فیلترها

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


طراحی خوب چیکار می‌کنه؟

یک تجربه کاربری درست باید جای کاربر رو نگه داره:

  • وقتی دکمه «بازگشت» می‌زنه، همون‌جایی باشه که بوده،

  • با تعویض فیلتر یا تب، اسکرول صفر نشه،

  • تو لیست‌های بلند یا اسکرول بی‌نهایت، موقعیت حفظ بشه.

این یعنی احترام به وقت کاربر، یعنی «حواسم بهت هست».


چطور می‌شه پیاده‌سازی کرد؟

بسته به تکنولوژی، راه‌حل‌های مختلفی هست:

  • وب (جاوااسکریپت): ذخیره مقدار scrollY تو sessionStorage یا state و برگشت به همون موقعیت با scrollTo,

  • اپ‌های ری‌اکت یا Vue: استفاده از مدیریت وضعیت (context یا Redux) برای حفظ موقعیت صفحه,

  • اپلیکیشن‌های موبایل: استفاده از قابلیت‌های بومی مثل RecyclerView یا ScrollView,

  • PWAها: استفاده از service worker و حافظه داخلی برای ذخیره اسکرول.

نکته مهم: تو صفحه‌هایی مثل لیست محصولات، بلاگ‌ها و اپ‌هایی با ناوبری زیاد حتماً تست کن.


در موبایل حیاتی‌تره

تو گوشی، صفحه کوچیکه و کاربر باید با دقت و صبر بالا پایین کنه.
اگه جای اسکرول بره، احتمال اینکه کلاً رهاش کنه بیشتره.

پس اگه طراحی‌ات mobile-firstـه، حفظ اسکرول خیلی مهم‌تره.


این فقط یه ویژگی فنی نیست، یه نوع احترامه

وقتی موقعیت اسکرول کاربر رو نگه می‌داری، داری بهش می‌گی:
"می‌دونم کجا بودی، وقتتو ارزشمند می‌دونم، بیا از همون‌جا ادامه بده."

این یعنی UX حرفه‌ای، یعنی جزئیات رو جدی گرفتن.


نتیجه‌گیری

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

UX خوب فقط این نیست که کاربر بره جلو،
این‌ـه که بتونه راحت برگرده.


الهام گرفته از مقاله‌ی رسمی Nielsen Norman Group با عنوان:
“Saving Users’ Scroll Position Helps Keep Their Place”

تجربه کاربریاسکرولux
۰
۰
majid faridshad
majid faridshad
طراح محصول با پیش‌زمینه طراحی گرافیک و بیش از ۸ سال تجربه در طراحی UI/UX اپلیکیشن‌های مالی، فروشگاهی و بهره‌وری. تمرکز من بر خلق تجربه‌ای ساده، مؤثر و کاربرمحور است.
شاید از این پست‌ها خوشتان بیاید