Bagaimana Desain UI/UX Membuat Content Management System yang Lebih Baik

10 June 2025

Penulis Lutfiya Hasna Izza Rahima (Web UI/UX Designer)

Editor Jessica Patricia (Copywriter)

Bagaimana Desain UI/UX Membuat Content Management System yang Lebih Baik

CMS atau content management system adalah sebuah platform yang digunakan untuk menambahkan, mengedit, dan mengelola konten di website. Fungsi krusial CMS juga mencakup optimasi website agar muncul di peringkat atas. 

Melihat pentingnya CMS dalam operasional digital dan kegiatan bisnis perusahaan, tidak heran jika kini muncul banyak kompetitor CMS di pasaran. Pengguna kini memiliki banyak pilihan dengan keunggulan yang semakin beragam. Salah satu keunggulan yang ditawarkan adalah kemudahan CMS baik dari segi fungsional maupun non fungsional. Oleh karena itu, pengalaman pengguna yang menarik akan menjadi unique selling point yang penting sebagai pertimbangan. 

BACA JUGA: Mengenal Wireframe, Kerangka dalam Desain UI/UX

Sekilas Tentang UI/UX

Pengalaman pengguna atau dalam dunia teknologi lebih dikenal dengan istilah UI/UX merupakan teknik untuk menciptakan pengalaman pengguna yang mudah dan juga optimal. UI merujuk pada tata cara pembuatan sebuah produk dengan memperhatikan estetika. Sedangkan UX menawarkan integrasi produk dari sisi branding, desain, usability, dan elemen strategi. Hal ini meliputi pemahaman mengenai kebutuhan pengguna untuk menentukan tujuan bisnis dari produk yang dikembangkan. Dengan mengetahui tujuan dibuatnya CMS, Anda dapat memetakan kebutuhan dari website yang akan dikembangkan. Dalam konteks CMS, UI/UX tidak hanya mencakup soal estetika saja, tetapi juga bagaimana sebuah konten dapat dibuat dan dipublikasi dengan mudah. 

Elemen-Elemen UI/UX yang Diperlukan dalam Content Management System

Menurut Jesse James Garrett dalam bukunya, desain UX yang baik haruslah memenuhi kriteria sebagai berikut:

  1. Strategy
    Elemen strategi meliputi pemahaman mengenai kebutuhan pengguna untuk menentukan tujuan bisnis dari produk yang dikembangkan. Dengan mengetahui tujuan dibuatnya CMS, Anda dapat memetakan kebutuhan dari website yang akan dikembangkan. Melalui pemahaman ini, setiap elemen UI yang disusun akan mengarah kepada pencapaian tujuan bisnis dan kenyamanan bagi penggunanya.
  2. Scope
    Dalam UX scope berperan dalam menentukan batasan fitur dari produk yang dikembangkan. Scope yang terdefinisi dengan baik akan mencegah adanya pemborosan waktu dan anggaran. Dalam konteks CMS scope akan memastikan desain fokus pada kebutuhan pengguna. Dengan menetapkan “ust-have (contoh: publikasi artikel, manajemen user) dan nice-to-have (contoh: live chat support dan rekomendasi konten) akan mencegah penambahan fitur mendadak yang mengganggu CMS. 
  3. Architecture
    Arsitektur informasi pada CMS dapat dikatakan sebagai peta jalan yang mengarahkan pengguna pada tujuan. Struktur menu yang konsisten akan meminimalkan langkah klik dan memastikan pengguna dapat melacak konten tanpa kebingungan. Dengan mengelompokkan fitur utama ke dalam susunan yang logis, pengguna tidak perlu menebak di mana tata letak informasi yang dibutuhkan. Misalnya elemen “konten” akan mewakili post, pages, dan media. Selain itu, implementasi heading dan ARIA roles juga menjamin struktur informasi tersampaikan dengan baik kepada pengguna.
  4. Skeleton
    Membangun tampilan yang intuitif membutuhkan penempatan elemen desain yang strategis. Skeleton menjadi tahapan di mana struktur interface dirancang, mulai dari penataan, layout, elemen navigasi, dan komponen UI lainnya. Pada tahap ini, Anda akan dikenalkan pada wireframing, di mana desainer akan menyusun kerangka dasar dashboard CMS sebelum memasukkan elemen visualnya. Penerapan wireframe akan memastikan bahwa setiap tombol, panel, dan modul sudah berada pada posisi yang optimal. 
    Selanjutnya, penerapan whitespace & visual hierarchy akan membantu menghilangkan kebingungan dan kecemasan pengguna akibat terlalu padatnya informasi yang tersaji. Fokus dari kegiatan ini adalah memberikan jarak yang cukup antar elemen agar mata tidak lelah sekaligus memandu pengguna melihat informasi dan elemen pendukung dengan lebih jelas. Dengan penerapan dan uji skeleton, desainer dapat menambahkan styling dan branding tanpa mengganggu fondasi UX yang telah terbangun. 
  5. Surface
    Surface berkaitan dengan aspek visual atau UI dari desain, seperti warna, tipografi, dan elemen grafis. Layer ini berkaitan dengan sensory design yang meliputi bagaimana user melihat, mendengar, mencium, menyentuh, dan merasakan. Pada tahap surface, elemen visual seperti warna, tipografi dan ikon ditambahkan untuk menciptakan kesan yang sesuai dengan kebutuhan bisnis. Palet warna biasanya dipilih sesuai dengan identitas merek, misalnya warna primer untuk call-to-action dan warna sekunder untuk tombol bantuan. Tipografi membantu pengguna dalam memindai informasi secara cepat dan mengurangi kelelahan mata. 
    Ikonografi seperti ikon pena untuk edit, ikon tong sampah untuk delete, berfungsi untuk menjaga tampilan tetap bersih tanpa memerlukan teks yang panjang. Pada tahap surface, grafik ilustratif juga kerap digunakan untuk memberi konteks dan mengurangi kesan tampilan yang monoton. Selain visual, penambahan mikro-interaksi dan respons uga menjadi kunci agar desain CMS terasa lebih hidup dan interaktif. Dengan demikian, proses desain pada elemen ini menjadi tahapan yang penting. Hal ini tidak hanya mempercantik tampilan, tetapi juga meningkatkan kepercayaan dan kenyamanan pengguna dalam menggunakan CMS. 

Kesimpulan

Merancang CMS yang efektif bukan hanya sekedar menambahkan fitur sebanyak mungkin, tetapi bagaimana menyatukan antara kebutuhan bisnis dan kenyamanan pengguna. Dengan memahami dan menerapkan lima elemen UX ini, pengembangan CMS dapat lebih terarah dan efisien. Pendekatan UI/UX yang baik dan menyeluruh menjadi kunci utama dalam menciptakan desain yang relevan karena desain yang unggul tidak hanya sekedar nyaman dipandang, tetapi juga cerdas digunakan. 

Sebagai salah satu digital agency Indonesia, Suitmedia menghadirkan layanan pengembangan CMS yang dirancang dengan prinsip UI/UX terbaik. CMS kami dirancang untuk menyederhanakan alur kerja dan meningkatkan fleksibilitas organisasi dalam mengelola konten digital. Dengan dashboard yang dapat disesuaikan sesuai kebutuhan spesifik bisnis, kami membantu klien menavigasi kompleksitas digital dengan solusi yang efisien, intuitif, dan siap menghadapi tantangan masa depan. Tunggu apalagi? Mari mulai proyek bersama Suitmedia!

Industry

Related Articles