ডেটা-ইঙ্ক রেশিও ও চার্ট ডিজাইন প্রিন্সিপল
এই পাঠে যা শিখবেন
- ডেটা-ইঙ্ক রেশিওর সংজ্ঞা ও এর পেছনের যুক্তি
- চার্টজাঙ্কের সাধারণ উদাহরণ ও কেন এগুলো ক্ষতিকর
- একটি concrete বিফোর/আফটার উদাহরণ দিয়ে নীতিটি বাস্তবে প্রয়োগ দেখা
- নিজের চার্ট ডিজাইনে ডেটা-ইঙ্ক রেশিও বাড়ানোর ব্যবহারিক কৌশল
১ · ডেটা-ইঙ্ক রেশিও কী
পরিসংখ্যানবিদ ও তথ্য-ডিজাইনার এডওয়ার্ড টাফটি তাঁর সুপরিচিত বই "The Visual Display of Quantitative Information"-এ ডেটা-ইঙ্ক রেশিও ধারণাটি প্রবর্তন করেন — একটি চার্টে মুদ্রিত মোট "কালি" (ভিজ্যুয়াল মার্কের পরিমাণ)-এর মধ্যে কতটুকু প্রকৃতপক্ষে ডেটা প্রতিনিধিত্ব করে, বাকিটা শুধু সজ্জা কিনা। ধারণাগতভাবে —
$$\text{Data-ink ratio} = \frac{\text{ডেটা প্রতিনিধিত্বকারী কালি}}{\text{চার্টের মোট কালি}}$$
টাফটির যুক্তি ছিল — একটি ভালো চার্ট এই রেশিওকে যতটা সম্ভব ১-এর কাছাকাছি রাখার চেষ্টা করে, অর্থাৎ প্রতিটি রেখা, রঙ ও চিহ্ন প্রকৃত তথ্য বহন করে, শুধু সজ্জার জন্য থাকে না। এটি M8/L36-এর ভিজ্যুয়াল এনকোডিং আলোচনার একটি স্বাভাবিক সম্প্রসারণ — সঠিক এনকোডিং বাছাই করার পরও, সেই এনকোডিংয়ের চারপাশে অপ্রয়োজনীয় উপাদান যোগ করলে সুবিধাটাই নষ্ট হয়ে যেতে পারে।
২ · চার্টজাঙ্ক — কী এড়ানো উচিত
টাফটি যাকে চার্টজাঙ্ক (chartjunk) বলেছেন তা হলো এমন ভিজ্যুয়াল উপাদান যা চোখ আকর্ষণ করে কিন্তু কোনো অতিরিক্ত তথ্য দেয় না — বরং প্রায়ই প্রকৃত ডেটা পড়া কঠিন করে তোলে।
একটি সাধারণ বার চার্টকে 3D করলে পার্স্পেক্টিভ ডিস্টরশন তৈরি হয় — সামনের বার পেছনেরটির চেয়ে ভুলভাবে বড়/ছোট দেখায় (M8/L36-এর পারসেপচুয়াল-অ্যাকুরেসি সমস্যার একটি বাস্তব উদাহরণ)।
গাঢ়, পুরু গ্রিডলাইন প্রায়ই ডেটার চেয়ে বেশি দৃষ্টি আকর্ষণ করে — হালকা, সূক্ষ্ম গ্রিডলাইন (বা প্রয়োজনে একদমই না) যথেষ্ট।
প্যাটার্ন ফিল, গ্র্যাডিয়েন্ট, বা ছবি-ব্যাকগ্রাউন্ড যা কোনো ডেটা বহন করে না, শুধু "সাজানো" মনে হয়।
প্রতিটি বারের উপর একটি সজ্জামূলক আইকন বসানো যা নিজে কোনো সংখ্যাগত তথ্য যোগ করে না।
৩ · একটি concrete বিফোর/আফটার উদাহরণ
কল্পনা করুন একটি কোম্পানির ত্রৈমাসিক বিক্রয় দেখানো একটি বার চার্ট। "বিফোর" ভার্সন-এ: বারগুলো 3D-তে আঁকা (পার্স্পেক্টিভসহ), প্রতিটি বারের পেছনে একটি গাঢ় গ্র্যাডিয়েন্ট ব্যাকগ্রাউন্ড, ঘন কালো গ্রিডলাইন প্রতি ইউনিটে, প্রতিটি বারের উপরে একটি সজ্জামূলক "$" আইকন, এবং একটি ভারী ছায়া (shadow) ইফেক্ট। দর্শক প্রথমে 3D ইফেক্ট ও রঙের দিকে তাকান, প্রকৃত সংখ্যাগত পার্থক্য বুঝতে অতিরিক্ত সময় লাগে — এবং 3D পার্স্পেক্টিভের কারণে পেছনের বারগুলো আসলে যতটা তার চেয়ে ছোট মনে হয়।
"আফটার" ভার্সন-এ: একই ডেটা একটি সাধারণ ২D বার চার্টে, হালকা ধূসর একটি একক হরাইজন্টাল রেফারেন্স-লাইন (গড় মান দেখাতে), কোনো গ্রিডলাইন নেই (বদলে প্রতিটি বারের উপরে সরাসরি সংখ্যা লেখা), এবং একটি নিরপেক্ষ, একরঙা ব্যাকগ্রাউন্ড। প্রতিটি ভিজ্যুয়াল উপাদান এখন হয় ডেটা নিজেই (বারের দৈর্ঘ্য) বা সরাসরি ডেটাকে সহায়তা করে (সংখ্যা লেবেল, গড়ের রেফারেন্স-লাইন) — কোনোটাই নিছক সজ্জা নয়। ফলাফল: দর্শক দ্রুত ও সঠিকভাবে দেখতে পারেন কোন ত্রৈমাসিকে সবচেয়ে বেশি বিক্রয় হয়েছে, কতটা গড়ের উপরে/নিচে, কোনো বিভ্রান্তিকর ভিজ্যুয়াল শব্দ ছাড়াই।
একটি চার্ট যত বেশি ভিজ্যুয়ালি "আকর্ষণীয়" মনে হয়, তা প্রায়ই তত কম কার্যকরভাবে তথ্য জানায় — কারণ চোখের মনোযোগ ডেটার বদলে সজ্জায় চলে যায়। M8/L36-এর সঠিক এনকোডিং বাছাই ও এই পাঠের ডেটা-ইঙ্ক রেশিও একসাথে কাজ করে — একটি বলে "কোন ভিজ্যুয়াল প্রপার্টি ব্যবহার করব", অন্যটি বলে "সেই প্রপার্টির চারপাশে কতটা অতিরিক্ত যোগ করা উচিত"।
ভাবনার প্রশ্ন
প্রতিটি প্রশ্ন নিজে কিছুক্ষণ ভাবুন — তারপর "→ উত্তর" চাপুন।
প্র ০১ একজন ম্যানেজার বলেন "3D চার্ট বেশি প্রফেশনাল দেখায়, তাই আমরা সব রিপোর্টে এটি ব্যবহার করব।" ডেটা-ইঙ্ক রেশিও নীতি দিয়ে এই সিদ্ধান্তের কী সমস্যা তুলে ধরবেন?
"প্রফেশনাল দেখানো" একটি নান্দনিক লক্ষ্য যা চার্টের প্রকৃত উদ্দেশ্য — সঠিকভাবে তথ্য জানানো — এর সাথে সাংঘর্ষিক হতে পারে। 3D ইফেক্ট পার্স্পেক্টিভ ডিস্টরশন তৈরি করে যা ভুল তুলনার দিকে নিয়ে যেতে পারে (একটি বার প্রকৃতপক্ষের চেয়ে বড়/ছোট দেখানো)। যদি রিপোর্টের লক্ষ্য সিদ্ধান্ত নেওয়া হয়, নির্ভুলতা "দেখতে কেমন লাগছে" তার চেয়ে বেশি গুরুত্বপূর্ণ হওয়া উচিত।
প্র ০২ একটি চার্টে গ্রিডলাইন সম্পূর্ণ বাদ দেওয়া কি সবসময় ডেটা-ইঙ্ক রেশিওর জন্য ভালো? কোন পরিস্থিতিতে হালকা গ্রিডলাইন রাখা তবু যুক্তিসঙ্গত?
সম্পূর্ণ বাদ দেওয়া সবসময় সঠিক নয় — যদি ব্যবহারকারীকে একটি নির্দিষ্ট বারের সঠিক মান একটি অক্ষের সাথে মিলিয়ে পড়তে হয় (যেমন একটি জটিল লাইন চার্টে একাধিক সিরিজ), হালকা রেফারেন্স-গ্রিডলাইন প্রকৃত তথ্য পড়াকে সহজ করে, শুধু সজ্জা নয়। নীতিটি "গ্রিডলাইন কখনো নয়" নয় — নীতিটি "গ্রিডলাইন থাকলে যেন সেটি ডেটা পড়তে সাহায্য করে, এবং যতটা সম্ভব হালকা/সূক্ষ্ম হয়"।
প্র ০৩ উপরের "আফটার" উদাহরণে বারের উপর সরাসরি সংখ্যা লেখা হয়েছে, যা প্রযুক্তিগতভাবে অতিরিক্ত "কালি" যোগ করে। এটি কেন তবু ডেটা-ইঙ্ক রেশিওর নীতির সাথে সাংঘর্ষিক নয়?
ডেটা-ইঙ্ক রেশিও বাড়ানোর লক্ষ্য "কম কালি" নিজেই নয় — লক্ষ্য হলো প্রতিটি কালির একক যেন প্রকৃত তথ্য বহন করে। সংখ্যা-লেবেল নিজেই একটি ডেটা মান প্রকাশ করে (এটি সজ্জা নয়, এটি নিজেই তথ্য), তাই এটি রেশিওর "লব" (numerator)-এ যোগ হয়, "হর"-এ অপ্রয়োজনীয় সংযোজন হিসেবে নয়। বিপরীতে, একটি সজ্জামূলক আইকন কোনো সংখ্যাগত তথ্য প্রকাশ করে না, তাই সেটিই আসল "জাঙ্ক"।
অনুশীলন
-
প্রয়োগ করুন: একটি বিদ্যমান ড্যাশবোর্ড বা রিপোর্টের চার্ট মনে করুন (নিজের অফিস/স্কুল/অ্যাপ
থেকে) যা আপনার কাছে "ভারী" বা বিভ্রান্তিকর মনে হয়েছিল। ডেটা-ইঙ্ক রেশিওর দৃষ্টিকোণ থেকে সেখানে কোন
নির্দিষ্ট উপাদানগুলো চার্টজাঙ্ক ছিল বলে আপনার মনে হয়?
সাধারণ উত্তরে থাকতে পারে — অপ্রয়োজনীয় ব্যাকগ্রাউন্ড রঙ/ছবি, প্রতিটি ডেটা পয়েন্টের জন্য আলাদা আলংকারিক আইকন, ভারী 3D শ্যাডো, ঘন গ্রিডলাইন, বা এমন একাধিক রঙ ব্যবহার যা কোনো ক্যাটাগরিকাল অর্থ বহন করে না (শুধু "রঙিন দেখাতে")। মূল পরীক্ষা: সেই উপাদানটি সরিয়ে দিলে কি কোনো তথ্য হারানো যেত, নাকি চার্টটি বরং পড়া সহজ হতো?
-
প্রয়োগ করুন: আপনাকে একটি সাপ্তাহিক ওয়েবসাইট-ভিজিটর কাউন্ট দেখানো একটি লাইন চার্ট
ডিজাইন করতে বলা হয়েছে যেখানে দর্শককে দ্রুত বুঝতে হবে ভিজিটর কবে সর্বোচ্চ ও সর্বনিম্ন ছিল। ডেটা-ইঙ্ক
রেশিও নীতি প্রয়োগ করে ৩টি নির্দিষ্ট ডিজাইন সিদ্ধান্ত লিখুন যা আপনি নেবেন।
যুক্তিসঙ্গত সিদ্ধান্তগুলো হতে পারে — (১) ভারী গ্রিডলাইনের বদলে শুধু একটি হালকা x-অক্ষ ও y-অক্ষের রেখা রাখা, (২) সর্বোচ্চ ও সর্বনিম্ন বিন্দুতে সরাসরি একটি ছোট লেবেল/মার্কার যোগ করা (এটি ডেটা নিজেই, তাই গ্রহণযোগ্য), (৩) 2D, একরঙা লাইন ব্যবহার করা, কোনো গ্র্যাডিয়েন্ট ফিল বা ছায়া ছাড়া — যাতে চোখ সরাসরি লাইনের ওঠানামার দিকে যায়, কোনো সজ্জার দিকে নয়।
আরও পড়ুন · ABCL TECH-এ আপনার পরবর্তী পদক্ষেপ
- পরবর্তী পাঠ — আইকনোগ্রাফি ও ভিজ্যুয়াল ল্যাঙ্গুয়েজ সিস্টেম L38 চার্টের বাইরে গিয়ে সামগ্রিক প্রোডাক্টের ভিজ্যুয়াল ভাষা — আইকন ডিজাইন ও কনসিস্টেন্সির নীতি।
- আগের পাঠ — ইনফরমেশন ভিজ্যুয়ালাইজেশনের ভিত্তি L36 ভিজ্যুয়াল এনকোডিং ও পারসেপচুয়াল-অ্যাকুরেসি — সঠিক চার্ট-টাইপ বাছাইয়ের ভিত্তি, এই পাঠের ডেটা-ইঙ্ক নীতির পূর্বশর্ত।
- কোর্সের সম্পূর্ণ সিলেবাস দেখুন ৫৭টি পাঠ কগনিটিভ সাইকোলজি, ইন্টারঅ্যাকশন ডিজাইন, ইউজেবিলিটি হিউরিস্টিক্স, ইউজার রিসার্চ, প্রোটোটাইপিং, ইভালুয়েশন মেথড, ভিজ্যুয়াল ডিজাইন, অ্যাক্সেসিবিলিটি ও ক্যাপস্টোন।