Mengapa PNG transparan saya tidak terlihat bagus?

Saya ingin mengonversi JPG menjadi transparan dan menggunakan GIMP. Saya menambahkan lapisan alfa dan transparansi dengan cara yang sama dengan membuat GIF transparan. Saya mengonversinya menjadi PNG tetapi tidak ditampilkan dengan baik ketika saya memuatnya di templat saya:

Gambar aslinya adalah

Mengapa tidak terlihat bagus saat dibuat menjadi PNG transparan? Bisakah saya lebih beruntung membuat GIF transparan? ATAU apakah itu warna biru yang tidak cocok dengan hitam dan saya bisa lebih beruntung menggunakan beberapa logo lainnya:

Terima kasih

Trik utama, dalam pengalaman saya, untuk menambahkan transparansi halus untuk gambar di GIMP adalah menggunakan lapisan → Transparansi → Warna untuk Alpha ... alat. Tentu saja, Anda harus tahu cara menggunakannya untuk efek yang baik - dengan sendirinya, yang dilakukannya hanyalah membuat gambar Anda terlihat lucu dan transparan.

Jika saya mengambil gambar yang Anda posting di atas, dan jalankan saja Color to Alpha (memilih putih untuk warna transparan, tentu saja), yang saya dapatkan adalah ini:

Seperti yang Anda lihat, gambar ini terlihat bagus di latar belakang yang terang. Sayangnya, meletakkannya di latar belakang yang gelap membuat elemen abu-abu menghilang sepenuhnya, dan bagian biru juga tidak tampak hebat:

Masalahnya adalah bahwa alat Color to Alpha melakukan apa yang seharusnya dilakukan: itu mengubah semua putih dalam gambar asli menjadi transparansi. Ini berarti bahwa garis abu-abu menjadi garis hitam semi-transparan , dan biru muda menjadi semi-transparan biru tua.

Apa yang benar - benar kita inginkan , bagaimanapun, adalah mungkin bahwa warna dasar teks dan elemen-elemen lain dari logo harus tetap buram, dan hanya piksel anti-alias di sekitar tepinya yang menjadi semi-transparan. Untuk memperbaikinya, kita perlu menambahkan kembali putih ke dalam warna. Salah satu cara untuk mencapai itu, untuk gambar seperti ini di mana area buram sebagian besar terdiri dari warna tunggal, adalah ini:

1. Gandakan layer.

2. Pada lapisan bawah, ubah transparansi menjadi mask dengan melakukan Layer → Mask → Add Layer Mask ... dan pilih "Transfer saluran alpha layer".

3. Setelah mentransfer transparansi ke mask, buat layer bawah benar-benar putih (mis. Menggunakan alat Bucket Fill dalam mode "Fill whole selection").

4. Anda sekarang telah menambahkan beberapa warna putih ke semua warna gambar, tetapi interior huruf dan gambar masih belum sepenuhnya buram. Untuk membuatnya begitu, kita perlu menormalkan topeng di lapisan bawah - tetapi, karena bagian-bagian berbeda dari gambar memiliki warna dan cahaya yang berbeda, kita perlu melakukannya secara terpisah untuk setiap bagian.

   Untuk melakukan itu, klik pada topeng dari lapisan bawah dalam dialog Layers untuk mengeditnya, gunakan alat Pilih Persegi Panjang untuk memilih setiap bagian yang berbeda dari gambar ("B", "NANO" dan gambar di atas mereka) di putar, dan jalankan Warna → Otomatis → Normalisasi pada setiap pilihan.

Setelah melakukan semua itu (dan secara opsional menggabungkan layer), hasilnya akan terlihat seperti ini:

Jika Anda membandingkan ini dengan gambar pertama di atas, hampir tidak ada perbedaan untuk dilihat. Tapi lihat apa yang terjadi ketika kita meletakkannya di latar belakang hitam:

Sekarang warnanya terlihat buram, tetapi latar belakangnya masih transparan dan tepinya halus.

Untungnya, Anda juga dapat melihat beberapa warna abu-abu di sekitar huruf, terutama huruf "B". Saya menduga ini sebagian besar karena gambar JPEG asli sudah menderita kehilangan kroma di daerah-daerah karena kompresi lossy, hanya saja tidak begitu jelas pada latar belakang putih. Ada dua cara (yang saya tahu) untuk mencoba memperbaikinya: Anda dapat secara manual menyesuaikan tingkat warna topeng pada lapisan putih untuk mengurangi pinggiran, atau Anda dapat mencoba mengambil sampel warna solid dari huruf-huruf dalam gambar asli dan mengganti putih di lapisan bawah putih warna-warna solid (Pilih Rectangle, Bucket Fill). Atau Anda bahkan dapat mencoba keduanya.

Namun, semua ini benar-benar sesuatu yang hanya boleh Anda coba jika Anda tidak punya pilihan lain. Solusi yang jauh lebih baik adalah dengan mencoba dan menemukan file vektor asli (AI, SVG, EPS, PDF, dll.) Dari mana logo-logo ini pasti diberikan - mereka harus memiliki informasi transparansi penuh, bebas dari artefak kompresi, dan dapat diskalakan juga ! Hanya jika benar-benar mustahil untuk mendapatkan dokumen asli yang Anda pertimbangkan untuk bekerja dari file JPEG beresolusi rendah seperti ini.

Juga, bahkan jika Anda akhirnya menggunakan bitmap, Anda masih bisa mendapatkan hasil yang jauh lebih bersih dengan menggambar ulang beberapa elemen - khususnya teks, yang tampaknya Copperplate sederhana .

Masalahnya di sini adalah bahwa gambar memiliki "fade-to white" di tepinya, dan Anda belum menghapus ini. Fade atau anti-aliasing dicapai dengan menggunakan abu-abu yang menjadi kontras tinggi terhadap warna yang lebih gelap.

Saya tidak menggunakan GIMP, tetapi secara sederhana, cara termudah untuk bekerja dengan ini adalah dengan membuat layer baru di bagian bawah tumpukan layer dan mengisinya dengan warna yang jelas, kontras tinggi, dan umumnya tidak dalam gambar. Saya sering menggunakan RGB (255,0,0). Ini akan langsung menyoroti untuk Anda semua area yang perlu Anda hapus atau sesuaikan agar gambar dapat bekerja di latar belakang apa pun. Anda perlu menghapus (bukan warna putih) area di lapisan atas sehingga Anda melihat merah dari lapisan bawah yang terlihat. Setelah selesai, Anda menghapus atau menyembunyikan lapisan kontras sebelum mengekspor PNG. Lapisan kontras ini sangat membantu karena Anda dapat melihat hasil akhirnya tanpa perlu mengekspornya untuk menguji.

Yang ingin Anda ketahui adalah pada dasarnya satu lapisan dengan semua bagian transparan dihilangkan (bukan putih, tetapi transparan). Saya menggunakan layer mask secara umum untuk melakukan ini, karena ini tidak merusak, tetapi melakukan apa pun yang perlu dilakukan.

Saya pikir, bagaimanapun, bahwa Anda akan memiliki hasil yang lebih baik jika Anda merekonstruksi elemen daripada hanya mengimpor JPEG. Juga, garis-garis dalam ini sangat tipis dan ringan, dan pada hitam mereka mungkin putus.

Dalam beberapa kasus lebih baik untuk membayangkan logo menjadi cap atau stiker, biarkan bit dalam putih dan garis putih 5px di sekitar tepi luar.