Kenapa Developer Butuh Sketsa Visual
Saat membuat website atau aplikasi, tidak semua ide harus langsung ditulis dalam kode. Kadang kita perlu membuat sketsa terlebih dahulu agar alur dan struktur lebih mudah dipahami.
Sketsa visual bisa membantu menjelaskan layout halaman, flow aplikasi, struktur database, sampai hubungan antar fitur.
Masalahnya, banyak tool desain terasa terlalu berat jika hanya dipakai untuk membuat konsep awal. Di sinilah Excalidraw bisa menjadi pilihan yang praktis.
Apa Itu Excalidraw
Excalidraw adalah canvas digital untuk membuat diagram dengan gaya hand-drawn. Bentuknya sederhana, ringan, dan mudah digunakan.
Kita bisa membuat kotak, garis, panah, teks, dan elemen visual lain tanpa harus belajar tool desain yang kompleks.
Excalidraw cocok untuk:
- sketsa desain website
- alur logic aplikasi
- diagram database sederhana
- flow API
- arsitektur sistem
- ide konten atau product flow
Karena berbasis canvas, area kerja terasa luas. Gambar juga tetap terlihat tajam saat diperbesar karena menggunakan pendekatan visual berbasis vektor.
Kenapa Dikombinasikan dengan Obsidian
Obsidian adalah aplikasi catatan berbasis file lokal. Jika digabungkan dengan plugin Excalidraw, kita bisa membuat catatan teknis dan gambar visual dalam satu tempat.
Ini berguna untuk developer yang ingin menyimpan dokumentasi project secara lebih rapi.
Contohnya, dalam satu folder project kita bisa punya:
- catatan requirement
- diagram flow aplikasi
- sketsa UI
- rancangan database
- catatan API endpoint
- todo pengembangan
Dengan pola ini, dokumentasi tidak tersebar di banyak tempat.
Contoh Penggunaan untuk Project Website
Misalnya kita ingin membuat halaman dashboard admin.
Sebelum coding, kita bisa membuat sketsa sederhana:
- sidebar di sebelah kiri
- header di bagian atas
- card statistik di halaman utama
- tabel data di bagian bawah
- tombol action untuk create, update, dan delete
Setelah layout jelas, barulah developer mulai membuat komponen frontend.
Pola ini membuat proses development lebih terarah karena kita sudah punya gambaran sebelum masuk ke kode.
Manfaat untuk Backend dan Frontend
Untuk frontend, Excalidraw membantu menggambarkan tampilan dan flow halaman.
Untuk backend, Excalidraw bisa dipakai untuk menggambar alur request API, struktur database, dan relasi antar service.
Contoh sederhana flow API:
User Login
-> Frontend kirim email dan password
-> Backend validasi user
-> Backend buat token
-> Frontend simpan token
-> User masuk dashboard
Flow seperti ini mudah dipahami oleh tim, bahkan sebelum dokumentasi teknis dibuat lebih detail.
Kapan Perlu Menggunakan Excalidraw Plus
Excalidraw versi web bisa digunakan untuk menggambar secara cepat. Namun jika ingin fitur cloud, workspace, dan kolaborasi yang lebih rapi, Excalidraw Plus bisa menjadi pilihan.
Untuk kebutuhan personal atau dokumentasi lokal, kombinasi Obsidian dan plugin Excalidraw sudah cukup nyaman.
Apalagi jika kita ingin semua file tetap tersimpan di komputer sendiri.
Kesimpulan
Obsidian dan Excalidraw adalah kombinasi yang bagus untuk developer yang ingin membuat dokumentasi visual secara sederhana.
Tool ini cocok untuk membuat sketsa UI, flow aplikasi, diagram database, dan rancangan sistem sebelum masuk ke tahap coding.
Dengan visual yang jelas, proses diskusi dan development menjadi lebih cepat, lebih rapi, dan lebih mudah dipahami.