Yuk Buat Use Case Diagram dengan Draw.io

22 Jan 2025 12:40 18 Hits 0 Comments Approved by Plimbi
Berikut adalah tutorial membuat use case diagram menggunakan Draw.io

Perancangan sangat berpengaruh terhadap hasil akhir dari suatu produk. Dengan memanfaatkan metode perancangan, kita dapat meminimalisir terjadinya kesalahan dalam suatu alur sistem. Sehingga kita tidak akan melakukan revisi berulang kali terhadap produk Kita. Karena perancangan dapat menjadi sebuah pedoman pengerjaan suatu produk. Sama halnya dengan pembuatan sebuah website. Sebelum melakukan eksekusi coding, kita sebaiknya membuat perancangan website yang dibutuhkan.

 

Salah satu model perancangan yang dapat kita buat yaitu use case diagram. Use case adalah diagram perancangan yang digunakan untuk menunjukan alur sistem secara berurutan. Use case juga menggambarkan interaksi aktor dengan sistem. Sebelum membuat use case diagram kita harus mengenal komponen apa saja yang dibutuhkan untuk membuat sebuah use case. Berikut adalah beberapa komponen yang mendukung pembuatan Use case yaitu.

1. Aktor

Aktor merupakan orang yang berinteraksi langsung Ke dalam sebuah sistem. Misalkan kita ingin membuat sebuah website absensi kehadiran guru. Maka aktor yang berinteraksi langsung dengan sistem adalah guru. Simbol dari aktor berupa 'orang lidi'.

AD_4nXft5ujAD005li5qRk4-qo31-cb_apkpJ0RbzRd0HZiM76vnlX2XrtiOAkW12x4US7UbOqPV3FEyBHoYLkK3G0RWkITPd0bZLKK-FAzwFsBCE9UIyb6JXSmECDeHbUgPm1PGGjz9Lg?key=a_p7dUYvZT6P6z5EhHV9VE_7Sumber gambar : google image

2. Use case

Use case adalah tindakan didalam sistem yang dilakukan oleh seorang aktor. Misalkan dalam website absensi kehadiran guru. Guru harus melakukan login terlebih dahulu agar dapat mengakses website. Nah login merupakan use case dari aktor guru. Simbol dari use case adalah lingkaran lonjong atau elips.

AD_4nXfJWKoQ8NfWNmL0YSU1R2S6ofes0BHP2yRhW-yslAJo6KinujFmTDIdfxBqnnVHfJ2h4idtnR__9wJ_MlmatrQZR55OQ-21WRPmbz0Uu1k14JzQaAQ0MmyWPnJ-_C1k2PKBhYr3Wg?key=a_p7dUYvZT6P6z5EhHV9VE_7Sumber gambar : google image

3. Association

Association adalah garis yang menghubungkan antara aktor dan use case. Garis ini menunjukan aktor akan melakukan tindakan apa saja didalam sistem.

AD_4nXduBYdjB--4paC4w8QPDJUMqy0UgZowq54cto6OL0GsQV4yID2fQzS_sMU03XathkQNc56kOKEXekOxyASm0kCmbF1UJUgJu8yixM3vnQdrqHessOZqRke2vigpnd1T1hDPXbRj?key=a_p7dUYvZT6P6z5EhHV9VE_7 Sumber gambar : google image

 

Hal yang harus dipersiapkan sebelum membuat perancangan yaitu siapkan terlebih dahulu apa saja yang nanti akan berada didalam sistem dan berhubungan langsung dengan sistem. Kita harus dapat menentukan aktor yang berinteraksi langsung didalam sistem dari aplikasi yang akan dibuat. Actor didalam sebuah use case digambarkan dengan gambar 'orang lidi'. Selain user, hal lain yang harus dipersiapkan yaitu alur kerja suatu sistem. Terdapat berbagai template yang sudah disediakan oleh Draw.io salah satunya yaitu template use case diagram. Jika kalian tidak ingin ribet membuatnya secara manual, kita dapat menggunakan template yang sudah disediakan.

 

Pada artikel kali ini Penulis akan memberikan tutorial membuat use case secara manual menggunakan Draw.io. Berikut adalah hal yang harus dipersiapkan yaitu Browser dan jaringan internet. Karena Draw.io merupakan aplikasi yang diakses secara online, pastikan jaringan internet tersedia untuk membuat projek. Ketik alamat url Draw.io.com pada browser untuk membuka aplikasi Draw.io.

 

Sekarang kita akan menuju ke langkah selanjutnya yaitu membuat file baru. Berikut adalah langkah langkah nya:

1. klik "file" yang berada di pojok kiri pada bagian atas halaman utama

AD_4nXc1WU4T4gAmzL_RMvTmV_0J2ak-GfC7LPW7X2SlmrjqLtWorYzD043p8fa_mTaFMJSnrYn5EvUOa4muY5DX8-3DacbPQWFjwTyqPP6ncZ4lGawviPp4aCk_X5t8OB1yWRBtvzIphg?key=a_p7dUYvZT6P6z5EhHV9VE_7



 

2. lalu klik “new”

Apabila ingin membuat diagram sendiri tanpa template, pilih opsi “Blank Diagram”. Namun apabila ingin menggunakan template yang sudah disediakan maka kita bisa memilih template diagram apa yang ingin kita buat

AD_4nXdErp8MtKoA-mVDssGV1eAc2C-yMTApIyjCrW_pKGRVn-sTBdHrf11-Ks8RnzmsWy6DwF7rkl8dC3Uyh0b1BtKP0JODkJ4Xd-KS5tv67VvHgxfvfvEfjp8CIEKzupzobodC3EL6aA?key=a_p7dUYvZT6P6z5EhHV9VE_7

3.masukan nama file

Contoh nya : use case kasir

Lalu klik "create". Setelah itu kita akan diarahkan pada halaman lembar kerja

AD_4nXekQGj2BP9lkoJF7PgRxmyjB23mHVzgGj7YnrTx-AMEQN4Ixe5aMiNIjNbS0YqfLjx1xIG3eRcSC9ZpK_GckvaZuXWHz9zQISsOffs6p1BKlG5JDJceJ2TjNWsEaIl5i-wIdvjEyA?key=a_p7dUYvZT6P6z5EhHV9VE_7

 

4.pilih menu UML

Terdapat sidebar di sebelah kiri lembar kerja yang sudah menyediakan berbagai macam alat yang dapat digunakan. Kita dapat mencari fitur UML dengan melakukan scroll ke bagian bawah dari sidebar tersebut.

AD_4nXdpjs7QEVtCo1qkTBmvQ16WaDwpBebJbjt_g-keR9gHEbUJrsgkTHItGDyL2mN-c2EESg3tEVzBG2blehGd6-r5Q9ymW_8TS7Blw-HSiN1pjhlyRalf7yUmjD0QLQ5vy4Qh-KQ3fA?key=a_p7dUYvZT6P6z5EhHV9VE_7

5.pilih komponen yang akan digunakan

Didalam menu UML terdapat berbagai macam alat yang disediakan mulai dari garis asosiasi, actor, dan use case. Dengan menggunakan alat yang sudah disediakan maka kita dapat membuat use case diagram menjadi lebih mudah.

6.simpan projek

klik "file" yang berada di pojok kiri pada bagian atas halaman utama. Lalu pilih “save as” dan terdapat pilihan projek yang sudah dibuat mau disimpan dimana serta tipe dari proyek yang sudah kita buat mau berbentuk apa.

AD_4nXcaiHD1SvvnGT7BiPyXpLVGJHnMc_Tk28TAymufVrz1nJ1acIVgO64ufD_OtFIcEZ8QDEgVvEcLgqye6KSVpthgEmJqDOnBBgDZIyRDd7rSCShguYX-8FzMPlGl-vZvNBF0bgl50A?key=a_p7dUYvZT6P6z5EhHV9VE_7

 

Terdapat pilihan tempat menyimpan projek

AD_4nXeMHYT51l0f9PJiAQOcUBHnlVWS78U939F8ZzmjwaVKk4grS3dyBeRoqYxVBVinbnQgkGToacPruuXmcp_yEqH7hf0DT6NzEz88i3tsYq5WvYSjOr_VsmMjbsf3X0x3Lt_34SDcWw?key=a_p7dUYvZT6P6z5EhHV9VE_7

 

Jika ingin mengedit tampilan diagram yang kita buat, Draw.io sudah menyediakan menu disebelah kanan lembar kerja. Di Dalam menu tersebut ada berbagai macam alat yang dapat digunakan. Mulai dari pewarnaan font, ketebalan tulisan, kemiringan tulisan (italic), opacity untuk diagram dan ketebalan garis tepi diagram.

 

Kesimpulan

Draw.io merupakan aplikasi pembuat diagram secara online yang dapat digunakan untuk membuat use case. Banyak sekali fitur yang terdapat didalamnya dan berbagai alat yang dapat digunakan. Jika tidak ingin membuat diagram secara online, Draw.io sudah menyediakan template yang dapat digunakan secara gratis.

About The Author

Salma Anindita 9
Novice

Salma Anindita

Hamba Allah
Plimbi adalah tempat menulis untuk semua orang.
Yuk kirim juga tulisanmu sekarang
Submit Artikel