Contoh Kuat Ruang Putih Dalam Desain Web Dan Apa yang Dapat Dipelajari Merek Digital Dari Mereka
Diterbitkan: 2018-07-04Ketika datang ke desain situs web, ada banyak elemen yang perlu dipertimbangkan jika Anda ingin situs web Anda mencuri perhatian. Dan ruang putih memainkan peran kunci dalam desain yang menggairahkan.
Tapi mengapa ruang putih begitu penting?
Bayangkan ini: Anda berada di toko kelontong mencoba membeli teh favorit Anda. Rak penuh sesak, dan produk tergeletak di lantai sehingga sulit untuk dipindahkan. Lebih dari itu, perwakilan penjualan terus memberi Anda penawaran terbaru.
Tak perlu dikatakan, Anda akan segera meninggalkan toko tanpa niat untuk kembali.
Hal yang sama berlaku untuk situs web Anda. Semakin banyak informasi yang Anda masukkan ke dalamnya, semakin sulit bagi pengunjung Anda untuk menavigasi dan menemukan konten atau produk yang mereka minati.
Dan Anda tidak ingin membanjiri atau memadati pengunjung -- terutama di awal. Statistik menunjukkan bahwa 40 persen pengguna akan berhenti terlibat dengan sebuah situs dan beralih ke merek lain jika mereka menemukan situs web yang terlalu tidak teratur atau ramai.
Itu sebabnya spasi adalah konsep penting dalam desain web. Ini memungkinkan konten Anda bernafas, dan ini membantu Anda menarik perhatian pengguna ke elemen penting pada halaman. Ini mungkin terdengar paradoks, tetapi di era konten yang berlebihan, kesederhanaan adalah kesempatan terbaik Anda untuk diperhatikan.
Apa itu Ruang Putih?
Hal pertama yang pertama -- ruang putih tidak harus putih. Banyak merek akan memilih menggunakan warna putih untuk membuat ruang putih ini karena merupakan warna yang cerah dan bersih. Tetapi ruang putih umumnya mengacu pada ruang negatif dalam desain -- desain web, desain aplikasi, desain cetak, dan seterusnya.
Ini adalah ruang kosong dalam sebuah desain. Dan dalam desain web, ini mengacu pada ruang antara teks, gambar, animasi, dan elemen desain lainnya yang menambahkan sesuatu ke desain.
Selama ruang ini bebas dari elemen seperti teks dan citra, itu dianggap sebagai ruang putih. Dan ini adalah alat yang ampuh dalam desain web untuk mempromosikan situs web yang bersih, elegan, dan menarik.
Agar situs web berkembang, konsumen perlu terlibat dengan mereka. Dan konsumen tidak ingin terlibat dengan desain yang dikemas dengan teks, citra, dan elemen menggelegar lainnya. Ketika ada terlalu banyak hal yang terjadi dalam sebuah desain, orang-orang melepaskan diri.
Mereka keluar dari layar dan mencari di tempat lain untuk informasi, produk, atau layanan yang awalnya mereka cari. Dan merek dan bisnis Anda tidak mampu membayar konversi, prospek, atau penjualan yang hilang.
Jadi, penting bagi Anda untuk memahami pentingnya ruang putih dan bagaimana mengintegrasikannya ke dalam desain Anda sendiri.
Itu sebabnya kami di sini untuk membantu.
Contoh berikut menunjukkan kepada Anda bagaimana Anda dapat menggunakan ruang negatif untuk membuat situs Anda menonjol dan mempertahankan pengunjung.
14 Contoh Menakjubkan Ruang Putih Dalam Aksi
1. apel
Bayangkan sejenak bahwa Apple adalah merek baru yang belum pernah Anda dengar sebelumnya dan ini adalah pertama kalinya Anda mengunjungi situs mereka. Kami berani bertaruh bahwa desain yang sederhana dan bersih akan membuat Anda berkesan dan Anda akan menganggap produk mereka sebagai produk yang inovatif dan berkinerja tinggi.
Ruang putih di sini sangat fenomenal, membiarkan produk menjadi pusat perhatian. Fotografi produk ini menarik perhatian, dan teks sederhana menambahkan konteks yang cukup agar desainnya bersinar. Latar belakang putih bersih adalah latar belakang yang sempurna untuk gambar dan teks ini. Dan itu mengatur panggung untuk pengalaman pengguna dan perjalanan pengguna yang dinamis dan menakjubkan.
Dalam contoh ini, warna putih menambah kebersihan pada ruang negatif yang membentuk sebagian besar desain. Dan itu segera menarik perhatian, menumbuhkan suasana antisipasi yang bersemangat.
Apple memanfaatkan ruang putih dengan sangat baik untuk menonjolkan produk cantik mereka. Dan Anda pasti harus mengikuti contoh mereka.
2. Dropbox
Dropbox hadir dengan proposisi berisiko: layanan mereka memungkinkan Anda menyimpan file di cloud. Dengan semakin banyak berita tentang pelanggaran dan kebocoran, tidak mengherankan jika orang enggan untuk menempatkan data mereka di luar sana di ruang virtual. Namun, Dropbox berhasil meredakan beberapa kekhawatiran melalui desain yang hebat dan penggunaan ruang negatif yang sangat baik. Ilustrasi seperti anak-anak dan nada warna yang menenangkan membuat layanan mereka terlihat menyenangkan, mudah didekati, dan menarik untuk dicoba.
Ruang negatif dalam desain ini memungkinkan ilustrasi dan teks yang menarik mengapung ke permukaan. Ini adalah merek yang menawarkan layanan kompleks yang mungkin tidak dipahami banyak orang apalagi dipercaya. Itu berarti bahwa merek perlu menghabiskan banyak waktu untuk menyediakan konteks dan menyederhanakan konsep kompleks ini. Dan Dropbox melakukannya dengan ilustrasi yang cerdas dan intuitif serta tata letak yang bersih secara keseluruhan yang mengarahkan pengguna dalam perjalanan mereka dengan mudah.
Dan dengan ruang negatif inilah pengalaman pengguna yang intuitif tercipta.
Apakah Anda ingin melihat lebih banyak contoh ruang putih yang kuat? Lihat 20 desain situs web bersih ini untuk memicu inspirasi Anda!
3. Dibangun oleh Kerbau
Spasi tidak selalu identik dengan desain minimal. Anda dapat memiliki tata letak yang bersih dan bernapas dan masih menggunakan desain yang lebih kompleks. Segi enam berkerumun di beranda Buffalo akan sangat banyak tanpa ruang negatif. Namun, karena digabungkan dengan ikon warna-warni, garis putih terus-menerus menarik minat Anda pada kategori utama saat menggulir ke bawah.
Ruang putih dalam desain ini memberikan desain yang hampir kacau di ruang beranda untuk berkembang dan bernafas. Mereka penuh warna dan kreatif, dengan kepribadian yang menangkap esensi merek Built By Buffalo.
Ruang negatif yang mengelilingi elemen-elemen ini menakjubkan dan canggih. Dan itu membuat merek dan esensinya benar-benar bersinar, memberikannya latar belakang sederhana sehingga elemen-elemen ini dapat menari bersama.
4. Everlane
Salah satu kesalahpahaman paling umum tentang spasi adalah bahwa itu berarti tidak adanya warna atau gambar sama sekali. Itu tidak bisa jauh dari kebenaran, dan Everlane ada di sini untuk menunjukkan itu.
Ruang negatif dan gambar bekerja sama dengan baik, selama ditempatkan secara strategis di halaman. Everlane menggunakan gambar produknya sebagai latar belakang, tetapi tanpa melelahkan atau membingungkan pengunjung. Ajakan bertindak sederhana muncul di tengah layar, mendorong pengunjung untuk berbelanja. Keindahannya adalah tidak mengganggu pengalaman dengan cara apa pun.
Ini adalah keputusan cerdas oleh para desainer Everlane. Menggunakan fotografi adalah cara yang berani dan menarik untuk melibatkan dan menarik perhatian. Dan memasukkan ruang putih yang tenang bahkan ke dalam fotografi menunjukkan dedikasi merek untuk tetap modern, segar, dan bersih. Gambar ini meninabobokan pengguna bersama dengan perjalanan mereka dan membuat mereka terus menggulir untuk lebih banyak lagi.
5. Airbnb
Spasi di beranda Airbnb menekankan pesan mereka dan memberi tahu Anda dengan jelas dan ringkas siapa mereka dan bagaimana mereka dapat membantu Anda. Yang paling penting, itu membuat Anda langsung tertarik pada apa yang Anda minati – untuk mencari ruangan, yang merupakan ajakan bertindak yang menyamar tanpa memaksa.
Ruang putih di sini menghilangkan kebingungan dan menciptakan perjalanan pengguna yang ringkas dan jelas. Pengalaman pengguna meningkat berkat kesadaran Airbnb. Ia mengetahui apa yang diinginkan pengguna dan menghubungkan mereka dengan segera -- dengan ruang putih yang banyak ini membantu mereka menavigasi ke bagian yang ingin mereka lihat.
6. Chanel
Jika ada seseorang yang memahami potensi ruang kosong dalam menyampaikan pesan profesionalisme dan kecanggihan, maka itulah industri fashion. Ada alasan mengapa Chanel adalah salah satu merek mewah paling kuat di dunia, dan situs eCommerce mereka adalah pelajaran bagi siapa saja yang ingin belajar tentang desain web yang hebat.
Situs web ini benar-benar menampilkan produk pada tampilan yang jelas, dan ruang putih yang bersih menciptakan keanggunan dan kemewahan yang hampir nyata.
Chanel menggunakan ruang negatif untuk memamerkan produk mereka dan membantu pengguna menemukan informasi yang menarik bagi mereka. Dan itu dilakukan bersama elemen kreatif dan keren seperti fotografi, tipografi, dan minimalis.
Jika Anda ingin mempromosikan merek, produk, dan layanan yang agung, duniawi, dan memukau, Anda dapat belajar dari contoh ruang putih ini dan kemampuannya untuk meningkatkan desain secara keseluruhan.
7. Suka kecil
Agensi digital membuktikan bahwa spasi dan minimalis tidak harus statis. Atau kosong. Atau membosankan. Sebagai gantinya, mereka memilih untuk memutar demo layar penuh dari proyek terbaru mereka di latar belakang beranda situs web. Video menarik membujuk Anda untuk mengklik CTA untuk mengetahui lebih lanjut. Mereka tetap fokus pada video dengan penggunaan ruang negatif yang sangat baik dan salinan minimal.
Ini adalah penggunaan ruang putih yang dinamis yang hampir tidak terasa kosong. Video ini dan gambar berlapis ini sangat menarik, memikat dan menarik Anda segera. Dan kesederhanaan yang berasal dari teks putih cerah benar-benar menempatkan pengunjung dalam pola pikir untuk mengeksplorasi, belajar, dan menemukan.
8. Eurovet
Eurovet adalah produsen inovatif produk hewan. Merek yang berbasis di Rusia ini telah berkecimpung dalam bisnis produk berteknologi maju sejak tahun 1998, dan Anda dapat melihatnya dalam desain kreatif, modern-hampir futuristik. Tetapi ruang negatif yang bersih dan terbuka adalah yang benar-benar membantu desain ini menjadi lingkaran penuh.
Pewarnaan dan ilustrasi ilmiah menambah konteks dan kejelasan, dan mereka diatur dengan latar belakang yang terbuka dan halus yang benar-benar memungkinkan gambar dan gambar ini muncul.
Website ini bertujuan untuk menginformasikan. Ada banyak informasi yang dikemas ke dalam desain ini, tetapi diorientasikan sedemikian rupa sehingga mudah dicerna dan dipahami oleh pengguna. Dan ruang putih memberikan latar belakang yang sempurna untuk angka dan ilustrasi ini agar benar-benar berdampak pada pemirsa.
Ruang negatif membuat desain ilmiah ini lebih mudah didekati dan bersahabat. Ini memberi desain ruang bernapas dan memungkinkan pengguna untuk benar-benar berinteraksi dengan desain ini dan memahami konsep kompleks yang disajikan kepada mereka.
9. Sonos
Sonos adalah merek yang mengkhususkan diri dalam sistem suara nirkabel. Ini adalah pemimpin dalam industri ini, dengan produk yang inovatif, menarik, dan diminati.
Ini adalah produk yang mudah digunakan, dan kegunaan ini tercermin dalam desain situs web yang intuitif dan bersih. Desain ini terdiri dari citra produk, video menarik, animasi kreatif, dan ruang kosong.
Ruang putih dalam desain ini digunakan untuk menonjolkan produk dan mempromosikan branding. Ini adalah cara untuk menciptakan identitas kohesif yang dapat berinteraksi dengan pengguna, dengan mudah. Ini juga digunakan untuk menguraikan produk dan bagaimana penggunaannya, menunjukkan kepada pengunjung situs betapa mudahnya menavigasi antarmuka serta produk.
Ruang putih memudahkan pengguna dalam perjalanan mereka dan membantu mereka melihat merek dan produknya secara positif.
10. Brontida
Brontide adalah merek yang didedikasikan untuk produksi butilen glikol. Dan itu mempromosikan pembuatan bahan kimia ini secara aman dan efisien — dan semangat itu terlihat jelas di seluruh desain.
Ini bukan situs web yang didukung sains biasa — penuh dengan baris teks, gambar yang membosankan, dan desain yang kurang. Tidak, situs web ini menarik, kreatif, dan menyenangkan — dan penggunaan ruang putih mempromosikannya.
Ada sedikit teks dalam desain ini, tetapi cukup untuk terlibat dan menginformasikan. Efek halus menambah desain ini, tetapi ada keterbukaan dan kemudahan bernapas di sini berkat ruang putih yang memudahkan pengguna untuk belajar dan mendidik diri mereka sendiri tentang senyawa kimia ini.
Jika Anda ingin memberi tahu, gunakan ruang putih untuk membuat pengalaman lebih menyenangkan.
11. Jannata
Jannata adalah butik spa dan resort di Bali. Hasilnya, situs web ini merupakan gabungan dari gambar dan video yang menarik dan memikat untuk membuat Anda ingin bersantai. Tipografi dalam desain ini cerah, gambarnya menawan, dan navigasinya sangat mudah.
Tetapi jika bukan karena ruang negatif yang hidup di setiap sudut, desain ini akan runtuh. Ruang negatif menambahkan suasana dalam desain ini, terdiri dari gambar berbayang dan berlapis serta latar belakang gelap dan menenangkan pada bilah menu dan teks.
Ruang negatif dapat membantu mengatur suasana hati, dan dalam desain ini, itu sangat jelas. Palet warna yang gelap dan misterius menjadikan ruang putih sebagai bagian dari desain secara integral, menggunakan kekosongan untuk mengatur panggung dan terlibat pada tingkat emosional.
12. Upacara Pemanggang Kopi
Situs web Ceremony Coffee Roasters adalah desain yang cerah, lapang, dan canggih yang menampilkan cita rasa kopi yang canggih. Gambar bahan dan rasa yang menarik berada di garis depan desain, tetapi pewarnaan pastel yang membentuk ruang negatif benar-benar membawa desain lingkaran penuh.
Ini adalah desain yang bersih dan berwarna-warni, tetapi menenangkan berkat ruang kosong yang luas yang memudahkan pengguna untuk menjelajahi banyak penawaran kopi, memahami lebih dalam rasa yang terkandung dalam kopi ini dan bagaimana pengguna bisa mendapatkannya.
13. Max Chocolatier
Situs web Max Chocolatier menekankan pada budaya, warisan, dan kreasi cokelat. Anda dapat melihat ini di halaman produk, halaman arahan yang luas dan banyak lagi. Tapi itu juga terlihat jelas dalam desain yang digerakkan oleh gambar.
Halaman beranda terbuka dengan foto lanskap Swiss yang berani. Ini memberi pengunjung rasa dari mana cokelat ini berasal dan dedikasi merek ini terhadap cokelat berkualitas.
Dan ruang yang bersih dan kosong membuatnya seperti mimpi untuk berinteraksi, memungkinkan pengguna untuk membuat perjalanan mereka sendiri dan bernavigasi di seluruh situs dengan cara yang mereka inginkan. Ini adalah penggunaan ruang putih yang inovatif dan menarik yang menambahkan beberapa kesenangan pada kehadiran kekosongan.
Kekuatan Ruang Putih Dalam Desain Web
Bersih, jelas, dan kohesif -- itu hanya beberapa kata yang digunakan untuk menggambarkan desain yang memanfaatkan ruang putih secara efektif. Ruang putih menambahkan cahaya dan kecerahan ke desain situs web apa pun yang membuatnya lebih menarik untuk berinteraksi.
Tidak hanya membuat orang ingin menggulir, tetapi juga membuatnya lebih mudah. Navigasi disederhanakan ketika tata letaknya terbuka dan lapang, itulah yang dapat dilakukan ruang negatif untuk sebuah desain. Ini dapat memberikan ruang bernapas, membuatnya lebih mudah dan lebih menyenangkan bagi pengguna untuk menyelami situs web Anda dan kontennya.
Merek dapat belajar dari contoh ruang putih ini karena ada begitu banyak cara untuk bermain-main dengannya. Ruang putih tidak harus putih, dan tidak harus membosankan. Bahkan, itu bisa menjadi bagian paling menarik dari sebuah desain dalam beberapa kasus, menumbuhkan antusiasme dan antisipasi yang membuat orang terus menggulir, belajar, dan membeli.
Ruang putih mendeklarasikan layar dan membuat keseluruhan pengalaman pengguna dan perjalanan pengguna lebih menarik dan lebih efisien. Jika merek Anda menggunakan situs web yang mengemas banyak informasi ke dalamnya, Anda mungkin ingin melakukan evaluasi diri.
Anda tidak ingin pengguna dimatikan oleh desain Anda sebelum melihat produk dan layanan Anda.
Mudah-mudahan, contoh-contoh ini telah meyakinkan Anda tentang pentingnya menggunakan ruang negatif dan memberi Anda beberapa ide tentang cara memasukkannya ke dalam desain Anda. Mungkin sulit pada awalnya jika klien Anda adalah tipe pemaksa yang meminta Anda untuk memasukkan informasi sebanyak mungkin ke dalam halaman, tetapi jangan menyerah. Jelaskan bagaimana spasi putih meningkatkan pengalaman pengguna secara keseluruhan dan meningkatkan konversi.
Dan gunakan contoh-contoh ini untuk membantu menyampaikan maksud Anda.
Butuh lebih banyak wawasan dan saran desain? Mendaftar untuk Dosis Harian DesignRush!
Jika website Anda kurang, rapikan! Dan agensi desain dan pengembangan web ini dapat memberi Anda alat yang Anda butuhkan.