Untuk mendiagnosis SVG Affinity yang tampak buram atau memiliki isian tak terduga, isolasi satu kurva yang terdampak, bandingkan pengaturan rasterisasi, lalu periksa isian dan mode isiannya. Pengujian ini membantu membedakan keterbatasan ekspor dari pengaturan objek dan perbedaan pada aplikasi tujuan.

Panduan ini membahas cara mengekspor gambar vektor dari aplikasi desktop Affinity saat ini di Mac dan memeriksa tampilannya di browser atau aplikasi desktop lain. Jalur menu mengikuti Pusat Bantuan Affinity saat ini; versi Affinity Designer yang lebih lama mungkin menggunakan lokasi menu yang berbeda.

Mulai dengan satu kurva dan ekspor terkontrol

Simpan salinan kerja dokumen Affinity Anda. Pilih satu kurva yang jelas menunjukkan masalah, lalu catat hasil yang diharapkan: misalnya, “goresan melengkung biru tanpa isian interior” atau “cincin berisi dengan bagian tengah transparan.” Dengan begitu, Anda dapat menilai setiap pengujian tanpa mengubah beberapa properti yang tidak berkaitan.

Buka File > Export > Export, pilih SVG sebagai format file, lalu periksa pengaturan di sebelah kanan. Kontrol tambahan tersedia di bawah Advanced. Untuk objek terisolasi, pilih Area: Selection Only; Selection Area juga menyertakan lapisan yang bertumpang tindih. Affinity menjelaskan perbedaan ini dalam bantuan dialog ekspor.

Ekspor file awal sebelum mengubah apa pun. Buka file tersebut di Safari dan di aplikasi tempat Anda melihat masalah. Bandingkan area yang sama pada ukuran tampilan yang serupa, lalu perbesar. Catat apakah cacat muncul di kedua aplikasi, hanya di aplikasi tujuan, atau sudah terlihat di pratinjau ekspor Affinity.

Anggap perbandingan ini sebagai bantuan diagnostik. Jika dua aplikasi menampilkan hasil yang sama, kemungkinan Anda sedang menyelidiki konten hasil ekspor semakin besar, tetapi hal itu belum mengidentifikasi penyebabnya. Perbedaan antar aplikasi mempersempit pertanyaan kompatibilitas yang perlu diselidiki.

Gejala yang terlihat Pengujian pertama Hal yang dibantu dibedakan oleh hasilnya
Kurva menjadi buram saat diperbesar Bandingkan pengaturan rasterisasi Konten yang dirasterisasi dengan geometri yang dipertahankan
Goresan melengkung mendapat bagian dalam yang penuh Periksa isian objek yang dipilih Isian yang tidak diinginkan dengan tampilan goresan
Lubang menghilang atau area tumpang tindih menjadi terisi Bandingkan mode isian Definisi berbeda tentang bagian dalam bentuk
Hanya satu aplikasi tujuan yang menampilkan file dengan keliru Uji salinan yang disederhanakan Penanganan aplikasi tujuan dengan masalah ekspor umum

Mengapa SVG dapat berisi kurva buram?

Ekstensi SVG tidak berarti setiap objek di dalam file tetap menjadi vektor yang dapat diskalakan. Affinity secara eksplisit menyatakan bahwa objek raster dalam file SVG tetap mengalami penurunan kualitas saat diubah ukurannya. Dokumentasi Bekerja dengan SVG juga menyarankan agar karya web ditempatkan pada piksel utuh supaya tampak tajam.

Pertama, tentukan apakah keburaman memengaruhi seluruh gambar atau satu objek berhias. Kurva polos yang tetap tajam di samping objek buram mengarah pada penyelidikan yang berbeda dari gambar yang semua elemennya menjadi buram. Gunakan pengamatan tersebut untuk menentukan objek berikutnya yang perlu diisolasi.

Bandingkan tiga pilihan rasterisasi

Kontrak ekspor SVG Affinity menyediakan tiga pilihan Rasterize: Nothing tidak melakukan rasterisasi saat ekspor dan mengecualikan elemen yang tidak didukung; Unsupported properties merasterisasi elemen yang tidak didukung; Everything merasterisasi semua elemen. Karena itu, Nothing dapat menghapus konten, alih-alih mempertahankan tampilannya sebagai vektor. Lihat Pengaturan Ekspor.

Buat ekspor terpisah menggunakan Unsupported properties dan Nothing, dengan area dan pengaturan lain tetap sama. Bandingkan kurva yang terdampak, hiasannya, dan konten yang mungkin hilang. Gunakan nama file yang menunjukkan pengaturan yang diubah agar perbandingan dapat dilacak.

Jika konten yang terdampak menghilang dengan Nothing, hasil itu selaras dengan batasan konten yang tidak didukung sebagaimana didokumentasikan. Ini menjadi alasan untuk menyederhanakan objek yang diisolasi dan mengulangi pengujian. Hasil tersebut tidak membuktikan bahwa seluruh objek asli kompatibel dengan vektor.

Jika versi polos kurva diekspor dengan benar, pulihkan gayanya satu perubahan pada satu waktu. Hentikan saat gejalanya muncul kembali. Urutan ini mengidentifikasi kombinasi yang lebih kecil dan dapat direproduksi, tanpa mengasumsikan bahwa setiap efek, kuas, atau susunan objek memiliki perilaku ekspor yang sama.

Pilih antara mempertahankan tampilan dan mempertahankan geometri

Untuk konten raster yang dipertahankan, Raster DPI mengontrol resolusi efek yang dirasterisasi; Downsample images dapat mengurangi resolusi raster. Allow JPEG compression dan pengaturan Quality memengaruhi konten yang dirasterisasi. Use tile patterns dapat membungkus area yang dirasterisasi dalam bentuk vektor berisi bitmap, dengan dukungan terbatas di beberapa aplikasi. Semua ini dijelaskan dalam Pengaturan Ekspor.

Untuk ekspor diagnostik, nonaktifkan pengurangan resolusi dan kompresi JPEG, lalu bandingkan lagi objek yang sama. Jika Anda mempertahankan tampilan yang dirasterisasi, nilai hasilnya pada ukuran akhir yang dituju. Meningkatkan resolusi raster tidak membangun ulang kurva yang dapat diedit; tindakan itu hanya memengaruhi bagian raster dari hasilnya.

Untuk keluaran yang harus mempertahankan geometri yang dapat diskalakan, sederhanakan atau bangun ulang tampilan yang bermasalah menggunakan objek vektor, lalu ulangi ekspor terisolasi. Hasil yang diharapkan adalah ekspor yang memuat karya sesuai keinginan dan tetap berperilaku benar saat diperbesar. File yang kehilangan hiasan belum mencapai hasil tersebut hanya karena kurva yang tersisa tampak tajam.

Mengapa kurva terbuka mendapat isian yang tak terduga?

Kurva dapat memiliki goresan sekaligus isian. SVG mengisi subjalur terbuka seolah-olah sebuah segmen penutup menghubungkan titik-titik ujungnya. Hal ini dapat menghasilkan irisan atau bagian dalam yang lebar meskipun goresan yang terlihat tetap terbuka. SVG juga menetapkan hitam sebagai nilai isian awal, dan isian diwariskan. Perilaku ini ditentukan dalam SVG 1.1: Pewarnaan.

Pilih kurva yang terdampak dan buka Window > General > Color. Aktifkan pemilih Fill, lalu pilih swatch None jika karya yang diinginkan berupa goresan tanpa bagian dalam. Pastikan Anda mengubah Fill, bukan Stroke. Dokumentasi panel Color saat ini menjelaskan pemilih terpisah dan swatch None.

Ekspor ulang kurva yang diisolasi. Jika bagian dalamnya menghilang, periksa objek lain yang terdampak satu per satu sebelum mengekspor seluruh gambar. Hindari menerapkan None ke setiap objek kecuali seluruh gambar memang dimaksudkan hanya berisi goresan.

Sebagai ilustrasi, bayangkan sebuah lengkungan terbuka: goresannya membentang dari satu titik ujung ke titik ujung lainnya, sementara isian dapat memenuhi area antara lengkungan dan tepi lurus penutup yang tersirat. Menghapus isian langsung mengatasi bagian dalam tersebut. Menutup kurva mengubah geometrinya dan dapat menambahkan tepi bergaris yang tidak diinginkan.

Jika SVG mandiri tampak benar di Safari tetapi mendapat isian setelah diimpor ke aplikasi lain, ulangi pengujian dengan kurva terbuka sederhana yang isiannya secara eksplisit diatur ke None. Ini memberikan perbandingan terarah untuk aplikasi tujuan. Jangan menyimpulkan hanya dari area hitam bahwa Affinity pasti mengekspor cat hitam.

Mengapa lubang dan area tumpang tindih berubah?

Area terisi di dalam kurva kompleks menimbulkan pertanyaan berbeda dari isian yang tidak diinginkan pada goresan terbuka sederhana. Affinity menyediakan mode isian Alternate dan Winding untuk menentukan area mana yang dianggap berada di dalam kurva yang berpotongan dengan dirinya sendiri. Perintah saat ini adalah Vector > Fill Mode, dengan objek yang dipilih. Lihat Mode isian.

Alternate menggunakan hitungan perpotongan ganjil atau genap. Winding menggunakan hitungan bertanda yang memperhitungkan arah jalur. Dalam istilah SVG, keduanya sesuai dengan evenodd dan nonzero. Perbedaan ini penting untuk perpotongan dengan diri sendiri dan subjalur bersarang, seperti dijelaskan dalam bantuan Mode isian Affinity dan spesifikasi fill-rule SVG.

Pada duplikat objek yang terdampak, bandingkan kedua mode. Periksa setiap lubang dan area tumpang tindih yang diinginkan sebelum memilih salah satunya. Jika arah jalur perlu diselidiki, Affinity menjelaskan Show curve orientation di bawah Settings pada bilah konteks Pen Tool atau Node Tool. Ini menampilkan informasi yang relevan dengan perilaku Winding. Lihat Mode isian.

Sebagai ilustrasi, pada garis luar bersarang, Alternate dapat membiarkan area dalam tidak terisi karena sebuah garis melintasi dua batas. Dalam Winding, hasilnya bergantung pada arah batas tersebut. Mengganti mode dapat memulihkan satu lubang sekaligus mengubah area tumpang tindih lain, jadi nilai keseluruhan objek, bukan hanya satu bagian.

Jika kedua mode tidak menghasilkan bentuk yang diinginkan, tinjau kembali pembuatan kurvanya. Buat area yang harus terisi dan lubang yang diinginkan menjadi jelas di salinan kerja, lalu ekspor ulang. Mode isian adalah aturan untuk menafsirkan geometri; mode ini tidak dapat mewakili sembarang kumpulan area terisi dan kosong yang dipilih secara terpisah.

Kapan sebaiknya Anda memperluas goresan atau meratakan transformasi?

Gunakan Expand Stroke saat masalah yang dapat direproduksi berkaitan dengan cara goresan vektor ditafsirkan. Affinity menjelaskan bahwa objek dipilih dengan Move Tool atau Node Tool, lalu Vector > Expand Stroke dipilih. Perintah ini mengubah batas goresan menjadi kurva tertutup dan secara khusus didokumentasikan untuk menyiapkan goresan sebelum ekspor SVG. Lihat Perluas goresan.

Pertahankan versi asli yang dapat diedit dan uji duplikat yang telah diperluas. Bandingkan titik ujung, sambungan, ketebalan, dan ruang tertutup sebelum mengekspor. Perluasan mengubah struktur objek, jadi pengujian yang berhasil harus mempertahankan tampilan yang diinginkan sekaligus mengatasi masalah pada aplikasi tujuan.

Ada dua batasan yang terdokumentasi: goresan yang diperluas kehilangan kemampuan untuk diedit dengan alat aslinya, dan goresan yang dibuat dengan kuas berbasis piksel tidak dapat diperluas karena berbasis raster. Karena itu, perluasan menyediakan cara yang didukung untuk goresan vektor, tetapi bukan konversi umum dari bitmap ke vektor. Lihat Perluas goresan.

Untuk ketidakcocokan yang melibatkan objek yang ditransformasikan, uji Flatten transforms secara terpisah. Affinity menyatakan bahwa fitur ini memperbaiki objek yang ditransformasikan dalam file hasil ekspor untuk meningkatkan akurasi tampilan di berbagai aplikasi. Ini adalah pengujian kompatibilitas dengan tujuan khusus, bukan perbaikan universal untuk keburaman atau isian. Lihat Pengaturan Ekspor.

Verifikasi seluruh gambar sebelum mempertahankan perbaikan

Setelah objek yang diisolasi berhasil diekspor, ulangi ekspor dengan seluruh dokumen atau artboard yang diinginkan. Tinjau hasilnya pada ukuran tampilan sebenarnya dan saat diperbesar, baik di Safari maupun aplikasi tujuan. Periksa kurva yang sebelumnya buram, goresan terbuka, lubang transparan, area tumpang tindih, dan karya di sekitarnya.

Catat secara singkat perubahan yang mengatasi gejala tersebut: menghapus isian yang tidak diinginkan, memilih mode isian yang sesuai, menyederhanakan tampilan yang tidak didukung, mempertahankan bagian raster pada resolusi yang sesuai, memperluas goresan vektor, atau meratakan transformasi. Dengan demikian, hasilnya dapat direproduksi tanpa menjadikan pengaturan yang berhasil sebagai aturan untuk setiap gambar.

SVG akhir harus mempertahankan karya sesuai keinginan Anda, dengan konten raster yang dipertahankan dipahami dan dapat diterima pada ukuran yang diperlukan. Simpan sumber Affinity yang dapat diedit bersama ekspor yang telah diverifikasi agar perubahan berikutnya dapat dimulai dari kurva asli.

Sumber