People Innovation Excellence
 

DARK MODE DESIGN PADA WEBSITE DAN APLIKASI (Part 2)

Desain mode gelap dapat digunakan pada berbagai media mulai dari aplikasi seluler hingga jam tangan pintar sampai dengan interface TV. Tren desain dark mode ini dapat memajukan merek Anda. Meskipun demikian, Anda perlu menggunakan mode ini secara tepat dalam desain Anda. Berikut adalah beberapa kiat saat merancang situs web atau user interface (UI) aplikasi yang menggunakan tema gelap.

 

Desain mode gelap tidak selalu cocok untuk semua keadaan. Dalam menggunakan dark mode, Anda perlu menyesuaikan warna desain UI dengan warna gadget Anda. Apabila warna gadget Anda mendukung mode gelap, maka Anda dapat menggunakan mode tersebut. Jika gadget Anda menggunakan spektrum warna yang luas, maka pertimbangkanlah UI yang lebih ringan. Spektrum penuh warna tidak dapat dibaca dengan menyenangkan di latar belakang gelap. Kemudian, UI mode gelap juga berguna untuk meningkatkan industri tertentu. Merek yang berfokus pada hiburan cocok untuk mode gelap dan sering dipasangkan dengan latar belakang gelap dalam kehidupan nyata. Selanjutnya, mode gelap sangat cocok untuk kondisi estetika desain minimalis dengan konten terbatas. Mode gelap juga dapat menciptakan respons emosional tertentu seperti suasana misteri atau sedikit drama. Visibilitas rendah menciptakan rasa ingin tahu dan memperkuat ketegangan secara emosional. Warna gelap dari design mode gelap membangkitkan emosi yang terkait dengan kemewahan dan kemakmuran. Jika Anda ingin menarik perhatian pada suatu hasil karya yang baik, pertimbangkan UI mode gelap.

 

Untuk dapat menggunakan design dark mode pada UI secara tepat, ada beberapa hal yang perlu diperhatikan. Pertama, aturlah agar tidak terlalu gelap. Hal ini dapat dipelajari dari kecenderungan penerbit buku yang tidak menggunakan kertas putih. Mengapa demikian? kontras kertas putih dengan tinta hitam yang terlalu mencolok cepat atau lambat dapat menyebabkan sakit kepala. Hal yang sama berlaku juga untuk perangkat digital. Warna mode gelap yang baik adalah nuansa abu-abu yang dipadukan dengan warna desaturasi. Kedua, kontras warna perlu diatur secara tepat. Latar belakang mode gelap harus cukup gelap untuk menampilkan teks putih. Ketiga, Anda perlu melakukan desaturasikan warna. Hindari penggunaan warna latar belakang gelap secara penuh tetapi gunakanlah warna desaturasi seperti pastel dan warna yang ditambahkan abu-abu dan putih yang disesuaikan dengan mode pencahayaannya.

 

 

Selain pengaturan level gelap, kontras, desaturasi warna dalam suatu UI yang mengusung dark mode, masih ada beberapa hal lainnya yang tak kalah pentingnya untuk dapat menghasilkan UI dark mode yang menarik yaitu, Anda perlu menggunakan warna yang sifatnya “menyala” secara tepat. Yang dimaksud dengan warna “menyala” adalah warna yang biasanya digunakan untuk huruf. Apabila digunakan warna hitam sebagai latar belakangnya, maka gunakanlah wana abu-abu muda. Selanjutnya, dalam memilih dan memasangkan warna pada design UI, hindari penggunaan warna yang didapat dari sekedar membalikkan warna. Anda perlu mempertimbangkan tujuan psikologi dari warna yang Anda pilih. Kemudian, dalam design UI dark mode Anda, perlu adanya gradasi warna yang diatur hierarki visualnya seperti yang terlihat pada gambar tampilan UI Sublime Text di atas. Setelah design UI dark mode Anda selesai dirancang, lakukanlah pengujian serta evaluasi terhadap versi design tersebut dan buatlah penyesuaian berdasarkan umpan balik yang Anda terima.

 

 

 

Sumber =

How to use Dark Mode on iPhone in iOS 13

https://99designs.com/blog/web-digital/dark-mode/

https://forum.sublimetext.com/t/support-dark-theme-on-windows/48255/5


Published at :
Written By
Elizabeth Paskahlia Gunawan, S.Kom., M.Cs.
Lecture | Computer Science
Leave Your Footprint

    Periksa Browser Anda

    Check Your Browser

    Situs ini tidak lagi mendukung penggunaan browser dengan teknologi tertinggal.

    Apabila Anda melihat pesan ini, berarti Anda masih menggunakan browser Internet Explorer seri 8 / 7 / 6 / ...

    Sebagai informasi, browser yang anda gunakan ini tidaklah aman dan tidak dapat menampilkan teknologi CSS terakhir yang dapat membuat sebuah situs tampil lebih baik. Bahkan Microsoft sebagai pembuatnya, telah merekomendasikan agar menggunakan browser yang lebih modern.

    Untuk tampilan yang lebih baik, gunakan salah satu browser berikut. Download dan Install, seluruhnya gratis untuk digunakan.

    We're Moving Forward.

    This Site Is No Longer Supporting Out-of Date Browser.

    If you are viewing this message, it means that you are currently using Internet Explorer 8 / 7 / 6 / below to access this site. FYI, it is unsafe and unable to render the latest CSS improvements. Even Microsoft, its creator, wants you to install more modern browser.

    Best viewed with one of these browser instead. It is totally free.

    1. Google Chrome
    2. Mozilla Firefox
    3. Opera
    4. Internet Explorer 9
    Close