Yang Memandu Desain SISIDANG-NG!

Luqman Iffan Windrawan
PDB+R
Published in
2 min readMar 18, 2019

Halo teman-teman! Kembali lagi bersama hipster PDB+R, Luqman! Dalam kesempatan kali ini saya akan menjelaskan mengenai konsep desain dari SISIDANG!

Filosofi Logo

Eits.. DIbacanya bukan ‘sisidangggg’ ya…

Taukah kamu, kalau nama lengkap dari aplikasi kami sebenarnya adalah SISIDANG-NG?

Nama SISIDANG sendiri diambil dari nama aplikasi yang sudah ada di Fasilkom, yang kepanjangannya adalah ‘Sistem Informasi Sidang’.

Sedangkan imbuhan NG di ujung akhir nama adalah kependekan dari ‘New Generation’, yang berarti generasi baru dari SISIDANG sendiri.

Guideline Desain

Guideline warna, typeface, dan asset dari desain SISIDANG-NG
Guideline tombol, header, sidebar, judul, tabs, forms, dan form CSV

Selain dari yang sudah dijelaskan pada tampilan di atas, ada beberapa hal yang ingin ditekankan pula, yaitu:

  • Font yang dipilih adalah Open Sans. Font ini dipilih karena mudah dibaca untuk website dan di mockup, teks tetap terlihat rapi serta mudah dibaca.
  • Asset yang digunakan bersifat minimalis, agar menunjukkan bahwa kami ingin menjadikan SISIDANG-NG suatu aplikasi yang tidak rumit untuk dipakai dan sebagai estetika.

Desain Halaman Website

Dari pilihan warna dan guideline yang sudah ada, kami membuat desain template yang berupa mockup dari halaman-halaman pada aplikasi menggunakan Figma.

Tampilan dari salah satu halaman mockup di SISIDANG-NG

Konsep dari desain halaman ini didasari dari Bootstrap dan juga template yang diberikan pada desain.cs.ui.ac.id. Kami dianjurkan menggunakan template dari website tersebut oleh Product Owner kami. Kami juga meminjam beberapa konsep dari Bootstrap seperti columns.

Penutup

Sekian beberapa penjelasan dari desain yang digunakan oleh SISIDANG-NG. Tentu saja, desain ini masih belum sempurna dan tetap ada kemungkinan untuk terjadi penyesuaian, terutama setelah dilakukan usability testing.

Terima kasih sudah membaca, tetap semangat teman!

-Luqman

--

--