مصورسازی داده‌ها

شاید بیشتر از یک ساله که پربازدید‌ترین جست‌و‌جوی گوگلم عبارت Coronavirus است. معمولاً یک یا دو بار در روز جست‌و‌جو می‌کنم و نمودار کیس‌های جدید، مرگ و میر و تعداد واکسینه‌شده‌ها رو می‌بینم. در یک نگاهِ چند ثانیه‌ای و به‌ راحتی، می‌شه جدا از دیدن روند‌ کلی، عدد هر کدوم از موارد بالا رو در ۲۴ ساعت گذشته‌ فهمید. این مثال، مثال خیلی کوچیکی از چیزیه که ما به کمک اون روزانه اطلاعات زیادی رو در کم‌ترین زمان ممکن دریافت می‌کنیم و اون چیزی نیست جز مصورسازی داده یا Data Visualization. از ابتدای کارم به‌ عنوان مهندس تجربه‌ی کاربر، دنبال زمینه‌های مرتبط با کارم بودم و مصورسازی داده‌ها یکی از اون حوزه‌های جذابیه که یک مهندس دیزاین و یا یک دیزاینر می‌تونه در اون کار کنه و یا عمیق بشه. در گیر و دار شناخت بیشتر این حوزه چند‌ کتاب و مقاله خوندم و اینجا قصد دارم در چند قسمت درباره‌ی شناخت، دیزاین و پیاده‌سازی مصورسازی داده بیشتر بگم.

چرا داده‌ها رو مصور می‌کنیم؟

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

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

عناصر کلیدی مصورسازی داده

بیایید قبل از شروع کمی دقیق‌تر به سه عنصر اصلی موثر در دیزاین مصورسازی داده‌ها نگاه کنیم:

• داده (Data)

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

• دیزاینر (Designer)

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

• خواننده (Reader)

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

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

دسته‌بندی انواع مصورسازی داده‌ها

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

یک. دسته‌بندی براساس پیچیدگی

یکی از راه‌های متداول مصورسازی داده‌ها،‌ در نظر گرفتن تعداد متغیرهای اثرگذار روی داده‌ایه که می‌خوایم مصور کنیم. برای مثال یک نمودار خطی ساده می‌تونه تعداد مبتلایان بیماری کووید-۱۹ یک کشور رو در روزهای مختلف نشون بده. این نمودار فقط دو متغیر داره. اگر تعداد مرگ و میر روزانه یا تعداد افراد واکسینه‌شده رو هم در نظر بگیریم، متغیرهای جدیدی اضافه کردیم که این نمودار خطیِ دو بُعدی رو به نمودار پیچیده‌تری تبدیل می‌کنه. می‌تونیم تعداد متغیرهای اثرگذار روی داده رو به عنوان معیاری برای پیچیدگی مصورسازی داده‌ توصیف کنیم. همونطور که مصورسازی‌‌ها پیچیده‌تر می‌شن، دیزاینِ اون‌ها چالش‌برانگیزتر و درکشون هم دشوار‌تر می‌شه. به همین دلیل، مصورسازی‌هایی با سه یا چهار بُعد، مصورسازی‌های متداول‌تری هستن (اگرچه مصورسازی‌هایی با ابعاد بیشتر رو هم می‌شه پیدا کرد). فقط به این نکته توجه کنید که اضافه‌کردن حجم یا نقاط داده‌ بیشتر از یک بُعد، پیچیدگی رو افزایش نمی‌ده. مثلا نمایش داده‌های یک ساله‌ی مبتلایان کووید-۱۹، پیچیده‌تر از یک هفته داده نیست، بلکه حجم بیشتری داره. یا نمایش ۵۰ کشور به جای یک کشور ممکنه صفحه‌ رو شلوغ‌تر یا خوندن رو دشوارتر کنه، اما نمودار رو پیچیده‌تر نمی‌کنه. با این‌حال چالش اصلی برای دیزاین مصورسازی‌های پیچیده‌تر اینه که هر چقدر ابعاد بیشتری رو به شکل بصری رمزگذاری کنیم، باید از ویژگی‌های بصری منحصر‌به‌فردتری استفاده کنیم و این کار در بُعد‌های بیشتر سخت‌تره (در قسمت‌های بعد با چالش‌ها و روش‌های مصورسازی‌ داده‌های پیچیده بیشتر آشنا می‌شیم).

دو. مصورسازی داده و اینفوگرافیک‌ها

دومین روش تقسیم‌بندی مصور‌کردن داده‌ها بر اساس مبدا و شکل است که او‌ن‌ها رو به دو دسته‌ی مصورسازی داده (Data Visualization) و اینفوگرافیک (Infographic) تقسیم می‌کنه.به طور خلاصه اینفوگرافیک (Infographic) ویژگی‌های زیر رو داره:

• دستی رسم می‌شه و رفتار سفارشی از اطلاعاته.
• استاتیکه و با اضافه‌شدن داده‌ی جدید، به دیزاین و بازآفرینی مجدد نیاز داره.
• زیبایی بصری غنی، قوی و جالب‌ توجهی داره.
• از نظر داده‌ای نسبتاً ضعیفه.

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

در مقابل، مصورسازی داده (Data Visualization) این ویژگی‌ها رو داره:

• الگوریتمی ترسیم می‌شه.
• بازسازیش با اضافه‌شدن داده‌های جدید آسون‌تره.
• اغلب از نظر زیبایی ضعیف‌تره.
• نسبتاً از نظر حجم داده قویه.

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

سه. مصورسازی اکتشافی و توضیحی

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

• مصورسازی داده‌ی اکتشافی (Exploratory Visualization)

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

• مصورسازی داده‌ی توضیحی (Explanatory Visualization)

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

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

چهار. اطلاع‌دهنده و متقاعد کننده

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

• مصورسازی داده‌ی اطلاع‌دهنده یا آگاهی‌بخش (Informative Visualization)

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

• مصورسازی داده‌ی متقاعدکننده (Persuasive Visualization)

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

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

در این مقاله سعی کردم درباره‌ی چیستی و چرایی مصورسازی‌ داده‌ها بگم و دوست دارم در ادامه بیشتر درباره‌ی چگونگی دیزاین و در نهایت پیاده‌سازی یک مصورسازی‌ داده صحبت کنم. این دست مطالب قراره در بلاگ دیزاین دیوار ادامه پیدا کنه؛ منتظر باشید.