Ada begitu banyak tutorial dan panduan online yang mengajarkan Anda cara memanfaatkan desain web 2.0 secara efektif. Meskipun sebagian besar tutorial ini berguna, pada saat yang sama mereka mematikan orisinalitas dalam desain web. Misalnya, sebagian besar “panduan” memberi tahu Anda bahwa web 2.0 adalah tentang memiliki lencana mengkilap, latar belakang garis-garis, dan font tebal. Hasil? Ada ratusan desain dengan lencana, garis, dan huruf besar tebal… dan semuanya tidak berbeda satu sama lain. Tidak masalah jika Anda membuat desain web 2.0, web 1.0, atau web 75.0, semuanya harus orisinal dan mudah diingat.

Namun, jika tidak dapat menemukan sesuatu yang orisinal untuk melambangkan desain Anda, akan lebih “aman” untuk mengikuti tren desain web saat ini. Jadi, inilah sebagian kecil tata letak desain web, dan cara mengubah tata letak biasa menjadi tata letak web 2.0.

Inilah yang kami punya…

14.png

Dan inilah yang akan kami lakukan…

13.png

Kita akan bekerja di Photoshop, hanya menggunakan gaya lapisan; fokus pada gradien dan bayangan ringan.

Mulailah dengan menggunakan bentuk Persegi Panjang dengan sudut membulat, dan menggambar… persegi panjang.

1.jpg

Spanduk

Apa yang perlu kita lakukan pertama kali adalah memberi kedalaman dan kehidupan pada persegi panjang kita. Mengikuti prinsip desain web 2.0, hanya bayangan, garis luar, dan gradien cahaya yang akan memberi kita efek ini. Jadi pergi ke layer style, dan jatuhkan sedikit bayangan tipis. Kami menggunakan #96aed6 untuk tujuan ini.

2.png

Untuk memberikan sedikit kedalaman pada bentuk (sehingga tidak terlihat seperti objek datar), tambahkan bayangan bagian dalam yang lembut, dengan nada yang lebih gelap (kami menggunakan #304f82 )

3.png

Terakhir, penting untuk menambahkan sedikit kerangka. Kita akan menggunakan warna putih #FFFFFF, karena bayangan kita dari kedua sisi lebih gelap, kita ingin memiliki garis terang dan semi terlihat yang akan membentuk kontur.

4.png