Gaya datar apa. Desain datar: masa lalu, sekarang dan masa depan. Fitur karakteristik gaya datar




Dari penulis: Saya menyambut Anda, teman-teman! Hari ini kita akan berbicara tentang apa itu desain datar, atau desain situs web datar. Istilah ini telah lama memenangkan hati para desainer web dan masih menjadi trending dengan percaya diri. Perusahaan terbesar (Google, YouTube, Microsoft, Apple Inc., dll.) menggunakannya untuk mendesain situs web dan aplikasi mereka. Apakah Anda masih belum termasuk pendukung desain situs web datar? Lalu kami pergi ke Anda!

Menurut Anda, apa alasan popularitas desain flat yang begitu heboh? Singkatnya, saya akan menjawab Anda: ini benar-benar berfungsi! Pada artikel ini, saya akan menjelaskan kepada Anda apa gaya ini, memberi tahu Anda tentang kelebihan dan kekurangannya, dan menunjukkan kepada Anda beberapa contoh desain situs web datar yang bagus yang pasti akan menginspirasi Anda untuk mengeksploitasi. Jadi ayo pergi!

Semuanya dimulai dengan skeuomorphism

Bagi yang belum tahu, skeuomorphism bukanlah kata kotor, melainkan gaya lain dari desain web. Flat design sering dihadirkan sebagai kebalikan dari skeuomorphism, yang menurut saya tidak sepenuhnya benar. Ini lebih merupakan penyederhanaan daripada antagonisme.

Hingga tahun 2010, skeuomorphism adalah gaya dominan dalam desain antarmuka. Dia menampilkan elemen seperti yang terlihat dalam kenyataan, secara aktif menggunakan tekstur, bayangan, pantulan, dan atribut lain dari gambar tiga dimensi. Perusahaan Apple, yang dengan hati-hati menyalin sebagian besar objek perangkat lunak dari objek kehidupan nyata, secara khusus mencoba dalam hal ini.

Segera, ikon yang dibuat semu tidak lagi menarik bagi sebagian besar pengguna dan pengembang web, yang mengantarkan era desain situs web datar. Dunia sampai pada kesimpulan bahwa semua elemen dekoratif harus dihilangkan, dan hanya apa yang nyaman bagi pengguna akhir untuk berinteraksi harus dibiarkan.

"Desain terbaik adalah desain sekecil mungkin"

Bagaimana Dieter Rams melihat ke dalam air - seorang desainer industri terkenal yang menentang desain intrusif, efek animasi, dll. Pada Juni 2013, Apple Inc. memperkenalkan iOS 7 yang revolusioner, yang menerima semua atribut dalam gaya desain web datar. Namun, pesawat tidak serta merta "mengalahkan" realisme dan volume.

Pengguna untuk waktu yang lama tidak bisa melupakan keajaiban Steve Jobs dan ikon "yang ingin Anda jilat". Banyak yang bahkan mengucapkan selamat tinggal pada "tujuh yang malang" dan beralih ke "Android yang bersinar". Menambahkan bahan bakar ke api dan sejumlah besar bug yang ada di iOS 7, dan desain tembus keputihan dengan paralaks dan animasi dalam bentuk "ingus" saat membuka aplikasi.

Mereka yang pasrah pada kenyataan yang tak terhindarkan dan tetap menggunakan sistem operasi "apel", pada akhirnya menyadari bahwa desain web datar tidak hanya terlihat menarik, tetapi juga menghadirkan keteraturan dan gaya visual tunggal untuk semua aplikasi.

Pro dan kontra dari desain datar

Manfaat menggunakan gaya ini antara lain:

kejelasan komposisi dan keringkasan sarana visual. Antarmuka responsif dalam gaya "tidak lebih, sehingga pengguna dengan cepat menyadari apa yang ingin mereka sampaikan kepada mereka;

fokus pada tipografi yang baik. Konten diutamakan, yang sangat penting dalam kelimpahan informasi saat ini;

halaman web yang lebih kecil dan kinerja situs yang lebih cepat karena jumlah efek visual yang minimum. Ini sangat berguna saat membuat versi responsif, karena semakin sederhana bentuknya, semakin mudah ditampilkan di layar kecil perangkat seluler.

Desain web datar juga memiliki kelemahan:

membatasi imajinasi perancang web pada warna, tipografi, ikonografi yang disederhanakan. Oleh karena itu, risiko membuat situs yang membosankan dan tidak ekspresif lebih tinggi;

kurangnya tiga dimensi dan bayangan terkadang tidak memungkinkan Anda untuk memahami apakah elemen tersebut dapat diklik atau tidak;

kurangnya aturan tetap yang spesifik.

Jika Anda telah memutuskan untuk menggunakan gaya ini di situs Anda, selamat - ini menunjukkan bahwa Anda peduli dengan kenyamanan pengguna dan mengikuti perkembangan zaman. Jika Anda baru memulai sebagai perancang web dan tidak tahu cara menggunakan desain datar dengan cara yang benar untuk membuat situs Anda terlihat relevan tetapi tidak primitif, berikut beberapa kiatnya:

Lupakan tentang "dinding bata" dan latar belakang yang cerah. Dalam desain web datar, biasanya menggunakan gambar latar yang sederhana, mulus, dan lembut.

Tanpa gradien, ikon 3D, transisi animasi, atau efek khusus lainnya. Semua ini akan membuat situs Anda berat dan rewel - apakah Anda membutuhkannya?

Gunakan ikon datar dengan garis jelas yang menambah kenyamanan dan fungsionalitas.

Gunakan palet warna yang cerah dan menarik. Sekarang trennya adalah nada spektrum matahari: kuning muda, merah muda, dan hijau. Hal utama adalah jangan berlebihan - tidak boleh ada lebih dari 3 warna pada halaman.

Fokus pada tipografi. Desain datar mendukung label asli yang cerah yang membuat ajakan bertindak dan menyediakan navigasi situs yang mudah. Di sini juga, penting untuk tidak berlebihan. Lupakan "tulisan tangan" dan font mewah lainnya. Anda dapat menggunakan huruf kapital untuk menyorot judul.

Jangan ragu untuk menggunakan berbagai bentuk geometris. Kotak, lingkaran, garis, dan bentuk lainnya tidak hanya membantu meningkatkan struktur situs web, tetapi juga membuat hierarki yang jelas dan memisahkan konten. Pengguna akan menghargainya, percayalah.

Sederhanakan menu navigasi dan elemen situs lainnya sebanyak mungkin. Sebagai tombol, gunakan persegi panjang biasa tanpa bayangan dan sorotan.

Jadi, selama bertahun-tahun, situs web desain datar telah menjadi standar yang diterima oleh semua orang. Lihatlah sebagian besar situs modern - mereka rata "ke tulang".

Terakhir, saya akan memberikan contoh yang dijanjikan tentang desain datar yang sukses yang dapat menjadi inspirasi bagi Anda untuk membuat mahakarya Anda sendiri.

1. Situs http://dunked.com.

Platform populer untuk menerbitkan portofolio, ditujukan untuk perwakilan dari berbagai profesi kreatif. Desain web datar minimalis membangkitkan rasa layanan yang andal dan mudah dipahami yang tidak mengganggu efek khusus yang tidak perlu.

2. Antarmuka Microsoft.

Microsoft adalah salah satu perusahaan yang membuat gaya datar begitu populer. Apakah Anda ingat Zune, pesaing iPod yang dirilis Microsoft pada pertengahan tahun 2000-an? Jadi, desain produk ini sangat berbeda dari kebanyakan aplikasi pada masa itu, terutama karena tipografi yang besar, ikon datar, bentuk yang besar dan cerah.

Antarmuka yang disebut Metro ini kemudian bermigrasi ke komputer pribadi (OS Windows 8), antarmuka Xbox 360, dan produk perangkat lunak Mircosoft lainnya.

3. Situs web http://www.vox.com.

Nah, apakah Anda terinspirasi? Turun dengan estetika 3D pseudo-realistis!

Itu saja. Berlangganan, bagikan artikel kami dengan teman-teman di jejaring sosial. Konversi tinggi untuk Anda!

Kami tidak tahu apakah Anda menyadarinya atau tidak, tetapi baru-baru ini (terutama dalam setahun terakhir) telah ada tren yang jelas dalam desain web di seluruh dunia menuju penyederhanaan, minimalisme keras, dan keringanan visual dari apa yang berinteraksi dengan kita sebagai pengguna setiap hari. Sederhananya, desainnya menjadi "datar": berbeda dengan ikon yang dimunculkan pada masa pesatnya pertumbuhan jejaring sosial dan web 2.0, kini kita semakin disambut oleh ikon sederhana layanan baru. Semua ini mendapatkan namanya - desain datar. Bukan apartemen, tapi flat.

Dengan presentasi OS seluler baru kemarin, iOS 7, Apple akhirnya mengonfirmasi pertumbuhan cepat dalam popularitas tren ini, yang secara tradisional menyenangkan beberapa penggemarnya, tetapi juga menemui ketidakpuasan yang signifikan di antara pengguna dan desainer berpengalaman. Apa masalahnya? Apa gunanya desain datar ini dan apakah dunia benar-benar membutuhkannya? Kami memutuskan untuk beralih ke ahli dari Ukraina dan luar negeri.

Kami meminta mereka untuk menjawab tiga pertanyaan utama:

  • mengapa dunia mulai beralih ke desain datar di web dan seluler dan apa itu;
  • apa yang akan dibawanya ke Apple dan iOS 7;
  • bagaimana hal itu akan mempengaruhi desainer di satu sisi, dan pengguna di sisi lain.

Denis Sudilkovsky, Kyiv
Spesialis Desain Interaksi, produser Prodesign.in.ua

“Efek pendulum” dalam memprediksi masa depan terwujud dalam kenyataan bahwa jika ada dua ekstrem dalam suatu masalah, umat manusia akan bergegas dari satu sisi ke sisi lain. Tidak diragukan lagi ini benar untuk desain sistem interaktif. Web primitif yang datar dan tidak menarik sekaligus berubah menjadi tombol ganda web yang banyak. Visualisasi antarmuka telah mencapai puncak realisme dan pendulum terbang ke arah yang berlawanan - datar&sederhana.

Apa yang akan didapat Apple dari ini? Itu akan mempertahankan tempatnya dalam tren dan ratusan ribu komentar bahwa iOS mereka menjadi sangat mirip dengan Android.

Desainer harus berevolusi (dan tidak bercanda tentang kapan desain datar akan datang ke teknik dan memberi kita mobil datar :). Saat tidak ada dekorasi - semua pekerjaannya adalah menciptakan mood konten untuk skenario tertentu dengan pengguna. Profesi ini akan lebih banyak berhubungan dengan Sutradara daripada dengan Artis. Sebaliknya, pengguna mendapatkan pengalaman baru dan kesan baru. Secara pribadi, saya adalah seorang ahli iPhone selama 4 tahun, tetapi musim semi ini saya mengganti ponsel saya ke Android karena satu-satunya alasan - saya bosan dengan idealitas antarmuka apel yang monoton.

Daniel Bruce
Senior Digital Creative, danielbruce.se

Pertama, saya ingin menunjukkan bahwa saya tidak suka istilah "desain datar". Sebagian besar desain grafis selama berabad-abad bersifat "datar". Saya juga berpikir itu membatasi kemampuan Anda untuk membuat desain yang bagus ketika pilihannya adalah antara datar dan yang lainnya. Desain bisa lebih dari itu. Ceria, cerah, gelap, positif, minimalis - Anda bisa menyebutnya sesuka Anda. Tapi hari ini, saya jarang mendengar orang menganggap desain sebagai apa pun selain datar atau scleromorphic. Ini sedikit sedih.

Mengapa web dan seluler perlahan bergerak menuju desain datar? Saya melihatnya seperti ini - ini hanya tren. Saya belum pernah melihat artikel tentang manfaat desain datar di antarmuka pengguna dan masih belum yakin. Desain sederhana dan jelas - ya, tapi tidak sama dengan "datar". Lihatlah Google misalnya. Mereka tidak melakukan desain yang sepenuhnya datar, mereka - dan saya berbagi poin ini - masih melihat perlunya kedalaman dan variasi.

Saya sangat terkejut ketika Microsoft mengambil arah ini beberapa tahun lalu, menghadirkan gaya Metro yang terkenal. Faktanya, mereka menggunakan desain grafis untuk tanda besar yang dilihat orang dari jarak tertentu dan tidak pernah berinteraksi dengan layar kecil dengan banyak elemen. Kelihatannya bagus, tetapi apakah mereka memiliki kegunaan yang baik?

Apa yang saya lihat tadi malam dari Apple hanyalah salinan buruk dari beberapa desain keren yang bermunculan di situs seperti Dribbble dan Behance selama setahun terakhir. Saya tidak melihat sesuatu yang baru - kecuali bahwa ini jauh dari Steve Jobs "Apple lama" yang sama. Perusahaan telah menunjukkan bahwa itu bukan yang terdepan dalam desain antarmuka seluler. Tentu saja, kita akan melihat penggemar mewarisi semua desain putih dan gradien kreatif selama beberapa bulan ke depan, tetapi menurut saya aspek itu tidak akan berpengaruh seperti penutupan Google baru-baru ini. Namun di sisi lain, apapun itu, Apple selalu berperan sebagai trendsetter dan inspirasi bagi banyak orang, termasuk saya.

Sedangkan untuk pengguna biasa, mereka menyukai warna-warna cerah.

Ivan Klimenko, Kyiv
perancang antarmuka seluler, 5tak.com

Untuk sebagian besar, saya mengambil sedikit pendekatan filosofis untuk kegemaran gaya datar ini. Ini bukan pertama kalinya para desainer terpesona oleh minimalis dan material artifisial. Semuanya berlalu.

Era Bauhaus tahun 20-30-an memberikan kontribusi besar pada desain, tetapi tetap saja, keketatan nada dan artifisial tidak dapat menahan keinginan dan dorongan batin orang untuk hidup dikelilingi oleh hal-hal yang lebih alami.

Kemudian di tahun 60an semua orang mulai mengagumi plastik.

Furnitur, piring, dan bahkan pakaian semuanya terbuat dari plastik. Tampaknya ini adalah harapan baru bagi umat manusia, tetapi sekali lagi tidak - orang dengan sangat cepat kembali ke bentuk alam atau salinan bahan alam.

Kontras bentuk yang keras dan grafik minimalis selalu mengungkapkan akumulasi konflik internal dalam masyarakat. Desain hanyalah cermin yang menunjukkan dunia batin kita. Ada terlalu banyak hal di sekitar. Hidup sangat cepat, dan kita tidak punya waktu untuk berpikir dan mempertimbangkan apa pun. Kita seringkali tidak punya waktu untuk sekedar hidup.

Minimalisme dan semua potongan besi elektronik ini hanyalah langkah menuju sesuatu yang lebih alami dan manusiawi. Lebih dari sekedar komputer lain. Saya bahkan berharap Apple, yang bisa melihat secara mendalam, tidak ada lagi.

Olesya Grichina, Kyiv
Desainer UI di Componentix, twitter: elendiel

Menurut saya, desainer sangat dipengaruhi oleh sejumlah besar gadget dengan ukuran dan resolusi layar berbeda - untuk semua keragaman ini, lebih mudah membuat desain tanpa tekstur, bayangan kompleks yang memperhitungkan pencahayaan dengan benar, dll. Mereka mulai berpikir lebih ke arah "bagaimana membuatnya lebih nyaman bagi pengguna", dan bukan "cara menggambar dengan indah". Konten adalah segalanya, dan dalam pekerjaan kami, penting untuk menyajikannya dengan cara terbaik.

Tampak bagi saya bahwa di balik perubahan eksternal (UI datar, ikon) mereka tidak terlalu memperhatikan perubahan serius dalam kegunaan, dan bagaimana mereka bersumpah tentang topik ini. Saat mereka memeriksanya dalam pekerjaan, itu akan mulai "oooh, betapa nyamannya, dan mengapa mereka tidak melakukannya sebelumnya." Desainer, saya harap, akan dipengaruhi sedemikian rupa sehingga mereka akan lebih memperhatikan kegunaan antarmuka, daripada tekstur dan bayangan. Pada akhirnya, pelanggan dapat menjelaskan bahwa ini sedang tren :)

Pengguna desain datar, menurut saya, tidak akan terlalu terpengaruh - jika nyaman bagi mereka untuk membuat dan mengonsumsi konten, akan ada banyak yang puas. Tapi ikon di layar beranda masih bersifat asam :)

Pavel Grozyan, Kyiv
Desainer Produk di MacPaw

Apel! Ah ha ha, hentikan! - Berteriak desainer. - Hore, lebih mudah. - pengguna bernyanyi "Saya mengerti kedua sudut pandang. Hari ini, setelah presentasi dari WWDC2013, banyak rekan saya berdiri dan berkata," ayolah, profesi ini! Adakah yang bisa menggambar kebodohan seperti itu sekarang. Dan ikon ini seharga $ 30 ? !". Dan sekilas, mereka benar, tetapi jika Anda menggali lebih dalam, Anda menyadari bahwa ada ribuan objek yang untuk waktu yang lama berbeda satu sama lain hanya dalam skenario penggunaan, kemudian dalam bentuk, kemudian dalam warna, dan baru kemudian dalam detail artistik. Saya ingat saat-saat ketika semua orang di LinkedIn yang profilnya hari ini mengatakan UX, Desainer UI, dengan gugup menyalin efek bayangan putih pada huruf. Seperti Apple. Kemudian situs terang dan terang. Seperti Apple. Kemudian tekstur yang kaya dan antarmuka realisme. Seperti Apple. Semua pekerjaan mereka disalin, karena tidak ada konsep pengembangan yang orisinal, terpadu, dan nyaman untuk semua orang. Inilah tugas yang dipecahkan oleh desain datar hari ini. Meskipun tampaknya salah bagi saya untuk menyebutnya itu Bagus bahwa Microsoft tidak membuatnya , dan terbentuk selama sepuluh tahun sebelum era digital, di bidang penerbitan.

Datar - ini bukan untuk klik, ini untuk klik, ketuk, ketuk. Anda tidak bisa menyebutnya datar - kurangnya tekstur dan bayangan "tebal" pada tombol membuatnya agak disederhanakan, dan tanpa agresi visual. Dan Anda tidak dapat melakukannya tanpa gradien untuk tombol. Saya mendukung tren ini. Jika itu tidak mengganggu kualitas pengalaman pengguna, tetapi akan lebih mudah bagi semua orang untuk hidup bersama. Pertama-tama kepada pengguna. Kedua, bagi pembuatnya: akan lebih mudah dalam implementasi teknis, lebih nyaman untuk mengklik (menggarisbawahi tautan - halo), dan multi-platform - menggabungkan web, seluler, dan desktop menjadi satu pengalaman tunggal. Tanpa diragukan lagi, ini adalah langkah berani untuk Apple. Dan hanya mereka yang bisa memutuskannya. Kisah mereka memiliki lusinan konfirmasi, jadi mereka akan berhasil, bukan sebaliknya.

Revolusi flat design terus mendapatkan momentum sejak diperkenalkan ke platform Windows Phone pada tahun 2010. Tidak sulit untuk mengetahui alasannya: antarmuka dengan desain ini tampak lebih intuitif, cocok untuk elemen responsif, kerangka kerja modern, dan terlihat menarik jika dilakukan dengan baik.
Desain datar mulai ada sebagai tandingan gaya skeuomorphic di mana-mana, tetapi sejak itu menjadi lebih dari sekadar "Opsi B".

Awalnya, flat hanya dua dimensi dengan fokus total pada minimalisme. Flat 2.o modern menggunakan bayangan, gradien, dan elemen lain yang membuatnya "hampir datar".

5 komponen karakteristik desain datar modern:

1. Bayangan panjang
Bayangan panjang menambah kedalaman dan dimensi pada gambar tanpa harus mengorbankan detail ikon minimalis yang membuat antarmuka menarik.

2. Warna dinamis
Melengkapi visual yang jarang itu sederhana dengan warna-warna cerah, terutama corak yang lebih terang.
Latar belakang warna yang berbeda kontras dengan warna dasar elemen membuat halaman dengan menu "berubin" lebih hidup.
Situs web Flat UI Colors berisi pola warna paling efektif untuk flat.

3. Tipografi sederhana
Pilihan font di flat didorong oleh satu kriteria: keterbacaan. Font sans-serif yang umum digunakan memiliki lebar guratan yang konstan.

4. Tombol transparan
Salah satu elemen tren dalam desain web modern. Alasannya adalah karena tidak menarik terlalu banyak perhatian, tetapi dapat dikenali dengan jelas sebagai sebuah tombol.

5. Minimalisme
Flat dan minimalis berjalan beriringan, menggunakan prinsip yang sama: kesederhanaan dan fokus konten.
Tampaknya penggunaan desain datar adalah solusi universal, tetapi minimalis sulit diterapkan: semakin sedikit elemen kerja, semakin banyak perhatian yang mereka butuhkan.

Sehebat apa pun desain flat, tidak ada jaminan bahwa itu akan berfungsi untuk situs Anda. Lihat keunggulan utamanya untuk memahami apakah perlu merencanakan desain ulang global.

Keuntungan:
digunakan dalam antarmuka adaptif;
menyederhanakan navigasi bagi pengguna;
struktur yang jelas dan visual skematis menekankan logika internal halaman;
pemuatan halaman cepat, karena kesederhanaan grafik;
tipografi yang familiar meningkatkan keterbacaan.

Desain datar adalah tentang kesederhanaan dan minimalisme, yang di sisi lain membuatnya sulit untuk mengomunikasikan pesan yang rumit secara visual. Oleh karena itu, sebelum terjun langsung ke penyederhanaan antarmuka, Anda harus mempertimbangkan dengan cermat skema interaksi antara situs dan pengguna.

Berdasarkan buku tren desain Web.

Baru-baru ini, gaya khusus dalam desain situs web dan antarmuka pengguna telah mendapatkan popularitas luar biasa, yang karena gaya elemennya disebut Flat.

Jika Anda melihat situs yang dirancang sesuai dengan aturan Datar, Anda tidak akan melihat transisi gradien apa pun, tidak ada bayangan, tidak ada sedikit pun volume dan tekstur. Prinsip dasar gaya datar adalah kesederhanaan, keringkasan, dan minimalis. Fitur pembeda utama adalah hal-hal yang dapat Anda fokuskan - warna cerah yang tidak biasa, tipografi non-standar, primitif grafis.

Saat ini, semakin banyak desainer yang mengadopsi tren ini dalam karya mereka, tetapi gaya Flat menjadi sangat populer dengan penyebaran sistem operasi seluler modern Windows Phone dan iOS 7, karena mereka mengikuti tren ini, meskipun mereka tidak sepenuhnya mengikuti. untuk itu.

Perusahaan kami sudah memiliki pengalaman dalam membuat website dengan gaya Flat, dan dengan senang hati kami akan membantu Anda membuat website flat!

Pada artikel ini, kami akan menyoroti prinsip dasar desain flat yang harus Anda ikuti jika ingin menggunakan flat sebagai gaya utama proyek Anda.

Di bawah ini kami akan menganalisis dan memberikan contoh beberapa situs yang menggunakan gaya datar.

1. Hapus semua efek

Prinsip dasar flat design adalah membuat gambar dua dimensi yang sudah datar. Pada saat yang sama, Anda harus menyingkirkan semua elemen yang dapat menambahkan setidaknya beberapa kedalaman pada gambar: gradien, transisi halus, bayangan, bevel, volume, tekstur, dan sebagainya. Semua elemen gambar memiliki tepi yang keras dan juga tidak menonjol dan tidak memiliki kedalaman relatif terhadap elemen gambar lainnya.

Dalam desain datar, Anda tidak akan menemukan elemen yang mencoba terlihat realistis (skeuomorphism), animasi 3D, ikon realistis, dll. Namun, pada saat yang sama, desainnya sendiri berusaha untuk tetap mirip dengan yang tradisional, tetapi sekarang huruf, tombol, dan navigasi mengemuka.

Sekilas, situs yang menggunakan desain Flat mungkin tampak terlalu sederhana, meskipun sebenarnya gaya ini memiliki hierarki elemen yang jelas, penempatan semua alat interaksi pengguna yang nyaman, dan oleh karena itu memiliki skor kegunaan yang tinggi.

2. Gunakan elemen sederhana

Untuk mencapai tujuan yang ditetapkan dalam desain datar, desainer menggunakan tombol dan ikon. Mereka harus seintuitif dan sedapat mungkin dapat diklik. Seperti semua elemen antarmuka lainnya, mereka harus datar dan sederhana, tanpa efek tambahan. Selain itu, desainer sering menggunakan bentuk geometris sederhana seperti persegi panjang, lingkaran, dan bujur sangkar, yang memungkinkan setiap bentuk menjadi objek yang terpisah.

3. Fokus pada tipografi

Karena, menurut prinsip sebelumnya, grafik dalam desain datar itu sederhana, tipografi merupakan elemen yang sangat penting - desain prasasti. Dalam desain datar, tipografi muncul bersama dengan tombol.

Font harus dapat dibaca dan, tentu saja, sesuai dengan desainnya, karena font yang sangat berenda akan terlihat tidak pada tempatnya dalam desain yang sederhana. Namun, sebaiknya jangan menggunakan font biasa, lebih baik bereksperimen dan pilih salah satu yang akan menarik perhatian pengguna.

Pertimbangkan memasangkan jenis huruf sans-serif sederhana dengan jenis huruf baru yang terasa seperti seni. Font harus membantu menjaga desain tetap sederhana dan jelas, sedangkan tombol dan elemen lainnya hanya berfungsi untuk meningkatkan interaktivitas.

4. Menarik perhatian dengan warna

Hampir peran utama dalam desain datar dimainkan oleh warna. Jika Anda mempelajari dengan cermat situs yang dibuat berdasarkan konsep ini, hal pertama yang menarik perhatian Anda adalah palet warna yang cerah. Biasanya terdiri dari beberapa warna murni (tanpa corak) yang kontras, dua atau tiga, meskipun jumlahnya bisa mencapai delapan. Apalagi semua warna ini biasanya digunakan secara merata.

Warna yang paling populer adalah warna primer dan sekunder. Yaitu, warna primer (cyan, magenta, kuning, hitam) dan yang diperoleh berdasarkan pencampurannya. Juga, sangat sering dalam skema warna saat membuat desain datar, warna retro digunakan, seperti salmon (salmon), ungu (ungu), dll.

5. Minimalisme

Desain datar bersifat sederhana dan cocok dengan pendekatan minimalis.

Dalam keseluruhan desain situs, terlalu banyak bel dan peluit harus dihindari. Tentu saja, warna dan teks sederhana mungkin tidak cukup. Karena itu, jika Anda ingin menambahkan efek visual, Anda harus memilih foto yang sederhana. Beberapa situs retail menggunakan desain datar untuk menampilkan produk mereka dengan latar belakang yang polos dan tidak mengganggu.

Perlu dicatat bahwa beberapa foto memiliki kedalaman alami, tetapi secara umum cocok dengan keseluruhan bidang desain.

Kata "datar" dalam terjemahan dari bahasa Inggris berarti "datar". Sejak awal, apa yang disebut desain Flat terus mempertahankan posisinya selama beberapa tahun, menempati posisi terdepan di pasar.

Bagaimana semuanya dimulai

Desain web telah banyak berubah sejak awal. Ini telah berkembang jauh dari elemen sederhana dan membosankan menjadi tiga dimensi, cembung, dan hampir material. Ini dapat dengan mudah dilihat pada contoh mengubah tampilan sistem operasi Windows. Komponen visual berkembang seiring dengan perkembangan teknologi. Tapi tren barunya menunjukkan, lebih tepatnya, kembali ke minimalis dan kesederhanaan.

Dari skeuomorphism ke desain datar

Gaya yang mendahului flat adalah skeuomorphism. Ini telah menjadi tren desain utama untuk waktu yang sangat lama. Skeuomorphism adalah gaya pseudo-volumetrik, yang semua elemennya meniru tampilan objek nyata (notebook, jam alarm), dengan bantuan bayangan, tekstur alami, dan hal-hal lain. Contoh mencoloknya ditemukan di antarmuka ponsel cerdas awal. Dia mulai kehilangan posisinya setelah 2010, ketika para desainer perusahaan besar mulai melihat ke arah penyederhanaan dan, ketika mengembangkan antarmuka pengguna, mulai menyingkirkan fitur utama skeuomorphism - tiga dimensi.

Contoh visual yang sangat baik dari perbedaan gaya adalah foto di bawah ini. Gambar di sebelah kiri adalah desain datar, sedangkan gambar di sebelah kanan adalah skeuomorphism.

Fitur karakteristik gaya datar

Datar adalah gaya 2D. Ini sama sekali tidak memiliki efek visual, seperti transisi warna yang halus, bayangan, tekstur volumetrik. Singkatnya, segala sesuatu yang membuat gambar menjadi tiga dimensi.

Ikon (Ikon desain datar) membawa konten informasi utama. Mereka harus sejelas mungkin kepada pengguna dalam hal aplikasi untuk ponsel cerdas. Untuk situs, ikon adalah elemen utama yang mencerminkan kekhususan dan pesan informasinya. Biasanya, mereka disajikan dalam bentuk figur geometris sederhana, lingkaran atau bujur sangkar, dengan gambar kondisional yang khas.

Saat mengembangkan desain Flat, perhatian juga diberikan pada skema warna. Itu harus monoton, tidak mengganggu dan tidak mengganggu pengguna. Paling sering, satu warna murni dan beberapa corak kontras digunakan. Ngomong-ngomong, ada banyak layanan Internet dengan warna desain datar yang bisa Anda gunakan dengan menyalin kode hex dari warna yang Anda suka.

Yang tidak kalah penting adalah yang namanya tipografi (teks). Karena penyederhanaan umum, komponen teks menonjol secara khusus. Ini berarti harus dapat dibaca dan tidak bertentangan dengan gaya umum. Itu akan tergantung pada pilihan font yang berhasil dan warnanya.

Contoh desain datar

Mari kita mulai dengan fakta bahwa ikon dari banyak sumber daya Internet dan jejaring sosial terkenal telah berubah ke arah yang datar. Belum lama ini, raksasa Google dan YouTube juga mengubah desainnya menjadi datar. Sistem operasi Windows, dimulai dengan 8, sepenuhnya meninggalkan semua tanda volume pada ikon yang menyenangkan mata beberapa pengguna di versi sebelumnya, dan mulai mengikuti desain Flat. Pengembang aplikasi seluler untuk iOS dan Android mengikutinya.

Keunggulan desain Flat banyak digunakan oleh situs satu halaman (halaman arahan), yang peran utamanya dimainkan bukan oleh penampilan megah, tetapi oleh fungsionalitas dan keterbacaan.

Evolusi desain datar

Pada awalnya, desain Flat benar-benar datar, yang menimbulkan beberapa kesulitan bagi pengguna yang terbiasa mengangkat tombol. Jika dalam skeuomorphism kemampuan klik tombol langsung terlihat, maka pada variasi pertama desain datar tidak selalu mungkin untuk menentukan interaktivitas elemen untuk pertama kalinya.

Setelah Microsoft merilis Windows 8, dirancang dengan gaya datar, tidak semua pengguna dapat langsung memahami antarmuka baru dan ikon apa yang dapat mereka klik. Munculnya elemen tidak menunjukkan kemungkinan interaksi dengannya. Desain ini lebih nyaman untuk aplikasi seluler, yang mengambil ide ini. Dan Apple adalah yang pertama melakukan ini dalam desain iOS 7.

Namun, desain Flat tidak berhenti dan berkembang ke arah kompleksitas. Saat ini, semakin terlihat seperti desain semi-datar atau, demikian juga disebut, Flat 2.0. Efek kedalaman, bayangan, gradien mulai muncul di dalamnya. Kedalaman dalam desain datar dicapai dengan mengatur elemen pada level yang berbeda atau pada suatu sudut.

Meski begitu, gayanya berada di puncak popularitas dan banyak diminati. Jadi, jika Anda berencana untuk mendesain situs Anda, Anda dapat memilih desain Flat dengan aman. Dan jika Anda memerlukan beberapa elemen yang hilang untuk situs Anda, maka di Internet Anda dapat menemukan sejumlah besar elemen UI desain datar gratis (gratis untuk diunduh), seperti ikon, font, templat, dan komponen antarmuka pengguna lain yang diperlukan.

Gaya pro dan kontra

Tidak diragukan lagi, dalam kehidupan modern yang serba cepat, gaya informatif yang bijaksana seperti itu lebih nyaman daripada pendahulunya. Flat design memiliki sejumlah keunggulan yang tak terbantahkan.

Mungkin yang paling penting adalah pemuatan halaman web yang cepat. Situs web yang menggunakan desain datar terbuka jauh lebih cepat daripada situs web yang dipenuhi dengan animasi dan objek berat lainnya. Waktu muat sangat penting untuk pengoptimalan SEO dan promosi situs web ke atas.

Tampilan yang disederhanakan berkontribusi pada keterbacaan teks dan memungkinkan Anda untuk fokus pada konten utama.

Desainnya terlihat serasi dan holistik, yang menciptakan kesan menyenangkan secara keseluruhan.

Tidak ada yang sempurna dan desain Flat tidak terkecuali. Terlepas dari kesederhanaannya yang tampak, mengembangkan desain web datar yang benar-benar sukses tidaklah mudah. Ada peluang untuk membuatnya membosankan dan tidak menarik. Atau sebaliknya, berlebihan dengan desain dan lupakan fungsionalitasnya. Tugas utama saat mengembangkan desain Flat adalah menjaga keseimbangan sempurna antara keindahan dan kegunaan.