Pernahkah Anda memperhatikan tren dalam desain situs web ini: berlapis-lapis? Saya merasa seperti saya telah melihat lebih banyak di mana-mana baru-baru ini, dan ini adalah polarisasi!
Ini adalah teknik desain yang dapat berkisar dari luar biasa dalam hal visual dan kegunaan untuk bencana dengan cepat. Jelas bahwa ada jalan tengah di mana ia bekerja, tetapi sangat mudah untuk melangkah terlalu jauh!
Di sini, kita akan melihat beberapa cara untuk menggunakannya dengan paling efektif dan sedikit lebih banyak tentang tren desain ini.
Mengidentifikasi Tren Desain
Situs web yang menampilkan tren ini mencakup banyak lapisan yang bersatu untuk menceritakan kisah visual. Lapisan sering kali interaktif dan menyertakan efek animasi atau gulir, tetapi tidak selalu demikian. (Terkadang desain ini statis dengan tampilan berlapis.)
Tiga lapisan adalah standar untuk sebagian besar elemen di sini:
- Latar Belakang: Seringkali gambar, tekstur, atau lapisan statis
- Jalan tengah: Seringkali beberapa jenis gambar atau elemen interaktif
- Latar depan: Sering kali menyertakan tipografi atau citra (lapisan tengah dan latar depan terkadang bekerja bersama (atau terbalik) untuk membuat desain penuh
Karakteristik Utama
Desain ini cenderung memiliki banyak bagian yang bergerak – secara harfiah. Tindakan gulir sering kali membantu menghidupkan lapisan sehingga Anda dapat melihat perbedaan di setiap lapisan dan bagaimana mereka bersatu.
Interaktivitas gulir adalah bagian besar dari proyek ini, baik itu membantu elemen bekerja sama atau menggerakkan pengguna melalui desain untuk menemukan lebih banyak lapisan konten. Tidak semua proyek ini menampilkan tren desain ini dengan jelas dari halaman beranda, terkadang di bawah gulir atau bahkan lebih dalam di situs web.
Trik untuk membuatnya bekerja dengan baik adalah menyatukan elemen desain yang terasa harmonis. Itu mencakup segala sesuatu mulai dari warna hingga ukuran hingga bentuk dan skala. Jika lapisan tidak terlihat seperti seharusnya bekerja bersama, itu dapat menciptakan masalah kegunaan yang dapat membuat desain tidak efektif.
Hal lain yang akan Anda perhatikan tentang proyek-proyek ini adalah bahwa banyak dari mereka tampaknya menampilkan lapisan dengan elemen gaya kartu. Teknik desain ini telah populer untuk sementara waktu dan terus mengikuti tren ini.
Tips Menggunakan Tren Desain Web ini
Desain keseluruhan dari setiap situs web yang menggunakan gaya dan tren ini bisa sangat berbeda karena tidak ada hubungannya dengan elemen seperti warna atau tipografi atau citra.
Tetapi masing-masing elemen itu memiliki dampak. Anda akan ingin memikirkan bagaimana menggunakannya bersama-sama untuk membuat cerita visual yang menarik dan memanfaatkan setiap lapisan secara mactionmal.
Pertimbangan terpenting saat menggunakan tren desain ini adalah memikirkan bagaimana lapisan akan berinteraction satu sama lain. Dengan action gulir atau gerakan lain, apa yang dilakukan elemen tersebut? Idealnya, Anda ingin lapisan berinteraction dengan cara yang terasa dan terlihat terarah.
Dalam contoh di atas untuk Lost Mechanics Interactive Studio, ada lapisan latar belakang hitam, lapisan teks, lapisan gambar yang menyatu dengan lapisan teks, dan lapisan kesalahan keempat yang ada di atas segalanya untuk menyelesaikan efek video yang funky ini.
Gulir mencakup lapisan lain yang menumpuk satu sama lain dengan teks, gambar, dan bahkan elemen kartu. Sementara desainnya sibuk, ia bekerja dengan mulus dan semuanya mudah digunakan dan dipahami. Konten diatur dan ini adalah contoh yang solid tentang bagaimana menggunakan banyak lapisan secara efektif.
Hal yang Perlu Diwaspadai
Menggunakan tren desain ini membutuhkan perhatian dan perencanaan. Dan melakukan teknik yang efektif tidak selalu mudah.
Dua hal penting yang harus diperhatikan antara lain:
- Bagaimana lapisan berinteraction dan tumpang tindih
- Daya tanggap
Elemen-elemen ini terkait erat. Interaction perlu dirancang sedemikian rupa sehingga bahkan dengan lapisan, semua yang ada di situs ini mudah dipahami dan dibaca. Ini adalah tantangan terbesar dengan tren desain ini dan salah satu yang terlewatkan pada banyak proyek yang menggunakannya. Keterbacaan, khususnya, menjadi perhatian bagi banyak proyek ini.
Responsivitas selalu menjadi pertimbangan desain situs web, tetapi begitu Anda mendapatkan lapisan yang tepat pada satu ukuran, lapisan itu mungkin tidak berfungsi dengan cara yang sama pada orang lain. Responsif bisa sangat rumit dengan begitu banyak bagian yang bergerak (harfiah).
3 Contoh Yang Kami Suka
Ada beberapa desain situs web yang melakukan pekerjaan hebat dengan tren ini yang memberikan inspirasi tentang cara menyatukan proyek-proyek ini.
Survei Kapal Karam
Shipwreck Survey menggunakan lapisan secara elegan dengan skema warna yang konsisten dan sisipan foto antara gambar latar dan tipografi latar depan yang menambahkan lapisan konteks ekstra. Para desainer terus menggunakan lapisan dengan elemen gambar di seluruh gulir untuk membantu menyatukan nuansa visual yang lengkap. Bonus lain di sini untuk gambar-gambar kecil adalah Anda mendapatkan perasaan yang lebih besar untuk petualangan di situs ini, gambar-gambar kecil inilah yang menjualnya dan efek berlapis membantu memasukkan lebih banyak dari mereka ke dalam desain.
Sirop
Sirup menggunakan banyak gerakan, font yang funky, gambar, dan bahkan nuansa video untuk menyusun paket berlapis yang menarik dan menarik. Keterlibatan gulir juga bagus, menambahkan nuansa tiga dimensi ke gambar utama. Salah satu elemen lapisan terbaik di sini adalah sedikit transparansi yang menyatukan semuanya.
burung camar yang elegan
Elegant Seagulls menggunakan banyak lapisan dengan cara yang tidak terlalu mencolok dengan efek mengintip-a-boo. Latar belakang adalah gulungan video burung, lapisan tengah adalah elemen percikan putih solid dan ada bagian atas interaktif kemudian dengan tombol ajakan bertindak bulat yang bergerak dengan mouse. Efek latar belakang video digunakan di beberapa lokasi desain dengan elegan. (Pastikan juga untuk mengklik menu untuk efek desain kecil yang bagus yang menampilkan kartu di sana.)
Kesimpulan
Meskipun tren desain ini bukan yang termudah untuk dilakukan, tren ini bisa sangat visual dan interaktif jika dilakukan dengan baik. Untuk memanfaatkannya sebaik mungkin, pertimbangkan teknik desain ini jika Anda juga memiliki lapisan konten.
Mencocokkan konten dengan estetika desain adalah cara terbaik untuk membuat proyek yang tepat bagi pengunjung situs web.