Cara Menyiapkan Artboard Illustrator untuk Desain Web
Kelola variasi desain dalam beberapa artboard, beri nama aset, dan ekspor ukuran serta format yang sesuai dengan kebutuhan web dan layar.
Artboard Illustrator memudahkan desainer mengerjakan beberapa ukuran layar dalam satu file. Satu artboard dapat berisi tampilan desktop, yang lain versi ponsel, dan artboard tambahan untuk ikon atau variasi tema. Susunan ini membantu membandingkan desain, tetapi tetap memerlukan nama dan batas kerja yang jelas agar hasil ekspor tidak tertukar.
Rencanakan ukuran sebelum menggambar
Tentukan daftar keluaran bersama pengembang atau pemilik proyek: ukuran artboard, rasio, format, kebutuhan skala, dan nama file. Buat artboard sesuai keluaran yang benar-benar diperlukan, bukan setiap ukuran yang bisa dibayangkan. Gunakan nama seperti “Hero-Desktop”, “Hero-Mobile”, atau “Ikon-Pencarian” agar rekan tim tahu isi file tanpa membukanya satu per satu.
Pisahkan variasi yang berbeda secara berarti. Jika perubahan hanya warna, gunakan layer atau opsi yang cocok dengan workflow tim; jika ukuran dan tata letaknya berbeda, artboard terpisah lebih mudah ditinjau. Simpan file AI asli untuk sumber yang dapat diedit dan jangan mengandalkan file PNG sebagai master.
Ekspor artboard sesuai tujuan
Buka File > Export > Export for Screens, pilih artboard yang ingin diekspor, lalu tentukan format dan skala. Untuk logo atau ikon yang perlu tetap tajam pada ukuran berbeda, tanyakan apakah penerima memerlukan SVG. Untuk gambar dengan efek atau tekstur yang memerlukan piksel, PNG dapat lebih cocok. JPEG berguna untuk foto, tetapi tidak menyimpan transparansi.
Periksa nama dan lokasi keluaran sebelum menekan Export. Buka hasilnya di browser atau pratinjau gambar dan cek bahwa tepi tidak terpotong, transparansi sesuai harapan, dan file memakai ukuran yang diminta. Bila aset dipakai di beberapa ukuran tampilan, uji skala kecil agar detail tipis tidak hilang.
Beri serah terima yang jelas
Kirim file sumber yang boleh diedit, folder ekspor, dan catatan singkat tentang artboard serta format. Jika ada font atau aset eksternal, pastikan hak penggunaan dan ketersediaannya sudah disepakati. Hapus draft yang tidak dipakai dari paket final agar pengembang tidak memilih versi yang salah.
Untuk alternatif workflow vektor, lihat CorelDRAW di katalog dan artikel kapan menggunakan CorelDRAW untuk desain vektor. Pilih aplikasi dan format berdasarkan handoff proyek, bukan hanya ekstensi file yang paling populer.