Tutorial Membuat Icon Web 2.0 yang keren dengan adobe photoshop

Ketika kita mengerjakan proyek desain Web, kita cukup sering membutuhkan ikon untuk menampilkan perintah seperti menambahkan, menghapus, atau mengedit. Dengan tren Web 2.0, penggunaan lencana dan 3D yang halus telah menjadi sangat populer. 

Dalam tutorial ini, saya akan menunjukkan cara membuat efek 3D yang sangat mudah dan sangat bagus untuk digunakan di kedua tombol dan ikon atau elemen yang memerlukan beberapa kedalaman.

Langkah 1

Buat dokumen baru dan pilih Ellipse Tool (U). Tidak masalah warna apa yang Anda gunakan karena nantinya akan diganti dengan Layer Styles.

Langkah 2

Klik dua kali lapisan elips untuk membuka kotak dialog Layer Style. Kemudian pilih Gradient Overlay dan gunakan biru dan warna biru yang lebih terang untuk warna gradien. Untuk gaya pakai Radial. Selanjutnya tambahkan Bevel dan Emboss seperti gambar di bawah ini.

Tip: gerakkan gradien radial ke bagian atas lingkaran. Untuk melakukannya dengan kotak dialog Layer Style masih terbuka, pastikan Anda berada di bagian Gradient Overlay, dan klik dan tahan tombol dan mulailah memindahkan gradien.

Langkah 3

Gandakan layer lingkaran dan ubah ukurannya agar sedikit lebih kecil, seperti gambar di bawah ini.

Langkah 4

Klik dua kali layer baru untuk membuka kotak dialog Layer Styles. Hapus semua efek sebelumnya (Bevel and Emboss and Gradient Overlay). Sekarang pilih Stroke dan untuk Fill Type pilih Gradient. Untuk warna pilih putih untuk kedua ujung gradien dan ubah opacity menjadi 0% untuk start dan 100% sampai akhir.

Langkah 5

Pilih Horizontal Type Tool (T) dan buat layer teks. Pastikan layer ini ada di bagian atas. Sekarang buka kotak Layer Styles dan ubah Color Overlay menjadi putih, dan pilih Inner Shadow dan gunakan pengaturan yang ditunjukkan di bawah ini.

Langkah 6

Kelompokkan tiga lapisan dan menyebutnya "Lingkaran Biru".

Langkah 7

Pilih Polygon Tool (U) dan ubah beberapa pengaturan seperti gambar di bawah ini untuk membuat Star Badge. Gandakan layer dan ubah ukurannya seperti yang kita lakukan di langkah 3.

Alih-alih menerapkan gaya lapisan ke lapisan, cukup salin gaya dari ikon sebelumnya yang kami buat dan tempel ke lapisan baru kami. Untuk melakukan itu, pilih layer yang ingin Anda salin ke layer style, klik kanan pada mouse (Macs: Option-Click) dan pilih Copy Layer Style. Selanjutnya pilih layer yang ingin Anda tambahkan style dan klik kanan lagi dan pilih Paste Layer Styles.

Satu-satunya hal yang harus Anda ubah adalah warna gradien di bawah Gradient Overlay.

Kesimpulan

Ini adalah salah satu cara termudah untuk membuat tombol gaya 3D keren.Anda bisa mengubah beberapa pengaturan seperti warna gradien stroke dan menciptakan gaya 3D yang berbeda.

Author:

Fabio Sasso

Saya seorang desainer Brasil yang tinggal di Porto Alegre (selatan Brasil). Pada tahun 2003, saya mendirikan sebuah studio desain web bernama ZEE, bersama Fabiano Meneghetti, seorang arsitek dan teman saya. Ini adalah studio kecil sekarang, dengan 4 orang bekerja pada dasarnya dengan web.