Tips ilustrasi dalam desain web

Pengarang: John Stephens
Tanggal Pembuatan: 23 Januari 2021
Tanggal Pembaruan: 19 Boleh 2024
Anonim
Download ilustrasi Vector Gratis di 7 Situs Ini
Video: Download ilustrasi Vector Gratis di 7 Situs Ini

Isi

Di sini, Gene Crawford memberikan tip tentang bagaimana menggunakan ilustrasi untuk membumbui situs web Anda tanpa membuat navigasi membingungkan ...

Fokus pada ilustrasi

Ilustrasi dapat menambahkan karakter, kehangatan, dan kepribadian ke dalam desain web Anda. Akan tetapi, perairan interaksi dan komunikasi berbahaya ini berbahaya jika tidak dilakukan dengan baik.

Penting untuk memastikan ada perbedaan yang jelas antara elemen interaktif dan konten ilustrasi. Ini akan memastikan bahwa situs tidak hanya indah untuk dilihat tetapi juga mudah bagi pengguna untuk menavigasi dan mengambil tindakan apa pun, seperti mendaftar untuk buletin.

Gaya berbeda

Membedakan antara interaksi dan ilustrasi dapat didekati dengan beberapa cara berbeda. Namun, biasanya sebaiknya tombol, elemen navigasi, dan ajakan bertindak tidak memiliki gaya yang sama seperti ilustrasi di halaman lainnya, untuk membantunya menonjol.

Misalnya, jika ilustrasinya sangat bertekstur dan kasar, mungkin semua yang berinteraksi dengan pengguna harus memiliki tepi yang tajam dan bayangan jatuh. Jika ilustrasinya berupa garis atau satu warna, maka cara yang baik untuk membedakannya dari navigasi adalah dengan membuat semua elemen lainnya berwarna cerah.


Membersihkan jalan

Intinya adalah membuat elemen-elemen ini secara visual berbeda dari ilustrasi membantu mengurangi kebingungan dengan membuat titik apa yang ingin mereka lakukan atau ke mana mereka ingin pergi. Ini akan memungkinkan pengguna untuk mengagumi seni yang indah di situs Anda sambil tetap membawanya dalam perjalanan.

Lima contoh untuk diperiksa ...

Tempat penampungan

Situs web untuk aplikasi manajemen proyek Basecamp menggunakan ilustrasi simbolis dengan sempurna untuk menceritakan kisah tentang aplikasi itu dan apa yang Anda lakukan dengannya.

Eksperimen sosial Xperia

Contoh ini, yang ditampilkan di situs web Sony Xperiments, menunjukkan elemen ilustrasi dan interaktif bercampur sedikit terlalu dekat. Meskipun diilustrasikan dengan indah, ini dapat menyebabkan beberapa titik interaksi yang membingungkan.

Mailchimp

Aplikasi pemasaran email Mailchimp adalah contoh bagus menggunakan gambar ilustrasi dan bergambar yang kaya dan memiliki perbedaan yang sangat jelas antara itu dan elemen interaktif.


Indubitablee

Portofolio desainer web untuk Indubitablee adalah perpaduan yang hebat antara ilustrasi dan elemen interaktif yang seimbang. Mereka bahkan menggunakan warna untuk membantu memperkuat perbedaan secara visual.

Ian James Cox

Situs web portofolio untuk Ian james Cox menggunakan elemen ilustrasi dan navigasi tradisional untuk membuat cara yang menarik untuk menavigasi konten situs.

Dan itu saja untuk saat ini! Apakah menurut Anda ini berguna? Beri tahu kami pendapat Anda di kotak komentar di bawah.

Fitur ini pertama kali diterbitkan di majalah .net edisi 224.

Menarik
Apa itu gradasi warna? Ini semua yang perlu Anda ketahui
Lebih Jauh

Apa itu gradasi warna? Ini semua yang perlu Anda ketahui

Anda mungkin melakukan penilaian warna etiap hari tanpa Anda adari. Penilaian warna adalah bagian entral dari pembuatan konten. Mi alnya, mengubah level atau kurva di Photo hop, mengambil foto hitam p...
9 hal yang kami pelajari tentang desain pada tahun 2015
Lebih Jauh

9 hal yang kami pelajari tentang desain pada tahun 2015

2015 hampir berakhir, tapi apa yang telah kita pelajari? Untuk para kreatif di agen i tran forma i digital TH_NK, jawabannya cukup edikit, ebenarnya - dan mereka ingin berbagi pengetahuan yang baru me...
Anda akan terhipnotis oleh GIF stop-motion beruang cetak 3D ini
Lebih Jauh

Anda akan terhipnotis oleh GIF stop-motion beruang cetak 3D ini

Ada beberapa contoh cetak dalam 3D yang bagu ejak meningkatnya popularita printer 3D erta printer 3D mikro pribadi dan berbiaya rendah. Membuat karya cetak 3D adalah pre ta i ter endiri tetapi menggab...