جادوی ریاضی در گرافیک، بیت مپ یا وکتور

تفاوت بیت‌مپ و وکتور برای دانش آموزان

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

برای پاسخ به این سوال باید بگویم بله همین طور است. بعضی تصاویر کیفیت بسیار بالاتری دارند. جدا از مساله نوع ساخت و طراحی یا عکاسی که می تواند روی کیفیت و وضوح آن ها اثرگذار باشد؛ شیوه ذخیره سازی آن ها در کامپیوتر هم روی کیفیت آن ها تاثیر می گذارد. در کامپیوتر تصاویر به دو شکل ذخیره می شوند:

  1. پیکسلی
  2. برداری

پیکسل چیست؟

پیکسل (Pixel) کوچکترین واحد سازندهٔ یک تصویر دیجیتال است، مثل آجرهای یک دیوار یا خانه‌های یک صفحه شطرنج!
اگر یک عکس را از نزدیک نگاه کنید یا خیلی بزرگ کنید (روی آن زوم کنید)، می‌بینید که از هزاران مربع ریز رنگی تشکیل شده است. هر کدام از این مربع‌ها یک پیکسل هستند. پیکسل‌ها مثل «آجرهای دیجیتال» هستند که با کنار هم چیدن آن‌ها، هر تصویری روی صفحه نمایش یا در عکس‌ها ساخته می‌شود.

ویژگی‌های پیکسل:

۱. رنگ: هر پیکسل فقط می‌تواند یک رنگ داشته باشد (مثلاً قرمز، آبی یا ترکیبی از رنگ‌ها).
۲. موقعیت: هر پیکسل در یک سطر و ستون مشخص قرار دارد (مثل مختصات X و Y در ریاضی یا طول و عرض معین).
۳. اندازه: پیکسل‌ها خودشان اندازه فیزیکی ندارند! اندازه‌شان به وسیلهٔ نمایشگر (مثل صفحه گوشی) یا وضوح و کیفیت عکس تعیین می‌شود.

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

1.تصاویر پیکسلی، بیت‌مپ (Bitmap): نقاشی با نقطه‌های رنگی

تصویر پیکسلی
تصویر پیکسلی

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

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

فرمت‌های معروف تصاویر پیکسلی: JPG، PNG، GIF
کاربرد: عکس‌های واقعی (مثل عکس دوربین)، نقاشی‌های پیچیده با سایه‌ها.

فرمت چیست؟

فرض کنید می‌خواهید آب را در ظرف‌های مختلف نگه دارید:

  • آب در بطری = نوشیدنی قابل حمل.
  • آب در لیوان = برای نوشیدن سریع.
  • آب در قوری = برای دم کردن چای.

هر ظرف شکل و کاربرد متفاوتی دارد. فرمت فایل هم دقیقاً همین نقش را ایفا می‌کند.

۲. تصاویر برداری (Vector): نقاشی با فرمول‌های ریاضی

فرض کنید با یک مداد جادویی شکل می‌کشید که هرگز خطوطش تار نمی‌شود! تصاویر برداری با معادلات ریاضی ساخته می‌شوند.
– مثلاً یک دایره با فرمول ریاضی تعریف می‌شود: «مرکز (x,y)، شعاع r».
– وقتی عکس را بزرگ کنید، کامپیوتر فرمول را دوباره محاسبه می‌کند و به این ترتیب تصویر همیشه واضح می ماند! در واقع کامپیوتر هنگام بزرگ و کوچک شدن این نوع از تصاویر هر بار فرمول ذخیره سازی را مجدد حساب کرده و با توجه به اندازه، کیفیت نمایشگر و … موقعیت و اندازه نمایش تصویر را بازسازی می کند. پس پیکسلی در کار نیست که در اثر بزرگ شدن تار شود!

فرمت‌های معروف تصاویر برداری: SVG، AI، EPS
کاربرد: لوگوها، آیکون‌ها، نقشه‌ها، فونت‌ها.

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

تفاوت اصلی در نحوه ذخیره‌سازی:

اما تفاوت بیت‌مپ و وکتور در شیوه ذخیره سازی نیز هست:

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

چه زمانی از هرکدام استفاده کنیم؟

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

جمع‌بندی تفاوت بیت‌مپ و وکتور با یک مثال روزمره:

– اگر یک عکس سلفی بگیرید، آن را به صورت بیت‌مپ (مثل JPG) ذخیره می‌کنید.
– اگر یک لوگو برای مدرسه طراحی کنید، بهتر است آن را برداری (مثل SVG) بسازید تا روی بنر بزرگ هم واضح بماند!

تمرین

تمرین های سایت آیتکس

برای درک بهتر این آموزش تمرین زیر را انجام دهید.

  1. در کامپیوتر، یک عکس JPG را باز کنید و آن را بزرگ کنید تا پیکسل‌ها را ببینید!
  2. دو تصویر زیر را با یکدیگر مقایسه کنید. می توانید این تصاویر را در کامپیوتر یا گوشی همراه خود ذخیره کرده و سپس تمرین را حل کنید. دلایل خود را به صورت تجربی و آزمایشی بدون توجه به نظرات دیگران درباره نوع این تصاویر در بخش نظرات برای من بنویسید.

راهنمایی: بعد از دانلود تصاویر در گوشی همراه بلافاصله روی فایل دانلود شده کلیک کنید و آن را باز کنید.

تصویر سمت راستتصویر سمت چپ
تصویر تمرینتصویر تمرین

مطالب دیگر با همین موضوعات برای دانستن بیشتر...

دیدگاهتان را بنویسید