Dlaczego mój przezroczysty plik PNG nie wygląda dobrze?

Chcę przekonwertować plik JPG na przezroczysty i za pomocą GIMP dodałem warstwy alfa i przezroczystość w ten sam sposób, w jaki robię GIF przezroczysty. Przekształciłem go na PNG, ale nie wyświetla się dobrze po załadowaniu do mojego szablonu:

Oryginalny obraz to

Dlaczego nie wygląda dobrze, gdy jest zrobiony z przezroczystego PNG? Czy mogę mieć więcej szczęścia, tworząc przejrzysty plik GIF? LUB to niebieskie kolory, które nie pasują dobrze do czerni i mógłbym mieć więcej szczęścia, używając innych logo:

Dzięki

Głównym sztuczka, w moim doświadczeniu, aby dodać gładką przejrzystość obrazu w GIMP jest za pomocą warstwy → Transparency → Kolor do Alfy ... narzędzia. Oczywiście musisz wiedzieć, jak z niego korzystać, aby uzyskać dobry efekt - samo w sobie sprawia, że ​​Twoje zdjęcia wyglądają śmiesznie i półprzezroczysto.

Jeśli wezmę zdjęcie, które opublikowałeś powyżej, i po prostu uruchomię na nim Color to Alpha (oczywiście wybieram biały dla przezroczystego koloru), otrzymuję to:

Jak widać, ten obraz wygląda dobrze na jasnym tle. Niestety, umieszczenie go na ciemnym tle powoduje, że szare elementy znikają całkowicie, a niebieskie części też nie wyglądają tak świetnie:

Problem polega na tym, że narzędzie Color to Alpha zrobiło to, co powinno: przekonwertowało całą biel oryginalnego obrazu na przezroczystość. Oznacza to, że szare linie stały się półprzezroczyste czarne linie, a jasnoniebieski stał się półprzezroczysty ciemnoniebieski.

Jednak tak naprawdę chcemy , aby podstawowe kolory tekstu i innych elementów logo pozostały nieprzezroczyste, a tylko antyaliasingowane piksele wokół ich krawędzi powinny stać się półprzezroczyste. Aby to naprawić, musimy dodać trochę bieli z powrotem do kolorów. Jednym ze sposobów na osiągnięcie tego, dla takiego obrazu, w którym nieprzezroczyste obszary składają się głównie z pojedynczych kolorów, jest:

1. Powiel warstwę.

2. W dolnej warstwie przekonwertuj przezroczystość na maskę, wykonując Warstwa → Maska → Dodaj maskę warstwy ... i wybierając „Przenieś kanał alfa warstwy”.

3. Po przeniesieniu przezroczystości na maskę spraw, aby dolna warstwa była całkowicie biała (np. Za pomocą narzędzia Wypełnianie wiadra w trybie „Wypełnij cały wybór”).

4. Dodałeś teraz trochę bieli do wszystkich kolorów obrazu, ale wnętrza liter i cyfr wciąż nie są całkowicie nieprzejrzyste. Aby tak było, musimy znormalizować maskę na dolnej warstwie - ale ponieważ różne części obrazu mają różne kolory i jasność, musimy to zrobić osobno dla każdej części.

   Aby to zrobić, kliknij maskę dolnej warstwy w oknie dialogowym Warstwy, aby ją edytować, użyj narzędzia Zaznaczanie prostokąta, aby zaznaczyć każdą odrębną część obrazu („B”, „NANO” i rysunek nad nimi) w obróć i uruchom Kolory → Auto → Normalizuj przy każdym wyborze.

Po wykonaniu tego wszystkiego (i opcjonalnie scaleniu warstw) wynik powinien wyglądać następująco:

Jeśli porównasz to z pierwszym obrazem powyżej, nie będzie prawie żadnej różnicy. Ale zobacz, co się stanie, gdy umieścimy to na czarnym tle:

Teraz kolory wyglądają nieprzezroczysto, ale tło jest nadal przezroczyste, a krawędzie gładkie.

Niestety, wokół liter widać także szare obramowanie, zwłaszcza „B”. Podejrzewam, że dzieje się tak głównie dlatego, że oryginalny obraz JPEG już cierpiał z powodu utraty barwy w tych obszarach z powodu stratnej kompresji, po prostu nie był tak widoczny na białym tle. Są dwa sposoby (o których wiem), aby spróbować to naprawić: możesz albo ręcznie dostosować poziomy kolorów maski na białej warstwie, aby zmniejszyć obwódkę, lub możesz spróbować pobrać próbki jednolitych kolorów z liter na oryginalnym obrazie i zastępując biel na dolnej warstwie białą jednolitymi kolorami (Rectangle Select, Bucket Fill). Lub możesz nawet wypróbować jedno i drugie.

Jednak to wszystko jest naprawdę czymś, czego powinieneś spróbować tylko wtedy, gdy nie masz innego wyboru. O wiele lepszym rozwiązaniem jest znalezienie oryginalnych plików wektorowych (AI, SVG, EPS, PDF itp.), Z których te logo zostały z pewnością renderowane - powinny mieć pełną informację o przezroczystości, być wolne od artefaktów kompresji, a także być skalowalne ! Tylko jeśli naprawdę niemożliwe jest uzyskanie oryginałów, powinieneś nawet rozważyć pracę z plikami JPEG o niskiej rozdzielczości, takimi jak te.

Ponadto, nawet jeśli ostatecznie użyjesz map bitowych, nadal możesz uzyskać znacznie czystszy wynik, przerysowując niektóre elementy - w szczególności tekst, który wydaje się prosty Copperplate .

Problem polega na tym, że obraz ma „blaknięcie do bieli” na krawędziach i nie został on usunięty. Zanikanie lub wygładzanie uzyskuje się za pomocą szarości, które stają się wysokim kontrastem w stosunku do ciemniejszych kolorów.

Nie używam GIMP, ale najprościej mówiąc, najłatwiejszym sposobem jest utworzenie nowej warstwy na spodzie stosu warstw i wypełnienie jej kolorem oczywistym, wysokim kontrastem i ogólnie nie na zdjęciu. Często używam RGB (255,0,0). Spowoduje to natychmiastowe wyróżnienie wszystkich obszarów, które należy usunąć lub dostosować, aby obraz działał na dowolnym tle. Musisz usunąć (a nie kolor biały) obszary w górnych warstwach, aby zobaczyć czerwony kolor z dolnej warstwy. Po zakończeniu usuń lub ukryj warstwę kontrastową przed eksportowaniem PNG. Ta warstwa kontrastowa jest szczególnie pomocna, ponieważ można zobaczyć wynik końcowy bez konieczności eksportowania go do testowania.

To, co chcesz zakończyć, to w zasadzie pojedyncza warstwa z usuniętymi wszystkimi przezroczystymi częściami (nie białymi, ale przezroczystymi). Generalnie używam do tego masek warstw, ponieważ jest to nieniszczące, ale robię wszystko, co trzeba.

Myślę jednak, że lepsze wyniki uzyskasz, jeśli zrekonstruujesz elementy zamiast importować tylko JPEG. Ponadto, linie w tym są bardzo cienkie i jasne, a na czarnym mogą spaść.

W niektórych przypadkach lepiej jest wyobrazić sobie, że logo jest pieczęcią lub naklejką, zostaw wewnętrzne bity białe i wytnij białą linię o wymiarach 5 pikseli wokół zewnętrznych krawędzi.