Daftar Isi:

Buat Pola Tiable untuk Gambar Latar Situs Web: 8 Langkah
Buat Pola Tiable untuk Gambar Latar Situs Web: 8 Langkah

Video: Buat Pola Tiable untuk Gambar Latar Situs Web: 8 Langkah

Video: Buat Pola Tiable untuk Gambar Latar Situs Web: 8 Langkah
Video: Insert image in HTML | Html Image Tag #html 2024, Juli
Anonim
Buat Pola Tiable untuk Gambar Latar Situs Web
Buat Pola Tiable untuk Gambar Latar Situs Web

Berikut ini adalah metode sederhana (menurut saya) untuk membuat gambar yang dapat dipetakan tanpa terlihat terlalu "seperti kisi". Tutorial ini menggunakan Inkscape (www.inkscape.org), editor grafis vektor sumber terbuka. Saya membayangkan bahwa metode ini dapat diterapkan pada program grafik vektor mahal seperti Adobe Illustrator juga. Hei, itu uangmu.

Langkah 1: Siapkan Dokumen

Siapkan Dokumen
Siapkan Dokumen
Siapkan Dokumen
Siapkan Dokumen
Siapkan Dokumen
Siapkan Dokumen

Setelah membuka Inkscape, Anda akan ingin mengatur properti dokumen. ([File -> Document properties])Pertama, ubah lebar dan tinggi dokumen ke angka yang lebih mudah digunakan. Untuk tutorial ini, saya membuat gambar persegi, tetapi proporsi apa pun akan berhasil. Selanjutnya, Anda ingin menyiapkan kisi. Dalam versi Inkscape yang lebih lama, hanya ada satu kotak yang memungkinkan. Di versi yang lebih baru, Anda harus membuat kisi baru. Ubah jarak kisi sehingga nilai-nilai ini terbagi rata ke dalam nilai lebar & tinggi dokumen. Umumnya, adalah ide yang baik untuk bekerja dari gambar besar dan kemudian menurunkan skala seperlunya. Karena ini adalah seni vektor, ukuran secara teknis tidak masalah, tetapi secara praktis akan lebih mudah secara konseptual dengan jumlah yang lebih besar. Dalam tutorial ini, saya menggunakan gambar 500x500px, dan grid saya berada pada interval 10px. Terakhir, pastikan opsi "Enable snapping" dicentang.

Langkah 2: Alat Persegi Panjang

Alat Persegi Panjang
Alat Persegi Panjang

Gunakan alat persegi panjang untuk menggambar persegi/persegi panjang yang memenuhi ukuran dokumen penuh. Nilai spasi kisi yang besar (lihat langkah sebelumnya) akan membuat alat persegi panjang mudah dijepit ke batas dokumen.

Langkah 3: Mengkloning Pola

Mengkloning Pola
Mengkloning Pola
Mengkloning Pola
Mengkloning Pola

Grup])", "atas":0.38721804511278196, "kiri":0.354, "tinggi":0.35902255639097747, "lebar":0.372}]">

Mengkloning Pola
Mengkloning Pola

Tambahkan gambar yang ingin Anda miliki dalam pola Anda. Jika gambar Anda adalah file SVG, maka biasanya Anda cukup menarik dan melepasnya ke dokumen yang terbuka. Buat tiruan dari gambar ini. ([Edit -> Clone -> Create clone] atau Anda dapat menekan Alt+D)Pindahkan gambar asli sehingga tidak mengganggu ruang kerja Anda. Pindahkan gambar hasil kloning ke dalam kotak, dan buat beberapa salinan dari klon. Alasan untuk menggunakan klon alih-alih salinan aslinya akan menjadi jelas nanti. Berikut cara mudah untuk membuat salinan di ruang tinta: seret objek yang akan disalin, dan tekan bilah spasi untuk menjatuhkan salinan di tempat itu (terus tekan tombol mouse). Umumnya, Anda mungkin tidak memerlukan lebih dari 2 atau 3 salinan untuk membuat pola. Seperti yang Anda lihat, saya memiliki 3 salinan gambar, tetapi saya akhirnya menghapusnya nanti. Setelah Anda merasa sudah cukup, kelompokkan barang-barang ini bersama-sama.

Langkah 4: Lebih Banyak Kloning

Lebih Banyak Kloning
Lebih Banyak Kloning
Lebih Banyak Kloning
Lebih Banyak Kloning

Aktifkan kembali gertakan jika Anda menonaktifkannya di langkah sebelumnya, seperti yang saya lakukan. Pada tangkapan layar, Anda tidak melihat kisi, tetapi kisi tersebut diaktifkan. Pilih grup objek yang baru saja Anda buat, dan buat klon dari grup tersebut. Sejajarkan tepi klon dengan batas halaman, dan terus jatuhkan salinan klon sampai Anda memiliki setidaknya kisi klon 3x3 di sekitar aslinya di tengah.

Langkah 5: Penggerak Ahli

Penggerak Ahli
Penggerak Ahli
Penggerak Ahli
Penggerak Ahli

Sekarang setelah Anda menyebarkan klon, saatnya untuk memuluskan pola Anda. Saat ini polanya terlihat agak kotak-kotak dan terlalu teratur, jadi kami ingin menyebarkannya sedikit. Untuk memindahkan objek yang ada di dalam grup, metode yang paling mudah adalah dengan memisahkan objek terlebih dahulu, memindahkan objek yang dimaksud, dan kemudian mengelompokkan kembali objek. Namun, ini akan memutuskan tautan ke klon. Sebagai gantinya, kami ingin menjaga grup tetap utuh saat memanipulasi objek tunggal di dalam grup. Untuk melakukan ini, tahan tombol Control dan klik pada objek yang ingin Anda ubah. Control-klik memilih objek tunggal dalam grup. Jika sekarang Anda memindahkan objek, klon di sekitarnya juga akan mencerminkan perubahan. Dengan menggunakan metode ini, Anda sekarang dapat memindahkan gambar sampai Anda puas dengan keseluruhan pola Anda. Anda juga dapat mengubah ukuran, memutar, atau menghapus gambar. Saya akhirnya menghapus salah satu gambar karena saya hanya membutuhkan 2 untuk memenuhi polanya.

Langkah 6: Tentang Menggunakan Gambar Kloning

Saya sebutkan di langkah 3 bahwa Anda harus menggunakan klon alih-alih salinan gambar saat membuat kotak tengah ("asli"). Alasannya adalah jika gambar Anda sendiri merupakan sekelompok objek, metode klik-kontrol untuk memilih item yang dikelompokkan akan memilih objek individual gambar. Klon itu sendiri tidak dapat diedit (kecuali untuk ukuran dan warna) sehingga metode klik-kontrol akan menyebabkan seluruh objek kloning dipilih terlepas dari berapa banyak objek yang terdiri dari gambar asli.

Langkah 7: Sentuhan Akhir

Sentuhan Akhir
Sentuhan Akhir
Sentuhan Akhir
Sentuhan Akhir

Sebagai langkah opsional, pilih kotak latar belakang (Ctrl-klik) dan atur warna isian menjadi tidak ada (yaitu-transparan) atau warna apa pun yang Anda inginkan sebagai latar belakang. ([Object -> Fill and stroke])Saya juga menurunkan opacity grup secara keseluruhan (pilih dengan klik biasa) sehingga polanya bisa di latar belakang dan tidak mengganggu. Terakhir, langkah penting mengekspor. Buka jendela ekspor ([File -> Ekspor bitmap]). Klik tombol "Halaman". Ini akan mengekspor hanya bagian dari dokumen yang termasuk dalam batas halaman -- yaitu, di dalam kotak "asli". Ubah ukuran bitmap yang diekspor jika Anda mau, lalu klik "Ekspor".

Langkah 8: Produk Akhir

Produk akhir!
Produk akhir!
Produk akhir!
Produk akhir!

Selesai! Letakkan di desktop Anda, gunakan untuk situs web Anda, atau cetak dan jual sebagai kertas dinding! selamat menikmati.

Direkomendasikan: