Cara membuat flat Design

Teman-teman semua, sudah tahu Flat Design? Flat Design ini adalah sebuah tren desain antarmuka dalam web design dan UI (User Interface) di tahun ini. Seperti yang kita semua tahu, di jaman sekarang kehidupan tak pernah lepas dari perangkat mobile. Kebanyakan orang sekarang sudah menggunakan perangkat mobile seperti handphone, smartphone, tablet PC, dan lainnya. dan mayoritas perangkat tersebut kini sudah menggunakan antarmuka layar sentuh alias touchscreen. Maka, untuk memudahkan penggunaan aplikasi atau website di perangkat mobile, diperlukan sebuah desain antarmuka yang minimalis dan touch-friendly, lalu lahirlah Flat Design ini.

Dalam postingan kali ini Mang Tekno akan mengajarkan cara membuat sebuah teks dengan model Flat Design ini, yang perlu kita catat disini adalah bahwa Flat Design menggunakan pallete warna pastel alias warna yang tidak mencolok, kemudian ciri khas lain Flat Design yaitu menggunakan bayangan panjang untuk memperjelas kesan flat-nya. Oke, tanpa basa-basi lagi langsung saja kita cabut ke TKP!

Membuat Flat Design Text

1. Buka Photoshop lalu buat dokumen baru, misal Mang Tekno contohkan disini buat dengan ukuran 300x300 pixel kemudian berikan warna background "#34495e". Untuk pilihan pallete warna pastel lainnya bisa Sobat Tekno lihat di FlatUIColors.com.

2. Kemudian buat teks bebas menggunakan "Text Tool".

3. Dengan menggunakan "Pen Tool" sobat buat titik-titik penanda di setiap ujung teks, buat sebuah titik di tengah-tengah celah antara teks dan juga sebuah garis miring panjang diakhir teks seperti yang Mang Tekno contohkan berikut. Klik gambar jika kurang jelas.

4. Hasil miring-miring tidak jelas?? Sobat pilih "Direct Selection Tool", dengan tool ini sobat bisa memperbaiki letak dan kemiringan titik yang salah tadi.

5. Masih menggunakan "Direct Selection Tool", sobat tekan "Shift + klik kiri" pada titik yang berada di tengah celah antara teks. Setelah itu tarik atau drag titik tersebut sehingga menghasilkan garis miring sebagai bayangan dari huruf tersebut nanti. Lihat contoh gambar berikut.

6. Setelah rapih hasilnya akan jadi seperti ini.

7. Sobat Tekno buat layer baru di atas "Background" atau "Layer 0".

8. Jika sudah, tekan "Ctrl + X" kemudian "Ctrl + V". Lalu dengan "Paint Bucket Tool" sobat isi layer tersebut dengan warna hitam.

9. Jika benar maka sobat akan melihat hasil seperti gambar di atas.

10. Ubah level "Fill" layer tersebut menjadi "0%" sehingga bayangan hitam tersebut tidak lagi terlihat.

11. Buat efek gradasi bayangan dengan cara klik menu "Layer > Layer Style > Gradient Overlay".

12. Atur Opacity menjadi sekitar "15-50%" dan Angle "-45°" seperti gambar di bawah ini.

13. Klik "OK" lalu lihat hasilnya, dan... Whala! Sudah jadi Sobat Tekno. Selamat!

Sumber : http://mangtekno.blogspot.co.id/2013/12/cara-membuat-flat-design-dengan-photoshop.html