سپنتا پویا — طراح محصول

یک مجموعهٔ داده و سه نمای دست‌کاری‌پذیر
منبع: بنیاد طراحی تعامل (IxDF) · بازنویسی آزاد: سپنتا پویا · ترجمه: ۶ شهریور ۱۴۰۵ · زمان مطالعه: حدود ۱۰ دقیقه

بازنمایی دست‌کاری‌پذیر اطلاعات (Manipulable Information Representations) چیست؟

💡 این متن «بازنویسی آزاد» است: ایده‌ها و مفاهیم مطلب اصلی با نگارش کاملاً مستقل فارسی و مثال‌های تازه بازگو شده‌اند و ترجمهٔ کلمه‌به‌کلمه نیست. بخش‌های افزودهٔ مترجم در جعبهٔ منبع مشخص شده‌اند.

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

تعریف

بازنمایی دست‌کاری‌پذیر با تعاملِ بیننده به جنگ انبوهی اطلاعات می‌رود.

یعنی کاربر نمای موجود را خودش عوض می‌کند. و این کار در سه دستهٔ استاندارد انجام می‌شود: پیمایش، کلیت به جزئیات، و کانون و بافت.

پس مسئله حجم داده نیست. مسئله این است که نما در اختیار کیست.

و «دست‌کاری‌پذیر» صفتِ نما است، نه صفتِ داده. همان جدول در یک نمای دست‌کاری‌پذیر خواندنی می‌شود و در یک تصویر ثابت نه.

ایدهٔ اصلی

یک بازنمایی دست‌کاری‌پذیر مثل یک مدل تعاملی کار می‌کند.

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

و ارزش این کار در پر کردن شکاف انسان و رایانه است، تا بینشِ تحلیلی «به شکلی معنادار» منتقل شود.

سه تکنیک استاندارد این ایده را عملی می‌کنند. ریکاردو مازا در Introduction to Information Visualization همین سه را از هم جدا می‌کند.

و هر سه یک شرط مشترک دارند: بدون نرم‌افزار هیچ‌کدام ممکن نیست. یک نمودار چاپی، هر قدر هم دقیق باشد، دست‌کاری‌پذیر نمی‌شود.

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

و قیدِ «ساده» در آن تبدیل‌ها مهم‌تر از چیزی است که به نظر می‌رسد. کاری که کاربر می‌کند محاسبهٔ تازه روی داده نیست؛ نگاه‌کردن از فاصله‌ای دیگر است.

پس یاد گرفتنش هم چیزی نمی‌خواهد. کسی برای بزرگ‌نمایی روی نقشه آموزش نمی‌بیند.

یک مجموعهٔ داده و سه نمای دست‌کاری‌پذیر
نمودار از سپنتا پویا برای این ترجمه (sepantapouya.com)

پیمایش

ساده‌ترین تکنیک، پیمایش است: کاربر با نوار پیمایش روی یک یا چند محور حرکت می‌کند.

و فایده‌اش روشن است. نقطهٔ داده‌ای که دنبالش هستید، پیدا می‌شود.

اما محدودیتش هم به همان اندازه روشن است: تصویر کلی هرگز یک‌جا دیده نمی‌شود.

و نتیجه‌اش این است که کاربر درکِ بافتِ نمونه‌اش را از دست می‌دهد. می‌داند کجا ایستاده، اما نمی‌داند نسبت به کل کجاست.

پیمایش می‌تواند روی یک محور باشد یا روی چند محور. و حالت دومحوره سخت‌ترین حالت است.

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

کلیت به جزئیات

تکنیک دوم اول یک تصویر جامع از داده می‌دهد. بعد اجازه می‌دهد یک بازنمایی محلیِ ریز انتخاب شود.

نمونهٔ کلاسیکش پنجرهٔ نویسه‌های ویژه در Microsoft Word است. نویسهٔ انتخاب‌شده بزرگ می‌شود تا پیش از درج، تأیید شود.

و Google Maps همین کار را با بزرگ‌نمایی انجام می‌دهد. اول شهر، بعد خیابان.

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

و نکتهٔ پنهان در نمونهٔ Word این است که نمای ریز کارِ «تأیید» را انجام می‌دهد. یعنی جزئیات فقط بزرگ‌نمایی نیست؛ ابزار کاهش خطاست.

اما جزء و کل هم‌زمان دیده نمی‌شوند. کاربر بین دو حالت رفت‌وبرگشت می‌کند و باید یکی را در ذهنش نگه دارد.

کانون و بافت

تکنیک سوم جزء و بافت را هم‌زمان در یک تصویر نشان می‌دهد.

و همین هم‌زمانی است که به حافظهٔ کوتاه‌مدت در تفسیر داده کمک می‌کند. چیزی برای نگه‌داشتن در ذهن باقی نمی‌ماند.

روش‌های رسیدن به این نما دو خانواده‌اند. اولی هندسهٔ تصویر را عوض می‌کند و دومی جمعیتِ داده را.

خانوادهٔ اول، اعوجاج است. شکل نما عوض می‌شود و هیچ داده‌ای کنار نمی‌رود.

  • - نمای بایفوکال: رابرت اسپنس در ۱۹۸۲ پیشنهادش داد. ناحیهٔ کانونی باز می‌ماند و دادهٔ پیرامون فشرده می‌شود.
  • - دیوار پرسپکتیو: یک بازنمایی سه‌بعدی. سطح روبه‌رو کانون را می‌دهد و دیوارهای عقب‌رفته بافت را.
  • - نمای چشم‌ماهی: اعوجاج عدسی چشم‌ماهی روی داده می‌نشیند و بخش مهم را برجسته می‌کند.

خانوادهٔ دوم، حذف جزئیات است. اینجا شکل سرِ جایش می‌ماند و بخشی از داده کنار می‌رود.

  • - مرورگر هایپربولیک: نرم‌افزار پیچیدهٔ StarTree، که گره‌ها را عوض می‌کند و ساختار را خودکار بازآرایی می‌کند.
  • - اسپیس‌تری: تکنیکی از دانشگاه مریلند برای کاوش ساختار درختی، با بازآرایی متحرک.

و مشترکِ هر پنج روش یک چیز است: بافت هرگز کامل نیست. یا فشرده شده، یا کنار رفته.

و جمع این دو خانواده یک نتیجه دارد: کاربر از یک دادگانِ بزرگ ارزش بیرون می‌کشد، چون خودش نما را دست‌کاری می‌کند.

دو خانوادهٔ کانون و بافت: اعوجاج و حذف جزئیات
نمودار از سپنتا پویا برای این ترجمه (sepantapouya.com)

سه تکنیک، یک نردبان

این بخش افزودهٔ من است، چون منبع این سه را کنار هم می‌گذارد و ترتیبشان را توضیح نمی‌دهد.

هر سه یک پرسش را جواب می‌دهند: جزء و کل، هم‌زمان یا نوبتی؟

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

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

در کانون و بافت، هر دو هستند و هم‌زمان. بار از حافظه برداشته می‌شود و روی هندسه می‌افتد.

پس این سه، سه گزینهٔ هم‌عرض نیستند. یک نردبان‌اند که در هر پله، بار از ذهن کاربر به تصویر منتقل می‌شود.

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

و فایدهٔ عملی این نگاه، ساده‌شدن انتخاب است. جای مقایسهٔ سه تکنیک، یک پرسش می‌پرسید: کاربر چقدر باید در ذهنش نگه دارد؟

هزینه‌ای که هر پله می‌گیرد

این بخش هم افزودهٔ من است، چون منبع محدودیت پیمایش را می‌گوید و هزینهٔ دو تکنیک دیگر را نمی‌گوید.

پیمایش ارزان است و کور. ساختنش تقریباً هیچ کاری نمی‌برد و کاربر را در داده گم می‌کند.

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

اعوجاج، اندازه را قربانی می‌کند. وقتی وسط تصویر کشیده و کناره فشرده شده، مقایسهٔ دو عنصرِ دور از هم بی‌معنا می‌شود.

و این مهم‌ترین هزینهٔ پنهان این خانواده است. نمای چشم‌ماهی چشمگیر به نظر می‌رسد و خواندن نسبت‌ها را از بین می‌برد.

حذف جزئیات، اعتماد را قربانی می‌کند. کاربر نمی‌داند چه چیزی حذف شده، پس نمی‌داند چه چیزی را نمی‌بیند.

و درمانش یک قاعدهٔ ساده است: هر چیزی که حذف می‌کنید، جای خالی‌اش را شماره‌دار نشان دهید. «۳ گرهِ دیگر» از سکوت بهتر است.

پس هیچ پلهٔ این نردبان رایگان نیست. بالاتر رفتن، بار را از ذهن برمی‌دارد و روی دقتِ تصویر می‌گذارد.

و قاعدهٔ انتخابی که خودم به آن رسیده‌ام سه خط است. تا وقتی کاربر فقط دنبال یک ردیف است، پیمایش کافی است.

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

و وقتی باید دو نقطهٔ دور از هم را کنار هم ببیند، هیچ‌چیز جای کانون و بافت را نمی‌گیرد.

همین سه تکنیک، بیرون از نمودار

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

یک: فهرست بلند. پیمایش بی‌پایان همان پیمایش است، با همان نقص. کاربر نمی‌داند چند مورد مانده.

و درمانش نوار پیشرفت یا شمارندهٔ کل است. یعنی افزودن یک لایهٔ «کلیت» به یک تکنیک پیمایشی.

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

دو: ناوبری سلسله‌مراتبی. منوی دسته و زیردسته، دقیقاً «کلیت به جزئیات» است.

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

سه: خردنقشه در ویرایشگر کد. آن ستون باریک کنار متن، یک نمای کانون و بافتِ تمام‌عیار است.

و جدول‌های داشبورد همین را کم دارند. ستون لنگرِ ثابت، ارزان‌ترین شکل کانون و بافت است و در بیشتر داشبوردها غایب.

چهار: افشای تدریجی در فرم‌ها. اینجا حذف جزئیات به کار می‌رود، و همان هزینهٔ اعتماد را دارد.

به همین دلیل فرم چندمرحله‌ای بدون نشانگر مرحله ناقص است. نشانگر، «کلیت»ی است که فرم حذفش کرده.

در بافت فارسی

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

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

دو: جدول عریض، مسئلهٔ شمارهٔ یک داشبوردهای اداری اینجاست. جدول‌های بانکی و سازمانی ده‌ها ستون دارند.

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

ستون لنگرِ ثابت به‌همراه نمایی فشرده از همهٔ ستون‌ها، هم ارزان است و هم کانون و بافت را برمی‌گرداند.

و سلسله‌مراتب بصری کار دوم را می‌کند. ستون‌های کلیدی باید سنگین‌تر دیده شوند تا فشردگی، خواندن را نبندد.

سه: برچسب فارسی در نمای کلی جا نمی‌شود. یک عنوان فارسی معمولاً از معادل انگلیسی‌اش بلندتر است.

پس آن نمای کلی که در طرح انگلیسی جا می‌شد، اینجا سرریز می‌کند. راهش کوتاه‌نویسی در کلیت و نام کامل در جزئیات است، نه ریزکردن قلم تا مرز ناخوانایی.

چهار: کانون و بافت روی دستگاه ضعیف گران است. اعوجاج و بازآراییِ متحرک هر دو محاسبه می‌خواهند.

و گوشی میان‌رده با شبکهٔ ناپایدار اینجا استثنا نیست. پس «کلیت به جزئیات» گزینهٔ امن‌تری است، چون در حالت ضعیف ساده می‌شود اما کار می‌کند.

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

چهار مسئلهٔ نمای دست‌کاری‌پذیر در بافت ایران
نمودار از سپنتا پویا برای این ترجمه (sepantapouya.com)

جمع‌بندی

  • - بازنمایی دست‌کاری‌پذیر با تعاملِ بیننده به جنگ انبوهی اطلاعات می‌رود
  • - سه دستهٔ استاندارد: پیمایش · کلیت به جزئیات · کانون و بافت
  • - ایده‌اش یک مدل تعاملی است: نما با تبدیل‌های سادهٔ هندسی عوض می‌شود
  • - ریکاردو مازا · Introduction to Information Visualization
  • - و هر سه یک شرط دارند: بدون نرم‌افزار هیچ‌کدام ممکن نیست
  • - پیمایش: نقطهٔ دلخواه پیدا می‌شود و تصویر کل هرگز یک‌جا دیده نمی‌شود
  • - کلیت به جزئیات: نویسه‌های ویژهٔ Word و بزرگ‌نمایی Google Maps
  • - کانون و بافت: جزء و بافت در یک تصویر، به کمک حافظهٔ کوتاه‌مدت
  • - اعوجاج: نمای بایفوکال (اسپنس، ۱۹۸۲) · دیوار پرسپکتیو · نمای چشم‌ماهی
  • - حذف جزئیات: مرورگر هایپربولیک با StarTree · اسپیس‌تری از دانشگاه مریلند
  • - و این سه یک نردبان‌اند: در هر پله بار از ذهن کاربر به تصویر منتقل می‌شود
  • - پس پرسش انتخاب یکی است: کاربر چقدر باید در ذهنش نگه دارد؟
  • - هزینه‌ها: پیمایش کور است · کلیت به جزئیات حافظه می‌خرد · اعوجاج اندازه را قربانی می‌کند · حذف جزئیات اعتماد را
  • - و هر چیزی که حذف می‌کنید، جای خالی‌اش را شماره‌دار نشان دهید
  • - قاعدهٔ انتخاب: یک ردیف؟ پیمایش · یک عدد در برابر کل؟ کلیت به جزئیات · دو نقطهٔ دور از هم؟ کانون و بافت
  • - و مشترک هر پنج روشِ کانون و بافت این است که بافت هرگز کامل نیست
  • - بیرون از نمودار: فهرست بلند · ناوبری سلسله‌مراتبی · خردنقشه · افشای تدریجی
  • - و در فارسی: جهت بخشی از تکنیک است · جدول عریض ستون لنگر می‌خواهد · برچسب فارسی در نمای کلی جا نمی‌شود · و کانون و بافت روی دستگاه ضعیف گران است

منبع

این نوشته «بازنویسی آزاد» است از مطلب Manipulable Information Representations در وب‌سایت بنیاد طراحی تعامل (Interaction Design Foundation — IxDF؛ بدون نام نویسندهٔ مشخص). مفاهیم پایه — تعریف بازنمایی دست‌کاری‌پذیر به‌عنوان بازنمایی‌ای که با فراهم‌کردن تعامل بیننده در دل مصورسازی داده به مقابله با انبوهی اطلاعات می‌رود و سه دستهٔ اصلی دست‌کاری یعنی پیمایش و کلیت به جزئیات و کانون و بافت؛ ایدهٔ اصلی یعنی کارکرد آن به‌عنوان یک مدل تعاملی که به کاربر اجازه می‌دهد نمای تولیدشده را با تبدیل‌های سادهٔ هندسی عوض کند و صورت‌بندی پر کردن شکاف انسان و رایانه برای انتقال بینش تحلیلی «به شکلی معنادار»؛ ارجاع به دسته‌بندی سه تکنیک استاندارد در کتاب Introduction to Information Visualization اثر ریکاردو مازا؛ پیمایش به‌عنوان ساده‌ترین تکنیک با حرکت روی یک یا چند محور به‌کمک نوار پیمایش و فایده‌اش در یافتن نقطهٔ داده و محدودیتش در ندیدن تصویر کلی و از دست رفتن درک بافت نمونه؛ کلیت به جزئیات یعنی دادن یک تصویر جامع و سپس انتخاب بازنمایی محلی ریز، با دو نمونهٔ پنجرهٔ نویسه‌های ویژهٔ Microsoft Word و بزرگ‌شدن نویسهٔ انتخاب‌شده برای تأیید پیش از درج، و بزرگ‌نمایی Google Maps؛ کانون و بافت یعنی نمایش هم‌زمان جزء و بافت در یک تصویر و پشتیبانی از حافظهٔ کوتاه‌مدت در تفسیر داده؛ خانوادهٔ روش‌های اعوجاج یعنی نمای بایفوکال پیشنهادشده توسط رابرت اسپنس در ۱۹۸۲ با بازنگه‌داشتن ناحیهٔ کانونی و فشرده‌کردن دادهٔ پیرامون، دیوار پرسپکتیو با بازنمایی سه‌بعدی و سطح روبه‌رو برای کانون و دیوارهای عقب‌رفته برای بافت، و نمای چشم‌ماهی با اعوجاج عدسی برای برجسته‌کردن دادهٔ مهم؛ خانوادهٔ روش‌های حذف جزئیات یعنی مرورگر هایپربولیک با نرم‌افزار StarTree و عوض‌کردن گره‌ها و بازآرایی خودکار ساختار، و اسپیس‌تری از دانشگاه مریلند برای کاوش ساختار درختی با بازآرایی متحرک؛ و نتیجهٔ نهایی یعنی بیرون کشیدن ارزش از دادگان بزرگ و پیچیده به‌کمک دست‌کاری تعاملی و لزوم پشتیبانی نرم‌افزاری برای هر سه تکنیک — از این منبع گرفته شده. متن فارسی، ساختار بخش‌ها و همهٔ تحلیل‌ها کاملاً مستقل نوشته شده‌اند.

متن مطلب اصلی تحت هیچ لایسنس بازی منتشر نشده است؛ به همین دلیل اینجا ترجمهٔ کلمه‌به‌کلمه ارائه نشده و متن کامل انگلیسی (به‌همراه همهٔ منابع مرتبط) در لینک زیر در دسترس است.

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

تصاویر: هیچ تصویری از مطلب اصلی بازتولید نشده است. هر سه نمودار این صفحه طراحی مستقل مترجم است.

مشاهدهٔ مطلب اصلی
سپنتا پویا

مترجم: سپنتا پویا

طراح ارشد محصول. مقالات تخصصی UI/UX را با حفظ ساختار و لحن نسخهٔ اصلی به فارسی برمی‌گردانم.

دربارهٔ من

در این مقاله

  • - تعریف
  • - ایدهٔ اصلی
  • - پیمایش
  • - کلیت به جزئیات
  • - کانون و بافت
  • - سه تکنیک، یک نردبان
  • - هزینه‌ای که هر پله می‌گیرد
  • - همین سه تکنیک، بیرون از نمودار
  • - در بافت فارسی

برچسب‌ها

  • مصورسازی اطلاعات
  • انبوهی اطلاعات
  • تعامل
  • ترجمه