Adobe Illustrator CC Untuk Lembar Cheat LuckyTemplates

Banyak perubahan paling dramatis dalam cara Illustrator digunakan terjadi di ranah menerjemahkan gambar vektor ke web, dan format SVG yang diremehkan adalah tautan utama dalam proses itu. File SVG mempertahankan fitur skalabilitas berharga dari karya seni vektor dan didukung hampir secara universal di situs web dan lingkungan pengembangan web. Saat Anda menyiapkan karya seni vektor untuk web, penting untuk menghindari efek standar Illustrator dan, sebagai gantinya, gunakan filter SVG.

Illustrator hadir dengan seperangkat filter SVG yang layak namun minimalis, tetapi berikut adalah beberapa tip tentang cara menemukan dan menambahkan filter SVG serta sumber daya untuk membuat filter SVG Anda sendiri. Bagi mereka yang bekerja dengan pengembang web dan aplikasi, buat hidup mereka lebih mudah dan lebih produktif dengan memeriksa lembar contekan untuk membagikan kode SVG.

Bagaimana menerapkan filter SVG di Illustrator

Saat Anda membuat file SVG untuk layar di Illustrator dan Anda ingin menerapkan efek (seperti drop-shadow), Anda harus menerapkannya sebagai filter SVG. Dengan begitu, file SVG Anda mempertahankan skalabilitas tak terbatas tanpa distorsi.

Langkah-langkah berikut memandu Anda menerapkan filter SVG ke grafik di Illustrator:

Pilih objek yang Anda terapkan filternya.

Pilih Efek → Filter SVG.

Pilih filter dari daftar yang muncul.
Kebanyakan filter memiliki nama deskriptif. Misalnya, yang dengan bayangan di namanya adalah drop-shadow, yang dengan gaussian di namanya adalah gaussian blur. Alur kerjanya agak aneh dan berputar-putar, tetapi Anda harus terlebih dahulu memilih filter untuk mengakses semua opsi yang tersedia untuk menerapkannya.

Untuk mengubah filter yang dipilih:

Pertahankan objek tempat filter diterapkan, dan buka panel Appearance dengan memilih Window→Appearance.
Di panel Appearance, klik filter SVG yang muncul di bagian Fill pada panel. Panel Terapkan Filter SVG terbuka.
Di panel Terapkan Filter SVG, ubah filter yang diterapkan.
Untuk melihat bagaimana filter akan terlihat, pilih kotak centang Pratinjau, seperti yang ditunjukkan pada gambar.

Setelah Anda memilih filter, klik OK di panel Apply SVG Filter.

Bagaimana cara menambahkan filter SVG ke Illustrator

Kumpulan filter SVG Illustrator minimalis, tetapi Anda dapat menyempurnakannya dengan mendesain filter Anda sendiri atau mengunduh kumpulan filter SVG yang sudah dikemas sebelumnya dari sumber online. Merancang filter melibatkan pengkodean, tetapi itu bisa dilakukan jika Anda merasa nyaman dengan HTML. Saya merekomendasikan tutorial di w3Schools untuk membuat filter SVG. Atau Anda dapat membeli set filter secara online, dan bahkan menemukan beberapa set filter SVG gratis yang bagus di Creatingo .

Setelah Anda membeli atau membuat filter SVG Anda sendiri, inilah cara Anda menginstalnya di Illustrator:

Pilih Efek → Filter SVG → Impor Filter SVG.

Pada dialog yang terbuka, navigasikan ke dan klik dua kali file filter SVG yang Anda buat atau unduh secara gratis.
File yang Anda cari harus berupa file SVG (beberapa filter digabungkan dalam satu file SVG).
Filter baru Anda sekarang tersedia di submenu Filter SVG.

Pilih Effect→SVG Filters untuk menerapkan filter baru Anda ke objek yang dipilih.

Cara menyerahkan kode SVG dari Illustrator ke pengembang

Seringkali grafik SVG yang Anda buat di Illustrator diserahkan kepada desainer game, animator, infografis, atau keluaran lainnya, di mana pengembang akan bekerja dengan kode di belakang grafik SVG. Sebagai ilustrator, Anda tidak perlu tahu cara membuat kode itu, tetapi Anda mungkin perlu tahu cara mendapatkannya dan menyerahkannya ke pengembang. Begini caranya.

Jalur untuk mengekspor grafik SVG Anda sebagai kode berjalan melalui fungsi Save Illustrator. Menu Simpan memiliki opsi (tidak mudah ditemukan) yang mengekspor file Anda sebagai kode SVG. Anda mungkin ingin berkomunikasi secara real-time dengan pengembang layar saat Anda membuat kode itu karena beberapa opsi ditentukan oleh bagaimana kode itu akan digunakan:

Pilih File→Save (atau Save As jika Anda menyimpan ulang file).

Pada dialog yang terbuka, pilih SVG dari menu Format.
Abaikan opsi file SVGZ, yaitu untuk file terkompresi yang tidak ditampilkan di browser.

Klik Simpan untuk membuka dialog Opsi SVG.

Selalu pilih SVG 1.1 di drop-down Profil SVG. Versi lain sudah usang.

Jika Anda telah menyematkan atau menautkan gambar dalam file SVG Anda, pilih Sematkan dari drop-down Lokasi Gambar. Namun, konsultasikan dengan pengembang web Anda tentang pilihan ini terlebih dahulu.

Pilih Pertahankan Kemampuan Pengeditan Illustrator untuk membuat file dapat diedit di Illustrator.
Pilihan ini meningkatkan ukuran file tetapi memungkinkan Anda untuk bekerja dengan satu file SVG yang dapat Anda edit, perbarui, dan bagikan dengan pengembang web.

Jika tombol Opsi Lainnya ditampilkan, klik untuk mengakses opsi lanjutan. dan tentukan pilihan Anda.
Pada dasarnya, opsi yang berbeda menghasilkan CSS dengan file Anda yang mendefinisikan properti dengan cara berikut. Konsultasikan dengan rekan tim pengembang web Anda tentang cara menentukan properti CSS ini:

Atribut Presentasi menyematkan gaya dalam kode SVG. Opsi ini adalah yang paling sederhana dan default. Gunakan ini jika Anda tidak berkolaborasi dengan pengembang web atau aplikasi.
Dua opsi Atribut Gaya mengandalkan CSS untuk mengelola gaya jika memungkinkan.
Elemen Gaya menghasilkan pemilih gaya kelas untuk penataan gaya.
Opsi Sertakan Gaya yang Tidak Digunakan menghasilkan kode yang kemungkinan meningkatkan ukuran file SVG tanpa menambahkan nilai fungsional.

Hapus centang pada lima kotak centang di bagian bawah dialog Opsi SVG, kecuali jika mitra pengembang Anda meminta Anda untuk memilihnya.
Opsi ini untuk aplikasi yang sangat khusus.

Untuk menghasilkan Kode SVG berdasarkan pilihan yang Anda buat dalam dialog Opsi SVG, klik tombol Kode SVG .
Kode SVG yang dihasilkan ditampilkan di editor teks sistem operasi Anda. Anda dapat menyimpan kode itu sebagai file teks menggunakan editor teks sistem operasi Anda, dan menyerahkan file tersebut ke pengembang.

Setelah Anda membuat kode, klik OK untuk menyimpan file Anda.
Anda dapat membuka kembali dan mengedit file ini di Illustrator.

Adobe Illustrator CC Untuk Lembar Cheat LuckyTemplates

Jelajahi kiat tentang cara menemukan dan menambahkan filter SVG serta sumber daya untuk membuat filter SVG Anda sendiri. Juga jelajahi cara menyerahkan kode SVG.