Gambar & foto · Editor Gambar & Gambar Browser
Grafik raster vs vektor: mengapa gambar pada foto menjadi piksel
· Latar belakang
pengeditan gambar kanvas pemrosesan browser
Gambar raster adalah kisi-kisi piksel; grafik vektor adalah instruksi untuk menggambar bentuk. Postingan ini menjelaskan perbedaannya, mengapa sebuah foto hanya bisa berupa raster, dan mengapa apa pun yang Anda gambar di dalamnya akan mengalami nasib yang sama saat diekspor.
Logo yang menjadi buram dan foto yang tidak pernah bisa 'divektorkan' — dua kebingungan sehari-hari dengan satu penjelasan
Logo buram dan foto beranotasi sering kali dianggap sebagai penyebab masalah yang sama, namun keduanya berasal dari jenis material yang berbeda. Logo vektor adalah sekumpulan instruksi untuk jalur, guratan, dan isian; sebuah foto adalah bidang warna sampel yang terbatas. Editor membuka foto sebagai bitmap raster berukuran kanvas, sehingga dunia kerjanya sudah berupa kisi-kisi piksel sebelum garis atau persegi panjang digambar.
Gambarlah sebuah kotak di atas foto, ekspor, dan perbesar tepinya. Hasilnya adalah gambar raster yang anotasinya menempati piksel di samping foto. Bandingkan file tersebut dengan SVG asli pada ukuran tampilan yang lebih besar dan perbedaannya akan terlihat: memperbesar ekspor akan mengambil sampel ulang kisi-kisinya, sementara memperbesar SVG akan menghitung ulang jalurnya. Editor ini tidak mengubah objek pertama menjadi objek kedua.
Raster: kisi-kisi sel berwarna — cara PNG, JPEG, dan WebP menyimpan gambar dan alasan peningkatan skala menghasilkan piksel
Gambar raster merekam warna pada posisi dalam grid. PNG, JPEG, dan WebP berbeda dalam pengkodean dan kompresinya, namun gambar yang diekspor masih berubah menjadi piksel saat ditampilkan. Batas satu piksel, kurva anti-alias, dan keterangan kecil semuanya merupakan sampel terbatas pada gambar akhir. Menskalakan file ke atas memerlukan proses interpolasi untuk memperkirakan sampel tambahan; itu tidak memulihkan instruksi gambar asli.
Batasan tersebut penting ketika anotasi harus tetap tajam dalam berbagai ukuran. Keterangan tangkapan layar yang ditujukan untuk satu tampilan tetap bisa sama persis dengan ekspor raster, sementara tanda merek yang ditujukan untuk tanda, cetakan, dan beberapa antarmuka biasanya tetap tersedia sebagai aset vektor. Gunakan editor untuk gambar komposit, bukan sebagai pengganti karya seni sumber yang harus diskalakan secara independen.
Vektor: bentuk yang dijelaskan secara matematis — jalur, guratan, dan isian dalam format seperti SVG, dan alasannya dapat diskalakan tanpa kehilangan
Vektor menggambarkan geometri daripada menyimpan setiap piksel yang ditampilkan. Jalur SVG dapat menentukan kurva, lebar guratan, isian, dan transformasi; penyaji kemudian menghitung piksel yang sesuai dengan ukuran saat ini. Itu sebabnya tanda sederhana yang sama bisa tetap bersih bila ditempatkan pada beberapa dimensi. Penjelasannya adalah latar belakang tingkat format, bukan klaim bahwa editor ini mengeluarkan atau menyimpan instruksi tersebut.
Editor browser menggunakan informasi geometris sementara untuk gestur garis dan bentuk, yang memungkinkan pratinjau mengikuti penunjuk sebelum dirilis. Setelah isyarat selesai, hasilnya dicat menjadi lapisan raster. Ekspor menggabungkan lapisan yang terlihat dan memanggil canvas.toBlob untuk PNG, JPEG, atau WebP. Tidak ada dokumen proyek ekspor atau vektor SVG di jalur ini, sehingga geometri tidak dapat bertahan sebagai objek independen.
Mengapa foto pada dasarnya bersifat raster — sensor menangkap sampel, bukan bentuk, dan tidak ada konversi yang mengubahnya
Foto adalah materi raster karena kamera merekam sampel cahaya melalui sensor dan menyimpan sampel tersebut sebagai data gambar. Mendeskripsikan sebuah foto sebagai vektor memerlukan interpretasi yang menggantikan tekstur, noise, bayangan, dan detail tidak beraturan dengan bentuk yang diciptakan. Meningkatkan atau mengekspornya secara berbeda dapat mengubah grid, namun tidak ada operasi yang mengubah jenis informasi yang terkandung dalam tangkapan asli.
Perbedaan ini juga menjelaskan mengapa sebuah foto dan logo dapat hidup berdampingan dalam satu pengeditan tanpa menjadi satu kesatuan. Logo mungkin dimulai sebagai vektor di tempat lain, namun setelah digambar ke foto raster di editor ini, hasil gabungannya adalah kisi piksel. Pertahankan logo asli secara terpisah jika diperlukan penggunaan kembali di masa mendatang, dan perlakukan ekspor browser sebagai gambar akhir untuk tujuannya saat ini.
Menggambar pada raster: apa yang dilakukan editor — anotasi mungkin berbentuk saat Anda mengedit, namun gambar yang diekspor adalah satu kotak
Selama isyarat, alat garis dan bentuk dapat berperilaku seperti instruksi geometris yang ringkas: editor mengetahui titik awal, titik akhir, kerangka, dan pratinjau saat ini. Saat dirilis, instruksi tersebut dirender ke dalam lapisan raster. Tanda kuas adalah cat raster saat dibuat, dan teks diraster pada penempatannya, bukan dipertahankan sebagai objek teks yang dapat dipindahkan. Oleh karena itu, sesi ini menawarkan kemudahan tanpa menjanjikan kemampuan mengedit di tingkat objek nantinya.
Ekspor membuat batasan menjadi jelas. Lapisan raster yang terlihat digabungkan menjadi satu kanvas, kemudian dikodekan sebagai PNG, JPEG, atau WebP melalui browser. Membuka kembali file itu memberi Anda foto dan menandainya sebagai piksel biasa; itu tidak memberi penerima persegi panjang yang dapat dipilih, jalur yang dapat digunakan kembali, atau keterangan yang dapat diedit. Pertahankan sesi berlapis atau aset sumber jika Anda mungkin perlu mengubah anotasi, bukan sekadar membagikan gambar.
Memilih jenis yang tepat untuk pekerjaan itu — kapan harus meminta logo vektor dan kapan ekspor raster adalah hal yang Anda inginkan
Pilih aset vektor ketika tanda itu sendiri harus berpindah: logo memerlukan beberapa ukuran, diagram dapat direvisi, atau simbol harus ditempatkan pada banyak latar belakang. Pilih ekspor raster jika tujuannya adalah tangkapan layar yang siap dibagikan, bukti dengan info, atau foto berisi catatan yang terlihat. Keputusan yang tepat diambil dari penggunaan berikutnya, bukan berdasarkan keyakinan bahwa satu format selalu lebih unggul.
Browser Image & Drawing Editor cocok untuk kategori kedua. Itu dapat menempatkan tanda teks kuas, garis, persegi panjang, elips, dan raster pada foto, lalu mengekspor komposit sebagai file raster. Itu tidak dapat menampilkan SVG atau mempertahankan model objek vektor. Jika klien meminta logo sebagai aset independen, kembalilah ke sumber vektor asli alih-alih mengekstrak versi yang lebih besar dari piksel yang diedit.
Kesimpulan: ketahui yang mana yang Anda pegang — bagaimana Browser Image & Drawing Editor mengedit gambar raster dan mengekspor gambar raster, berdasarkan desain
Model mental yang dapat diandalkan sederhana saja: editor dapat menggunakan geometri untuk mendeskripsikan suatu isyarat, namun dokumen dan ekspornya adalah gambar raster. Setiap lapisan foto dan editor yang dibuka memiliki kisi piksel yang terbatas. Memperbesar grid tersebut mengambil sampel ulang informasi yang ada, dan mengekspor gabungan lapisan yang terlihat ke dalam raster lain. Tidak ada langkah dalam alur kerja ini yang membuat jalur vektor yang dapat digunakan kembali dari garis yang telah menjadi piksel.
Periksa jenis file dan penerima yang dituju sebelum Anda menggambar. Jika penerima perlu melihat satu gambar yang sudah selesai, ekspor raster dan periksa tepinya pada ukuran tampilan sebenarnya. Jika penerima perlu mengedit tanda, mewarnai ulang logo, atau menskalakan karya seni berulang kali, berikan sumber vektor atau berlapis yang sesuai. Pembedaan tersebut mencegah ekspor yang sah secara teknis disalahartikan sebagai jenis penyerahan yang berbeda.