Seperti apa isi file hasil tracing

Tracer mengelompokkan hasilnya per objek: <g> untuk latar (kalau gambarnya punya latar) ada di urutan pertama, lalu satu <g> untuk setiap objek terpisah, masing-masing diberi nama di <title> (Background, Object 1, Object 2 …). Di dalam setiap grup, setiap bentuk adalah elemen <path> tersendiri, dengan atribut fill dan d yang menyimpan garis luarnya sebagai perintah move-to, line-to, dan kurva kubik, dan bentuk-bentuknya disusun bertingkat sesuai apa yang melingkupinya: bentuk yang memuat bentuk lain (wajah yang memuat matanya) menjadi grup tersendiri (Part 1.1, Part 1.1.1 …) yang path pertamanya adalah bentuk itu sendiri, digambar utuh di bawah apa yang dimuatnya, jadi kalau mata disembunyikan yang terlihat adalah wajahnya, bukan lubang. Bintik yang lebih kecil dari beberapa piksel tetap jadi path tanpa nama di dalam induknya. Tidak ada stroke dan tidak ada elemen teks: tulisan pada logo adalah outline berisi warna, bukan teks. Kalau Layer diatur ke Per warna di Pengaturan, file-nya tidak punya grup dan berisi satu <path> per warna.

SVG lanskap kecil berbentuk bulat, lalu masing-masing dari keempat path-nya secara terpisah: cakram biru, langit krem, gunung navy, dan matahari oranye dengan pantulannya

SVG contoh di beranda kami (kiri), lalu masing-masing dari keempat path-nya: setiap bentuk adalah elemen terpisah dengan isiannya sendiri, siap dipilih, diganti warnanya, atau dihapus.

Editor membaca struktur itu apa adanya, dalam ukuran dan koordinat file itu sendiri. Setiap path adalah bentuk yang bisa kamu klik untuk dipilih. Daftar layer menampilkan grup tingkat teratas di file: file yang bentuk-bentuknya langsung berada di dalam SVG (hasil tracing Per warna) terbuka sebagai satu layer, dan file yang dikelompokkan per objek terbuka dengan satu layer per grup, diberi nama sesuai grupnya.

Editan yang bisa ditangani editor browser dengan baik

  • Ganti warna bentuk. Pilih bentuknya lalu pilih isian baru. Karena satu path memuat setiap area dengan warna itu di dalam sebuah objek, mengganti warna "yang biru" mengubah semua area biru di objek itu sekaligus; kalau kamu butuh dua di antaranya berbeda, itu pemisahan yang perlu dikerjakan di editor desktop.
  • Pindahkan dan ubah ukuran. Seret untuk memindahkan, pakai handle untuk mengubah ukuran. Mengubah ukuran vektor tidak pernah membuatnya buram, jadi buat satu versi untuk header halaman dan satu lagi untuk favicon dari file yang sama.
  • Pindahkan titik satu per satu. Pilih bentuk lalu beralih ke alat titik (N): setiap titik jangkar kurva hasil tracing mendapat handle yang bisa diseret, dan handle kurvanya membengkokkan segmen di sebelahnya. Dengan cara ini kamu bisa memperbaiki garis yang bergelombang atau meluruskan satu tepi tanpa meninggalkan browser.
  • Ratakan dan atur jarak bentuk. Pilih beberapa bentuk lalu ratakan tepi atau titik tengahnya satu sama lain, atau terhadap artwork (satu bentuk selalu diratakan terhadap artwork); kalau tiga bentuk atau lebih dipilih, Sebarkan membuat jarak di antaranya sama.
  • Satukan, kurangi, iriskan. Pilih dua bentuk atau lebih lalu pakai Gabungkan bentuk: Satukan menggabungkannya jadi satu outline, Kurangi memotong bentuk-bentuk di atas dari bentuk paling bawah, Iriskan hanya menyisakan bagian yang bertumpuk, Kecualikan menyisakan bagian yang tidak bertumpuk, dan Bagi memotong setiap bagian yang bertumpuk jadi bentuk sendiri. Kurva tetap jadi kurva, hasilnya memakai warna dan layer bentuk paling bawah, dan satu kali urungkan mengembalikan bentuk-bentuk aslinya. Ini langkah yang biasa dilakukan sebelum pemotongan: satukan huruf-huruf yang bertumpuk jadi satu bagian, atau kurangi sebuah bentuk untuk membuat potongan berlubang.
  • Tempel ke grid. Aktifkan magnet dan pilih ukuran grid: apa pun yang kamu pindahkan, gambar, ubah ukurannya, atau ubah bentuknya titik demi titik akan menempel ke grid, yang digambar di atas artwork selama fitur ini aktif. Editor mengingat pengaturan ini di browser-mu.
  • Pakai ulang bentuk dan kerjakan beberapa file. Simpan pilihan di Bagian saya (disimpan di browser-mu untuk akunmu, bisa diekspor ke file) lalu tambahkan ke gambar lain mana pun. Buka file lain yang sudah dibuka kuncinya di tab baru untuk menyalin di antara keduanya: setiap tab punya riwayat urungkan sendiri dan disimpan sebagai versi baru dari file-nya sendiri.
  • Atur urutan, sembunyikan, dan kunci. Layer bisa disembunyikan, dikunci (jadi klik diteruskan ke bentuk di bawahnya), diganti namanya, dan dipindah ke atas atau ke bawah; di dalam sebuah layer, Ctrl+D menduplikat bentuk dan tombol panah menggesernya sedikit.
  • Hapus sisa-sisa bentuk. Path bintik-bintik dan persegi panjang latar yang tersisa bisa dihapus dengan sekali klik. Biasanya ini editan pertama setelah tracing JPEG.
  • Ekspor. Simpan SVG-nya, atau ekspor PNG dengan lebar piksel pilihan dan transparansi tetap terjaga. Mengedit hasil yang sudah dibuka tidak memakai kredit tambahan.

Editor hanya membuka vektor milikmu: SVG yang kamu unggah sendiri atau hasil yang sudah kamu buka kuncinya. Pratinjau adalah gambar raster ber-watermark dan tidak bisa diedit; dengan begitu vektor berbayar tidak beredar di jaringan sebelum dibayar.

Editan yang lebih cocok di editor vektor desktop

Sebagian perubahan butuh operasi path yang tidak ada di editor browser:

  • Memisahkan satu warna jadi beberapa objek terpisah (dua bentuk biru yang harus bisa dipindah sendiri-sendiri): "Break apart" di editor desktop.
  • Offset outline (memperbesar atau memperkecilnya dengan jarak tertentu, misalnya kontur untuk potongan stiker).
  • Mengubah isian jadi stroke garis tengah untuk pen plotter atau ukiran satu garis.
  • Mengubah teks jadi outline. Editor browser bisa menambahkan dan mempertahankan teks live, tapi tidak mengubahnya jadi path.

Inkscape (gratis, open source) bisa mengerjakan semua ini; begitu juga editor komersial. Buka SVG-nya, pakai "Break apart", "Outset", atau alat node sesuai kebutuhan, lalu simpan. Karena file-nya SVG biasa dengan data path standar, tidak ada bagian yang terikat ke png2svg.art.

Urutan kerja yang masuk akal

  1. Buka kunci hasilnya lalu buka di editor. Hapus bentuk yang nyasar, perbaiki warna yang jelas salah, haluskan tepi yang bergelombang titik demi titik, cek urutan tumpukannya.
  2. Satukan atau potong bentuk dengan Gabungkan bentuk, dan ratakan apa yang perlu sejajar.
  3. Simpan SVG-nya. Proses dengan optimizer kalau ukuran file penting (menghapus metadata dan membulatkan koordinat; cek ukuran sebelum/sesudah yang dilaporkan).
  4. Lakukan offset atau break apart di editor desktop kalau pekerjaannya memerlukan itu.
  5. Simpan hasil yang sudah dibuka di file kamu: mengunduhnya ulang gratis selama masih disimpan, dan kamu bisa membukanya lagi di editor kapan saja selama masa penyimpanan.

Batasan yang perlu diingat

  • Editor tidak bisa menambahkan gradasi; isian berupa warna solid atau tanpa isian. Stroke (warna dan lebar) bisa ditambahkan, dan gradasi, stroke, serta teks live yang sudah ada di file tetap dipertahankan. Apa pun yang tidak bisa dipertahankan editor akan dicantumkan sebelum kamu menyimpan.
  • Hasil tracing yang sangat besar (ribuan path dari ilustrasi yang detail) terasa lambat diolah di browser mana pun; sederhanakan hasil tracing dengan jumlah warna yang lebih rendah sebelum mengedit.
  • PNG yang diekspor adalah gambar raster dengan ukuran yang kamu pilih — ekspor di ukuran terbesar yang akan kamu butuhkan, atau tetap pakai SVG-nya.