מהו ערוץ אלפא? איך עובדת שקיפות בתמונות

כל פיקסל בתמונה רגילה מתואר בשלושה מספרים: כמה אדום, ירוק וכחול יש בו. זה מספיק כדי לומר באיזה צבע הפיקסל, אבל לא אם אפשר לראות דרכו. ערוץ האלפא הוא מספר רביעי לכל פיקסל שעושה בדיוק את זה: הוא שומר את האטימות, משקוף לגמרי ועד אטום לגמרי.

כשאנשים מדברים על "PNG עם רקע שקוף", הם מתכוונים לתמונה עם ערוץ אלפא שבה לפיקסלים של הרקע יש אלפא אפס. המדריך מסביר איך המספר הזה עובד, את שתי הדרכים שבהן תוכנות שומרות אותו, למה קצוות מתקלקלים, ואיך בודקים מה באמת יש בקובץ.

RGBA: ארבעה ערוצים לכל פיקסל

MDN מגדירה את ערוץ האלפא בפשטות: צבעים בנויים מערוצים (אדום, ירוק וכחול), וכדי לתאר צבע "שדרכו אפשר לראות את הרקע במידה מסוימת" מוסיפים ערוץ רביעי. תמונה עם כל הארבעה נקראת RGBA.

אפשר לכתוב את הערך בכמה דרכים, וכולן אומרות אותו דבר:

מפרט ה-PNG מנסח את זה במדויק: ערך אלפא אפס הוא שקיפות מלאה, הערך המקסימלי לעומק הביט הוא אטימות מלאה, וערכי ביניים הם פיקסלים שקופים בחלקם "שאפשר להרכיב מול תמונת רקע".

ערכי הביניים האלה הם החלק החשוב. גזירה טובה היא לא רק "אובייקט אטום, רקע שקוף". הפיקסלים לאורך הקצה, במיוחד בשיער, בפרווה, בבד, בזכוכית ובטשטוש תנועה, שקופים בחלקם, וזה מה שגורם לאובייקט להיראות טבעי על רקע חדש במקום להיראות כאילו נגזר במספריים.

איך מצויר פיקסל שקוף

כשאפליקציה מניחה את התמונה שלכם מעל משהו אחר, היא מערבבת כל פיקסל עם מה שמאחוריו. מפרט ה-Compositing and Blending של W3C נותן את הנוסחה הבסיסית:

result = Cs x as + Cb x ab x (1 - as)

Cs, as = color and alpha of your image (the source)
Cb, ab = color and alpha of what is behind it (the backdrop)

במקרה הנפוץ של רקע אטום, זה הופך לממוצע משוקלל. פיקסל עם אלפא 0.3 תורם 30% מהצבע שלו ומעביר 70% מהרקע.

אלפא ישירה מול אלפא מוכפלת מראש

יש שתי דרכים לשמור את הצבע של פיקסל שקוף בחלקו, ובלבול ביניהן הוא מקור קלאסי לשוליים כהים או בהירים.

אלפא ישירה (straight, נקראת גם לא משויכת או לא מוכפלת מראש) שומרת את הצבע כאילו הפיקסל אטום לגמרי, ואת האטימות בנפרד. פיקסל אדום טהור חצי שקוף נשמר כאדום 255, ירוק 0, כחול 0, אלפא 128.

אלפא מוכפלת מראש (premultiplied, נקראת גם משויכת) שומרת את הצבע כשהוא כבר מוכפל באלפא. אותו פיקסל נשמר כאדום 128, ירוק 0, כחול 0, אלפא 128. כמו שמפרט ה-PNG מנסח, תמונה כזו "כבר הורכבה מול רקע שחור".

באיזו מהן קובץ משתמש תלוי בפורמט ובתוכנה:

• PNG תמיד משתמש באלפא ישירה. המפרט אומר זאת במפורש, ומציין שזה מאפשר לעורך לשנות בקלות את השקיפות של תמונה.
• צינורות גרפיקה, מנועי משחקים וכלי הרכבת וידאו עובדים לעיתים קרובות באלפא מוכפלת מראש בתוכם, כי המתמטיקה של הערבוב פשוטה יותר והסינון מתנהג טוב יותר.

הבעיות מתחילות כשתוכנה אחת כותבת ערכים מוכפלים מראש ותוכנה אחרת קוראת אותם כישירים. הצבעים לאורך הקצוות יוצאים כהים מדי, ונוצר קו מתאר שחור דק. בכיוון ההפוך הקצוות בהירים מדי. אם אתם רואים שוליים כהים קבועים סביב כל גזירה מכלי מסוים, אי התאמה בהכפלה מראש היא הדבר הראשון לחשוד בו.

למה לגזירות יש הילות

הילה היא שוליים נראים סביב האובייקט שלא שייכים לו. יש ארבע סיבות נפוצות, ולכל אחת תיקון משלה.

1. הרקע הישן נטמע בפיקסלי הקצה

מצלמה אף פעם לא קולטת גבול נקי. קווצת שיער מול גדר חיה ירוקה יוצרת פיקסלים שהם חלקם שיער וחלקם גדר. אם הגזירה שומרת את הצבעים המקוריים של הפיקסלים האלה ורק הופכת אותם לחצי שקופים, הירוק נשאר מעורבב בהם. על לבן, לאובייקט יש עכשיו זוהר ירקרק חלש.

התיקון הוא ניקוי צבע (decontamination): הערכה של צבע החזית האמיתי לכל פיקסל בקצה וכתיבתו במקום. ב-Photoshop זה נקרא Decontaminate Colors בסביבת העבודה Select and Mask, ולספריית הקוד הפתוח rembg יש אפשרות decontaminate שעושה אותו דבר. זה משנה את צבעי הקצה, אף פעם לא את צורת המסכה.

2. המסכה קשה מדי

אם במסכה יש רק פיקסלים אטומים לגמרי ושקופים לגמרי, הקצוות נראים משוננים, וכל החלקת קצוות (antialiasing) בתמונה המקורית משאירה קו ברוחב פיקסל בצבע הרקע סביב האובייקט. אובייקטים רכים כמו שיער צריכים מסכה רכה עם ערכי ביניים אמיתיים.

3. צבעים נסתרים בפיקסלים שקופים

לפיקסל עם אלפא אפס עדיין יש ערכי אדום, ירוק וכחול בקובץ עם אלפא ישירה. לא רואים אותם, אבל שינוי גודל או טשטוש של תמונה מערבבים פיקסלים שכנים, ואם הצבעים הנסתרים האלה לבנים או שחורים הם זולגים לקצה הנראה. ספריות תמונה טובות נמנעות מזה בהכפלה מראש לפני שינוי הגודל והמרה חזרה אחריו.

4. התמונה שוטחה על צבע

GIF ו-PNG עם פלטה תומכים לעיתים קרובות רק בשקיפות של כן או לא, ולכן כלים מחליקים את הקצה מול צבע רקע (matte), בדרך כלל לבן, לפני השמירה. תמונה כזו נראית טוב על לבן ומראה שוליים לבנים על כל דבר כהה יותר. אם הגזירה תשב על רקעים כהים, ייצאו אותה עם אלפא מלאה.

מסכות, mattes ואלפא: אוצר המילים

המילים האלה חופפות ומשתמשים בהן באופן חופשי. כך בדרך כלל מתכוונים אליהן:

• ערוץ אלפא: ערכי האטימות שנשמרים בתוך קובץ התמונה, אחד לכל פיקסל.
• מסכה (mask): תמונה בגווני אפור ששולטת אילו חלקים של תמונה אחרת נראים. במסכות שכבה ב-Photoshop, לבן חושף ושחור מסתיר, ואפור נראה בחלקו. אפשר לערוך מסכה בלי לגעת בפיקסלים המקוריים, ולכן אנשי מקצוע מסירים רקעים עם מסכות ולא במחיקה.
• Matte: המונח מעולם הקולנוע וההרכבה לאותו רעיון, תמונה בגווני אפור שמגדירה מה נשמר. "Matting" היא הבעיה של חישוב mattes רכים ומדויקים לקצוות קשים כמו שיער.
• Trimap: מפה גסה של שלושה אזורים (חזית בוודאות, רקע בוודאות, לא בטוח) שחלק מאלגוריתמי ה-matting משתמשים בה כנקודת התחלה.
• מסכה בינארית או קשה: רק שחור ולבן, בלי אפור. בסדר לקופסאות וללוגואים, חלשה בשיער.
• גזירה (cut-out): התוצאה הסופית, הצבעים של האובייקט יחד עם ערוץ אלפא.

מסכה וערוץ אלפא מחזיקים את אותו מידע. כלים רבים מאפשרים לייצא כל אחד מהם: PNG שקוף עם אלפא מובנית, או תמונת מסכה נפרדת בשחור-לבן שמחילים בעצמכם בעורך או בכלי וידאו.

אילו פורמטים יכולים לשמור אלפא

להשוואה מלאה של הפורמטים האלה, ראו PNG מול JPEG מול WebP.

איך בודקים אם בתמונה יש שקיפות

קובץ שמסתיים ב-.png הוא לא הוכחה לשקיפות. הרבה קובצי PNG אטומים לגמרי, וחלק מהתמונות ה"שקופות" שמוצאים ברשת הן קובצי JPEG שצויר לתוך הפיקסלים שלהם דפוס שחמט אפור-לבן. הנה דרכים אמינות לבדוק.

בעין

הניחו את התמונה על רקע כהה ועל רקע בהיר, למשל בשקופית או בכלי עיצוב. בגזירה אמיתית צבע הרקע נראה סביב האובייקט בשני המקרים. אם עדיין רואים דפוס שחמט, הוא חלק מהתמונה, לא שקיפות.

עם ImageMagick

# Does the file have an alpha channel at all?
identify -format "%A\n" photo.png

# Is it fully opaque anyway? (true means no visible transparency)
identify -format "%[opaque]\n" photo.png

%A מדווח על ערוץ השקיפות (המילה המדויקת שמודפסת שונה בין ImageMagick 6 ל-7), ו-%[opaque] מחשב אם כל פיקסל אטום לגמרי. רוצים ערוץ אלפא ו-false.

עם Python ו-Pillow

from PIL import Image

im = Image.open("photo.png")
print(im.mode)                    # RGBA or LA means an alpha channel
print(im.has_transparency_data)   # True if the file carries any transparency info

if "A" in im.getbands():
    lo, hi = im.getchannel("A").getextrema()
    print("alpha range:", lo, hi)  # lo == 255 means nothing is transparent

בדיקת הקצוות של טווח הערכים תופסת את המקרה הנפוץ של קובץ RGBA שבו כל פיקסל אטום.

כשהפלטפורמה מתעלמת מאלפא

יש מקומות שמסירים שקיפות או מתעלמים ממנה. Etsy אומרת ש-PNG שקוף לא נתמך ושאזורים שקופים עלולים להופיע בשחור, וזירות מסחר כמו Amazon ו-Walmart ממילא רוצות תמונות ראשיות על לבן טהור. במקרים האלה, שטחו בעצמכם את הגזירה על צבע הרקע כדי לשלוט בתוצאה. באתר שלכם, במצגות ובכלי עיצוב, שמרו על האלפא.

ערוץ אלפא נקי במהירות

אם אתם צריכים גזירות עם קצוות רכים ולא מסכות קשות, removebackground.dev מפיק קובצי PNG או WebP שקופים עם ערוץ אלפא מלא, וה-API שלו יכול גם להחזיר את מסכת גווני האפור לבדה.