Tech

3 Tren Desain Penting, Oktober 2022


Bulan ini, semuanya tentang gambar. Setiap tren desain yang kami temukan berkaitan dengan gambar yang Anda pilih – atau tidak pilih – untuk sebuah proyek dan bagaimana Anda menggunakannya.

Inilah yang sedang tren dalam desain bulan ini.

1. Gambar Mengambang

Terkadang Anda mendesain di luar jaringan dengan sengaja. Di lain waktu Anda mendesain pada kotak yang mungkin tidak terlalu jelas. Salah satunya terjadi dengan tren desain situs net gambar mengambang.

Di sini, Anda akan melihat gambar dan wadah gambar yang tampaknya tidak memiliki arah dengan penempatannya. Mereka mungkin atau mungkin tidak menyertakan animasi, yang lebih menekankan efek mengambang.

Gambar mengambang dapat mencakup:

  • Potongan yang tidak ditambatkan ke apa pun atau wadah apa pun
  • Gambar yang bertebaran di kanvas
  • Gambar di penempatan eksentrik yang tampaknya tidak memiliki tujuan
  • Gambar atau elemen apa pun dengan lokasi atau jarak yang jelas di luar jaringan
  • Gambar yang menggunakan orientasi berbeda atau kurang mendalam untuk persepsi

Tantangan dengan gaya ini adalah dapat terlihat kohesif dan terorganisir atau dapat berubah menjadi bagian-bagian yang campur aduk dengan cepat. Diperlukan banyak pengujian pengguna untuk menemukan keseimbangan yang tepat.

Repeat menggunakan animasi, gambar bergaya define di latar belakang yang tampaknya memiliki penempatan acak. Efek mengambang lebih ditekankan oleh animasi dan tumpang tindih gambar dan elemen lainnya.

HummingYard menggunakan gambar dalam wadah dalam desain tetapi penempatannya tidak memiliki arti yang jelas. Ada juga daun mengambang di sisi kanan kanvas dan tombol ajakan bertindak yang tampaknya juga tidak ada. Setiap elemen tampaknya ditempatkan secara sembarangan, menciptakan efek mengambang untuk keseluruhan desain.

Wealthsimple menggunakan sekumpulan gambar berbeda yang lebih kecil untuk membuat elemen kaskade mengambang. Ikon tiga dimensi hampir terlihat seperti jatuh ke bawah layar. Beberapa elemen teks tumpang tindih, tetapi sebagian besar tidak. Semuanya terasa sedikit acak, tetapi gambar membingkai dan membantu mengarahkan mata ke elemen teks layar tengah dan ajakan bertindak.

2. Tidak Ada Gambar

Jika gambar mengambang bukan pilihan Anda saat mempertimbangkan elemen desain yang trendi, mungkin tidak ada gambar adalah jawabannya.

Dalam tren desain ini, estetika menyatu tanpa citra nyata. Desainnya sebagian besar menggunakan teks dengan mungkin ikon, brand, atau divot kecil. Hasilnya bisa menjadi desain yang cukup mencolok, tetapi ada fokus yang berbeda pada kata-katanya.

Tren ini tidak terlalu sulit untuk dirancang, tetapi penceritaan dan bahasa sangat penting jika Anda ingin pengguna berinteraksi dengan desain. Tidak ada gambar yang terkadang dapat mengganggu pengguna yang mencari sesuatu yang visible.

Fandes Consulting menggunakan desain hitam putih tremendous sederhana dengan ajakan bertindak sederhana di beranda. Isyarat gulir memiliki animasi yang bagus yang membantu Anda masuk lebih dalam ke dalam desain dengan cepat. (Ada juga lebih banyak elemen dan gambar interaktif setelah gulir.)

Diego juga menggunakan estetika yang sederhana dan mencolok untuk situs webnya. Sekali lagi, ada animasi sederhana untuk keterlibatan dan ada lebih banyak warna dan beberapa citra di luar gulir.

Ashfield MedComms memiliki warna paling banyak dari contoh situs net tanpa gambar ini. Dengan latar belakang biru tua dan ikon hijau, Anda dapat merasakan mata Anda lebih banyak bergerak di layar di sini. Ada juga lebih banyak untuk dibaca dan animasi gulir untuk meningkatkan keterlibatan.

3. Teks dan Gambar yang Digabung

Tren teks dan gambar yang digabungkan adalah yang paling kompleks dari contoh desain ini. Di sini, desainer membuat lapisan yang tumpang tindih untuk elemen teks dan gambar (atau animasi) di layar sehingga ada banyak hal untuk dikonsumsi secara visible. Ini bisa menjadi konsep yang sangat menarik, tetapi juga sulit untuk dikembangkan.

Tren desain ini bisa sangat indah bila dilakukan dengan baik. Elemen berlapis sangat menarik dan memiliki perasaan “dirancang” untuk mereka.

Tantangan visualnya adalah: Menjaga keterbacaan kata dan huruf, terutama saat Anda memikirkan tentang daya tanggap situs net. Animasi atau gerakan dapat menambah tingkat kerumitan lainnya.

Jika Anda merencanakan desain seperti ini, penting untuk merencanakan breakpoint dan bahkan memiliki cadangan untuk apa yang harus dilakukan ketika keterbacaan menjadi perhatian. Estetika desktop dan seluler mungkin memiliki nuansa berbeda di sini untuk memastikan bahwa Anda memiliki tema visible yang mudah dipahami untuk keduanya.

Tempat Paling Berbahaya untuk Pelaut termasuk teks dan elemen gambar (kapal) yang terselip di balik lapisan air animasi. Yang sangat menarik dari desain ini adalah tampilan air yang sama berbahayanya dengan kata-kata yang disampaikan berkat gerakan dan bentuk serta warna grafisnya.

Meow tumpang tindih teks dan gambar dengan cara yang hampir mengaburkan keterbacaan, tetapi kata tersebut memiliki konteks yang cukup untuk dipahami secara umum. Jika Anda mengklik, ada animasi kecil yang menyenangkan dengan kucing juga.

Champoleon the Valley of Goals menyelipkan bagian teks ke pegunungan untuk latar depan ke teks ke set lapisan latar belakang yang indah dan terpadu. Ada banyak lapisan dalam desain ini, membuatnya jauh lebih kompleks daripada yang terlihat di permukaan. Pada gulir, sisa situs melanjutkan tema berlapis ini dengan teks dan gambar yang tumpang tindih dan berbagi ruang.

Kesimpulan

Manakah dari tren gambar berikut yang paling menarik bagi Anda? Mereka adalah pendekatan yang sangat berbeda untuk desain situs net dan dapat bekerja untuk proyek yang berbeda dengan cara yang berbeda. Mereka juga memiliki kompleksitas pengembangan, mulai dari tremendous mudah dikelola – tanpa gambar sama sekali – hingga berpotensi menantang – gabungan teks dan gambar.


Related Articles

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Back to top button
This site is registered on wpml.org as a development site. Switch to a production site key to remove this banner.