Wednesday, June 14, 2017

10 Tips untuk Membuat Flat Desain

Tags

10 Tips Membuat Desain Flat

10 Tips untuk Membuat Flat Design  - Pada artikel ini kita akan membahas tentang flat design . Kamu mungkin pernah mendengarnya karena ini adalah salah satu tren utama dalam dunia desain digital selama beberapa tahun ini. Mari kita lihat lebih dekat tren ini dan ketahui dari mana asalnya dan apa yang perlu Kamu lakukan untuk membuat desain flat yang bersih, jelas dan responsif.


1. Apa itu Flat Design?

Designed by Freepik

Flat design adalah desain minimalis dengan sentuhan modern yang menggunakan elemen minimal namun tidak se-minimal kelihatannya, karena ada beberapa faktor pelengkap seperti jenis warna, gradien, highlight dan efek mengkilap, dan tekstur yang berbeda.
Flat design ditujukan untuk membuat pemirsa lebih fokus pada konten. Ini menekankan kesederhanaan elemen dan pada saat bersamaan membuat antarmuka lebih responsif, cepat dan mudah digunakan.

 

2. Sedikit Sejarah

Flat design diketahui telah lama digunakan sebelum menjadi tren besar dalam komunitas desain. Kemudian mulai meluas di tahun 80-an karena teknologi yang belum mampu menciptakan dan mendukung efek, tekstur dan bentuk yang kompleks.

Flat design, seperti yang kita lihat sekarang, mulai mendapatkan popularitasnya setelah Microsoft mulai merilis produk bergaya desain Metro. Metro adalah bahasa desain UI yang dibuat oleh Microsoft dan ini semua tentang sederhana, bersih dan modern.

Pada tahun 2010, Microsoft merilis Windows Phone 7, yang menggunakan UI desain flat sederhana dengan tepi tajam dan grafis yang jelas, yang diwarisi dari salah satu produk Microsoft sebelumnya (Zune). Nantinya, terinspirasi oleh kesuksesannya, Microsoft merilis OS Windows 8, berdasarkan grafis desain bergaya Metro yang sama.

Akhirnya, desain flat mencapai puncak popularitasnya di tahun 2013, saat Apple meluncurkan iOS 7, menghadirkan desain barunya dan benar-benar mengubah semua elemen UI sebelumnya, termasuk ikon dan font.

Setelah itu, Google juga mengalihkan gaya halaman web dan aplikasinya ke desain flat, menamainya Desain Material. Google memiliki keseluruhan bagian yang didedikasikan untuk Desain Material, termasuk tujuan, prinsip, dan pedoman yang bagus untuk membuat ikon material, UI, tata letak dan sebagainya.

Sejak saat itu, desain flat telah menjadi arahan kunci dalam desain selama beberapa tahun terakhir, membuat website, aplikasi dan elemen desain yang elegan, rapi dan stylish.
Singkatnya, ada tiga contoh utama gaya desain flat yang harus disebutkan di dunia media modern:
• Desain Metro Microsoft


• Desain Apple iOS 7

• Desain Bahan (Material) Google

3. Buatlah Simpel

Flat design seperti artinya, desain yang flat atau datar, karena tidak adanya unsur dan efek tiga dimensi. Gaya flat adalah visualisasi objek dua dimensi. Terkadang kita hanya menggambarkan siluet atau garis besar yang membuat objek sebenarnya bisa dikenali, tanpa detail.

Minimalisme adalah tren global saat ini, kesederhanaan bentuk dan penggunaan tepi/sudut menekankan desain yang rapi dan menarik secara visual. Bentuk sederhana yang lebih mudah dipahami. Benar-benar membuat potongan desain terlihat minimalis dan bersih, menghindari tampilan yang berantakan.

4. Buatlah Sempurna

Ketika sampai ke ikon flat dan elemen UI, perlu untuk membuat ikon tersebut terlihat tipis namun akurat. Ini penting untuk grafis raster dan vektor. Dalam hal ini, jelas mendesain dengan Adobe Photoshop, aplikasi desain grafis raster yang berbasis pixel.

Beberapa waktu yang lalu, Adobe Illustrator tidak begitu populer untuk membuat desain grafis dengan pixel-sempurna. Kabar baiknya adalah, versi terbaru dari Adobe Illustrator telah menjadi alat yang hebat bagi para desainer untuk menangani grafis dengan piksel yang sempurna dan dilengkapi dengan fitur-fitur pendukung untuk membuat flat design.

5. Aksen Warna

Designed by Freepik

Salah satu fitur yang paling spesifik dari desain flat, selain bentuknya, adalah penggunaan warna. Kebanyakan palet warna untuk elemen gaya flat terdiri dari beberapa warna dasar. Warna cerah, berani, bersemangat  sangat penting untuk desain flat.

Skema warna pada desain flat tidak terbatas pada beberapa warna tertentu. Ini mencakup berbagai warna, corak dan tergantung pada apa yang Kamu gambarkan, apakah itu ikon permen yang terang atau benda bergaya retro di palet retro yang halus.

Jika Kamu seorang desainer berpengalaman dan Kamu mampu menentukan palet warna yang tepat, Kamu dapat bermain-main dengan panel Color Illustrator yang bisa memilih warna hanya dengan cara menebak. Namun, proses ini membutuhkan intuisi, latihan, pengalaman dan keterampilan yang baik.

Sedangkan bagi pengguna CorelDraw mungkin agak kesulitan menentukan warna yang tepat dikarenakan paletnya susah dan kurang bagus. Untuk mengakalinya bisa dengan cara mencari situs-situs palet warna yang pas untukmu.


Salah satu situs generator palet sederhana dan keren adalah Coolors. Penggunaannya dengan menekan Spacebar untuk mencari warna yang cocok dan jika ada yang cocok, bisa Kamu klik lock.

Tidak hanya fitur lock saja, tetapi kamu bisa menukar posisi, memilih shading dari terang ke gelap, atau bisa juga kamu mengatur warna dengan mengubah Hue, Saturation, dan Brightness. Dan juga bisa disesuaikan dan diekspor.

Ada beberapa situs sejenis lainnya dengan palet custom yang bisa membantu. Namun, ada satu yang dibuat khusus untuk desain flat yaitu FlatUIColors. Situs tersebut sebenarnya lebih dikhususkan untuk warna pada User Interface yang sangat nyaman untuk digunakan. Ini telah menjadi sangat populer di kalangan desainer yang mencari warna untuk desain pixel-perfect.

6. Long Shadow

 Designed by Freepik

Seperti disebutkan di atas, flat design cenderung sederhana dan luas, itulah mengapa flat design tidak menggunakan segala jenis efek. Namun, ada satu efek yang muncul dari desain flat dan ini menjadi tren dan salah satu fitur penting.

Fitur penting itu yaitu efek Long Shadow. Fitur tersebut memiliki beberapa karakteristik khas yang membuat efek ini dikenali. Fitur tersebut membentuk rotasi 45 derajat dan memanjang serta berukuran besar. Jadi bayangan panjang tersebut benar-benar mencirikan ke desain flat.

Efek seperti itu membuat objek terlihat lebih tiga dimensi, tetapi tetap menjaga tampilan flat.

Baca juga: Tutorial Cara Membuat Efek Bright-Dark dan Bayangan untuk Flat Design

7. Gunakan Font

Tipografi memainkan peran besar dalam desain flat. Tipografi sederhana biasanya digunakan dalam desain flat, membuat keseluruhan potongan desain terlihat bersih dan mudah dibaca. Kamu bisa menemukan banyak font gratis di Font Squirrel dan DaFont, sumber font gratis yang sesuai dengan selera. Pastikan Kamu membaca lisensi terlebih dahulu, ada yang untuk keperluan personal dan ada juga komersial. Sebagian besar desain dengan gaya flat cenderung menggunakan huruf besar dan warna yang kontras, itu yang membuat teks mudah dibaca.

Untuk memilih font harus dengan hati-hati. Font harus menyesuaikan dengan desain yang dibuat. Tetapi bukan berarti kamu tidak bisa menggunakan font Serif atau beberapa font tulisan tangan yang rumit. Tetap konsisten pada tampilan minimalis dan menjaga keseimbangan. Namun flat design yang paling disarankan adalah font Sans Serif, karena bentuknya lebih lurus dan ketat serta semua elemen ilustrasi bergaya flat.

Baca Juga : Apa Itu Tipografi?

8. Kelebihan dan Kekurangan gaya flat

Flat design telah menjadi begitu populer karena banyaknya kelebihan dan kenyamanan, namun masih ada beberapa kekurangan yang dihadapi oleh desainer saat menggunakan gaya flat design ini. Coba kita simak kelebihan dan kekurangan dari flat design.

Kelebihan
1. Tren
Flat design telah berkembang menjadi tren, menarik banyak perhatian positif di kalangan designer dan web designer. Gaya ini semakin meluas dan memperoleh beberapa bentuk dan fitur baru, secara bertahap berubah menjadi sesuatu yang lebih kreatif.

2. Kesederhanaan
Desainnya simpel sederhana, minimalis, dan bersih. Ketika membuka situs web, flat design sangat membantumu untuk lebih fokus pada konten, bukan pada efek visual yang ribet dan mengganggu. Ini juga digunakan pada UI (User Interface) aplikasi seluler, desain yang bersih dengan tombol  flat besar membuatnya sempurna untuk bekerja pada perangkat mobile.

3. Pewarnaan
Penggunaan warna adalah poin besar lainnya dari flat design. Warna terang dan berani terlihat menarik dan bersih, dan minimnya gradasi membuat tampilan desain menjadi modern. Terlebih lagi, warna bersih seperti itu membuatnya terlihat lebih menarik dan menciptakan suasana hati yang tepat.
Ada banyak kelebihan lain dari flat design, tetapi tidak ada desain yang sempurna. Masih ada beberapa kekurangan yang harus kita sebutkan:

Kekurangan
1. Tidak responsif
Terkadang, kurangnya detail tambahan atau efek visual membuat sangat sulit untuk antarmuka yang mudah digunakan dan user-friendly. Tidak semua pengguna benar-benar merasa nyaman dengan desain ini, mungkin karena kesulitan untuk menemukan elemen yang dapat diklik pada halaman web atau elemen yang perlu Kamu sentuh dalam aplikasi mobile dikarenakan tidak interaktif.

2. Masalah tipografi
Seperti disebutkan sebelumnya, tidak semua font sesuai desain flat. Terkadang potongan desain seperti itu dengan huruf tebal dan lurus tampak sangat seimbang dan bergaya. Namun, memilih tipografi yang salah dapat menyebabkan kegagalan total pada desainmu. Kamu benar-benar perlu merasakan font mana yang sesuai untuk flat design dan mana yang tidak. Keterampilan tipografi yang lemah bisa membuatnya sangat sulit untuk memilih font yang tepat.

3. Visual Lemah
Terkadang flat design mungkin terlihat terlalu sederhana dan tidak menarik. Minimalismenya juga bisa menjadi kerugian terbesar bagi flat design karena semua desain akhirnya terlihat sama.

Agak sulit untuk membuat ikon atau halaman web yang berbeda dari desain orang lain, karena kita menggunakan bentuk sederhana yang disederhanakan, palet warna yang terbatas dan font serupa. Alhasil, desain flat lama-lama terlihat membosankan.

9. Desain Flat Tren Masa Depan


Desain flat tidak bisa disebut bentuk sempurna dan berkembang. Mungkin karena kelemahannya, dijelaskan di atas, setiap desain baru dari flat design cenderung hanya pada fase merubah dan mengembangkan, memperoleh fitur baru dan perangkat tambahan visual.

Apa yang bisa dilakukan adalah menambah efek depth atau kedalaman pada desain mi, seperti yang terkadang dilakukan desain skeuomorfik (membuat efek 3D pada bidang 2D). Perangkat tambahan kecil ini membuat flat design lebih responsif dan nyaman serta menghadirkan tampilan yang fresh, membuatnya lebih serbaguna dan beragam.

Alhasil, desain flat tidak kehilangan karakteristiknya. Sebaliknya, menjadi lebih menarik, lebih fleksibel dan justru menjadi lebih baik.

10. Bagaimana Memulainya?

Designed by Freepik

Jadi, Kamu ingin menggali skill dalam flat design dan tidak sabar untuk mulai membuat beberapa  flat design?!
Saya meyakini bahwa proses ini bakal menarik dan menantang.
Jika Kamu ingin mencoba membuat ilustrasi flat, sebaiknya Kamu mulai dengan ikon-ikon kecil, yang terhubung dengan satu tema yang sama. Dan saat Kamu merasa nyaman dengan teknik ini, beralih ke ilustrasi yang lebih rumit atau mencoba bidang desain lain, menerapkan pengetahuan baru tentang grafis flat dalam membuat template web flat.

Bagaimana? Sudah dapat pencerahan setelah membaca artikel ini? Semoga ya. hehe
Semoga artikel ini bermanfaat dan ditunggu postingan selanjutnya ^^


EmoticonEmoticon