{"id":12288,"date":"2026-10-13T16:56:52","date_gmt":"2026-10-13T08:56:52","guid":{"rendered":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/"},"modified":"2026-10-14T13:08:21","modified_gmt":"2026-10-14T05:08:21","slug":"uml-use-case-diagrams-as-code-with-plantuml-and-vpascode","status":"publish","type":"post","link":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/","title":{"rendered":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode"},"content":{"rendered":"<p data-nodeid=\"17103\">Diagram use case UML menunjukkan apa yang ditawarkan oleh suatu sistem dan siapa\u2014atau apa\u2014yang berinteraksi dengannya. Dengan alur kerja diagram-sebagai-kode, sumber diagram adalah teks biasa: edit teksnya, render diagramnya, dan simpan sumbernya bersama dokumentasi proyek.<\/p>\n<p><img alt=\"Diagram yang menunjukkan alur kerja PlantUML: mengedit kode sumber, merender diagram kasus penggunaan UML untuk toko online, dan mendokumentasikan keduanya secara berdampingan menggunakan VPasCode.\" class=\"alignnone size-full wp-image-21958\" decoding=\"async\" height=\"1024\" loading=\"lazy\" sizes=\"auto, (max-width: 1536px) 100vw, 1536px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c.png 1536w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c-300x200.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c-1024x683.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c-768x512.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdef429169c-120x80.png 120w\" width=\"1536\"\/><\/p>\n<p data-nodeid=\"17104\">PlantUML mendukung diagram use case. Editor VPasCode dari Visual Paradigm menyediakan editor dan pratinjau PlantUML, bersama dengan fitur pembuatan dan pengeditan diagram yang dibantu oleh AI.<\/p>\n<h2 data-nodeid=\"17105\">1. Apa yang dikomunikasikan oleh diagram use case<\/h2>\n<p data-nodeid=\"17106\">Diagram use case berfokus pada <strong data-nodeid=\"17215\">ruang lingkup sistem dan tujuan pengguna<\/strong>, bukan mekanisme langkah demi langkah dari suatu alur kerja. Sebuah diagram biasanya berisi:<\/p>\n<p><img alt=\"Referensi notasi Diagram Kasus Penggunaan UML yang menampilkan batas sistem, aktor, kasus penggunaan, asosiasi, dan hubungan seperti include, extend, dan generalisasi.\" class=\"alignnone size-full wp-image-21961\" decoding=\"async\" height=\"941\" loading=\"lazy\" sizes=\"auto, (max-width: 1672px) 100vw, 1672px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c.png 1672w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c-300x169.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c-1024x576.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c-768x432.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefa080b6c-1536x864.png 1536w\" width=\"1672\"\/><\/p>\n<ul data-nodeid=\"17107\">\n<li data-nodeid=\"17108\">\n<p data-nodeid=\"17109\"><strong data-nodeid=\"17220\">Batas sistem:<\/strong>Sebuah persegi panjang yang menamai sistem yang dimodelkan.<\/p>\n<\/li>\n<li data-nodeid=\"17110\">\n<p data-nodeid=\"17111\"><strong data-nodeid=\"17225\">Aktor:<\/strong>Sebuah peran di luar sistem yang berinteraksi dengannya. Aktor dapat berupa orang, organisasi, perangkat, atau sistem eksternal.<\/p>\n<\/li>\n<li data-nodeid=\"17112\">\n<p data-nodeid=\"17113\"><strong data-nodeid=\"17230\">Use case:<\/strong>Sebuah kemampuan atau tujuan yang disediakan oleh sistem, biasanya ditampilkan sebagai oval dan diberi nama dengan frasa kata kerja, seperti \u201cTempatkan pesanan.\u201d<\/p>\n<\/li>\n<li data-nodeid=\"17114\">\n<p data-nodeid=\"17115\"><strong data-nodeid=\"17235\">Asosiasi:<\/strong>Sebuah garis yang menunjukkan bahwa seorang aktor berpartisipasi dalam sebuah use case.<\/p>\n<\/li>\n<li data-nodeid=\"17116\">\n<p data-nodeid=\"17117\"><strong data-nodeid=\"17240\">Hubungan use case:<\/strong>Include, extend, dan generalisasi.<\/p>\n<\/li>\n<\/ul>\n<p data-nodeid=\"17118\">Aktor mewakili peran, bukan individu tertentu. Layanan pembayaran eksternal dapat menjadi aktor jika berinteraksi dengan sistem yang dimodelkan.<\/p>\n<p data-nodeid=\"17119\">Diagram use case berguna untuk memperjelas ruang lingkup sistem, mendiskusikan persyaratan dengan pemangku kepentingan, mengidentifikasi ketergantungan eksternal, dan memberikan tinjauan bersama untuk pengembangan dan pengujian. Padukan diagram ini dengan deskripsi use case tertulis ketika Anda memerlukan detail seperti prasyarat, langkah utama, alur alternatif, dan hasil.<\/p>\n<h2 data-nodeid=\"17120\">2. Hubungan sekilas<\/h2>\n<p><img alt=\"Diagram Hubungan Kasus Penggunaan UML yang mengilustrasikan Asosiasi, Include, Extend, dan Generalisasi dengan contoh dan panah berarah.\" class=\"alignnone size-full wp-image-21963\" decoding=\"async\" height=\"941\" loading=\"lazy\" sizes=\"auto, (max-width: 1672px) 100vw, 1672px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378.png 1672w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378-300x169.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378-1024x576.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378-768x432.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdefdedc378-1536x864.png 1536w\" width=\"1672\"\/><\/p>\n<ul data-nodeid=\"17121\">\n<li data-nodeid=\"17122\">\n<p data-nodeid=\"17123\"><strong data-nodeid=\"17248\">Asosiasi aktor\u2013use case:<\/strong>Sebuah garis polos yang menunjukkan interaksi.<\/p>\n<\/li>\n<li data-nodeid=\"17124\">\n<p data-nodeid=\"17125\"><strong data-nodeid=\"17258\"><code data-backticks=\"1\" data-nodeid=\"17250\">&lt;&lt;include&gt;&gt;<\/code>:<\/strong>Use case yang mencakup selalu menggunakan perilaku yang dicakup. Panah putus-putus menunjuk <strong data-nodeid=\"17259\">dari use case yang mencakup ke use case yang dicakup<\/strong>. Sebagai contoh, penempatan pesanan mungkin selalu mencakup otorisasi pembayaran.<\/p>\n<\/li>\n<li data-nodeid=\"17126\">\n<p data-nodeid=\"17127\"><strong data-nodeid=\"17269\"><code data-backticks=\"1\" data-nodeid=\"17261\">&lt;&lt;extend&gt;&gt;<\/code>:<\/strong>Use case yang memperluas menambahkan perilaku ke use case dasar di bawah suatu kondisi. Panah putus-putus menunjuk <strong data-nodeid=\"17270\">dari use case yang memperluas ke use case dasar<\/strong>. Sebagai contoh, penerapan promosi dapat memperluas proses pemesanan.<\/p>\n<\/li>\n<li data-nodeid=\"17128\">\n<p data-nodeid=\"17129\"><strong data-nodeid=\"17279\">Generalisasi:<\/strong> Aktor atau use case yang terspesialisasi mewarisi dari yang lebih umum. Garis solid dengan segitiga kosong mengarah <strong data-nodeid=\"17280\">ke elemen yang lebih umum<\/strong>.<\/p>\n<\/li>\n<\/ul>\n<p data-nodeid=\"17130\">Pembedaan yang berguna: <strong data-nodeid=\"17285\">include berarti perilaku yang wajib; extend berarti perilaku tambahan bersyarat.<\/strong><\/p>\n<h2 data-nodeid=\"17131\">3. Dasar-dasar PlantUML<\/h2>\n<p data-nodeid=\"17132\">Diagram PlantUML dimulai dengan <code data-backticks=\"1\" data-nodeid=\"17288\">@startuml<\/code> dan diakhiri dengan <code data-backticks=\"1\" data-nodeid=\"17290\">@enduml<\/code>. Deklarasikan aktor dengan <code data-backticks=\"1\" data-nodeid=\"17292\">actor<\/code>, use case dengan <code data-backticks=\"1\" data-nodeid=\"17294\">usecase<\/code>, dan batas sistem dengan <code data-backticks=\"1\" data-nodeid=\"17296\">rectangle<\/code>. Alias membuat elemen lebih mudah dirujuk dalam relasi.<\/p>\n<p id=\"AIPemRZ\"><img alt=\"Antarmuka VPasCode menampilkan kode PlantUML untuk diagram kasus penggunaan toko online beserta output yang dirender yang menunjukkan pelanggan berinteraksi dengan batas sistem.\" class=\"alignnone size-full wp-image-21965\" decoding=\"async\" height=\"873\" loading=\"lazy\" sizes=\"auto, (max-width: 1913px) 100vw, 1913px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb.png 1913w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb-300x137.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb-1024x467.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb-768x350.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf00e119eb-1536x701.png 1536w\" width=\"1913\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOzB2iCm34Jt1jzXy3vNAA4zG0izWR7LrE1OHPRfekJkTT8FP2Nqveb1OrKlskPiJQQRGXcIfhiY9g6WYOirrlYWB3YrgZoJh6GDVPaomPrBJeLmxGevlAm1MgNWQy-Emiy-7yAn1QqElkB3Tjeb-q1WYIIRiktMB6lJhnN3SFZVxk3N7gd4_iWR\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOzB2iCm34Jt1jzXy3vNAA4zG0izWR7LrE1OHPRfekJkTT8FP2Nqveb1OrKlskPiJQQRGXcIfhiY9g6WYOirrlYWB3YrgZoJh6GDVPaomPrBJeLmxGevlAm1MgNWQy-Emiy-7yAn1QqElkB3Tjeb-q1WYIIRiktMB6lJhnN3SFZVxk3N7gd4_iWR\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">PlantUML<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOz12i8m44NtXTxXatsl84LtRdJH2mpfO6FIfCmak13lRY8gT3EB_z_dCQDcabpMq7Saj60cSV2k7OQdIB7lQcLp4foAvhIoj4JOPegtm31JyWcN65naWsVV0KNPajRgp87kj3XiakRY3KXnbFHGtc4Jhni7RAnD-A6kWMo5Nitrys8O3l_vBlpI8yUvll86\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-plantuml\" data-nodeid=\"17133\"><code class=\"language-plantuml\" data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\narah dari kiri ke kanan\r\n\r\nactor Customer\r\n\r\nrectangle \"Toko Online\" {\r\n  usecase \"Jelajahi produk\" as Browse\r\n  usecase \"Tempel pesanan\" as Place\r\n}\r\n\r\nCustomer --&gt; Browse\r\nCustomer --&gt; Place\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOz12i8m44NtXTxXatsl84LtRdJH2mpfO6FIfCmak13lRY8gT3EB_z_dCQDcabpMq7Saj60cSV2k7OQdIB7lQcLp4foAvhIoj4JOPegtm31JyWcN65naWsVV0KNPajRgp87kj3XiakRY3KXnbFHGtc4Jhni7RAnD-A6kWMo5Nitrys8O3l_vBlpI8yUvll86\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOzB2iCm34Jt1jzXy3vNAA4zG0izWR7LrE1OHPRfekJkTT8FP2Nqveb1OrKlskPiJQQRGXcIfhiY9g6WYOirrlYWB3YrgZoJh6GDVPaomPrBJeLmxGevlAm1MgNWQy-Emiy-7yAn1QqElkB3Tjeb-q1WYIIRiktMB6lJhnN3SFZVxk3N7gd4_iWR\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LOzB2iCm34Jt1jzXy3vNAA4zG0izWR7LrE1OHPRfekJkTT8FP2Nqveb1OrKlskPiJQQRGXcIfhiY9g6WYOirrlYWB3YrgZoJh6GDVPaomPrBJeLmxGevlAm1MgNWQy-Emiy-7yAn1QqElkB3Tjeb-q1WYIIRiktMB6lJhnN3SFZVxk3N7gd4_iWR\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p data-nodeid=\"17134\"><code data-backticks=\"1\" data-nodeid=\"17298\">arah dari kiri ke kanan<\/code>meminta PlantUML untuk menyusun diagram secara horizontal. PlantUML dapat menyesuaikan tata letak yang tepat saat diagram berubah.<\/p>\n<h2 data-nodeid=\"17135\">4. Contoh: toko online dasar<\/h2>\n<p id=\"ytNqnVg\"><img alt=\"Antarmuka VPasCode menampilkan diagram kasus penggunaan UML di mana aktor Pelanggan berinteraksi dengan kasus penggunaan Place order, Apply promotion, dan Authorize payment.\" class=\"alignnone size-full wp-image-21966\" decoding=\"async\" height=\"875\" loading=\"lazy\" sizes=\"auto, (max-width: 1918px) 100vw, 1918px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb.png 1918w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb-300x137.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb-1024x467.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb-768x350.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf056598cb-1536x701.png 1536w\" width=\"1918\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1D3i8W44Rt9DnXqdslOAgkZIPwWGcCBP52CqpZmdXt2srDM97lyPWVkYJ8CezUAqzF0Od0hXy4h6CoucBGIYiq4XdESv8u4k_vQ4SNN1B6d32j8FlvAORU4pJNu5qWk2yADV3H2c1EP30jToUEx-MSEDhPI6foZPLLsisZ8OXiYOjIScKy6CqBqk2caO8KgQ1Akc30di2We8zzaLQarJSFlQy7RNluZr71hN75jZvbzGBscXq5k_ph3m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1D3i8W44Rt9DnXqdslOAgkZIPwWGcCBP52CqpZmdXt2srDM97lyPWVkYJ8CezUAqzF0Od0hXy4h6CoucBGIYiq4XdESv8u4k_vQ4SNN1B6d32j8FlvAORU4pJNu5qWk2yADV3H2c1EP30jToUEx-MSEDhPI6foZPLLsisZ8OXiYOjIScKy6CqBqk2caO8KgQ1Akc30di2We8zzaLQarJSFlQy7RNluZr71hN75jZvbzGBscXq5k_ph3m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">PlantUML<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1DRi8m48NtaNA7KVPSeO8k2wWiSe7NP6JSSUp8TiIYukwC-Gdrqf-UtyziKqRCo-JQ1X5d4Xij2PF0mxUDKiaXqeaTl345FS1kdAotAKUKL-8V6DW7BRyaP0XrVP10tzvPpntzjGtHadX0Okg-rF4NPqjp3ECYtUhn6SCbSQNjUPgHjHBDd4gnj_haCDJY0mQDdjaRdJBzr_OHWrJQFRlWe6CpN31lvL53ZDfUovPrEsqs7skzcZvhrF2PTp_A7Rnij-n7FVaD\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-plantuml\" data-nodeid=\"17136\"><code class=\"language-plantuml\" data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\narah kiri ke kanan\r\n\r\naktor Pelanggan\r\naktor Administrator sebagai Admin\r\n\r\nkotak \"Toko Online\" {\r\n  usecase \"Jelajahi produk\" sebagai Browse\r\n  usecase \"Tempatkan pesanan\" sebagai Place\r\n  usecase \"Lacak pengiriman\" sebagai Track\r\n  usecase \"Kelola katalog\" sebagai Manage\r\n}\r\n\r\nPelanggan --&gt; Browse\r\nPelanggan --&gt; Place\r\nPelanggan --&gt; Track\r\nAdmin --&gt; Manage\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1DRi8m48NtaNA7KVPSeO8k2wWiSe7NP6JSSUp8TiIYukwC-Gdrqf-UtyziKqRCo-JQ1X5d4Xij2PF0mxUDKiaXqeaTl345FS1kdAotAKUKL-8V6DW7BRyaP0XrVP10tzvPpntzjGtHadX0Okg-rF4NPqjp3ECYtUhn6SCbSQNjUPgHjHBDd4gnj_haCDJY0mQDdjaRdJBzr_OHWrJQFRlWe6CpN31lvL53ZDfUovPrEsqs7skzcZvhrF2PTp_A7Rnij-n7FVaD\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1D3i8W44Rt9DnXqdslOAgkZIPwWGcCBP52CqpZmdXt2srDM97lyPWVkYJ8CezUAqzF0Od0hXy4h6CoucBGIYiq4XdESv8u4k_vQ4SNN1B6d32j8FlvAORU4pJNu5qWk2yADV3H2c1EP30jToUEx-MSEDhPI6foZPLLsisZ8OXiYOjIScKy6CqBqk2caO8KgQ1Akc30di2We8zzaLQarJSFlQy7RNluZr71hN75jZvbzGBscXq5k_ph3m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP1D3i8W44Rt9DnXqdslOAgkZIPwWGcCBP52CqpZmdXt2srDM97lyPWVkYJ8CezUAqzF0Od0hXy4h6CoucBGIYiq4XdESv8u4k_vQ4SNN1B6d32j8FlvAORU4pJNu5qWk2yADV3H2c1EP30jToUEx-MSEDhPI6foZPLLsisZ8OXiYOjIScKy6CqBqk2caO8KgQ1Akc30di2We8zzaLQarJSFlQy7RNluZr71hN75jZvbzGBscXq5k_ph3m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p data-nodeid=\"17137\">Pelanggan menjelajahi, memesan, dan melacak pengiriman. Administrator mengelola katalog. Diagram ini sengaja mengabaikan langkah-langkah internal pemrosesan pesanan.<\/p>\n<h2 data-nodeid=\"17138\">5. Contoh: include dan extend<\/h2>\n<p data-nodeid=\"17139\">Misalkan penempatan pesanan selalu memerlukan otorisasi pembayaran, sementara penerapan promosi bersifat opsional dan bersyarat.<\/p>\n<p id=\"UedRVgx\"><img alt='Antarmuka VPasCode menampilkan kode PlantUML dan diagram UML yang dihasilkan yang menunjukkan kasus penggunaan \"Place order\" yang mencakup \"Authorize payment\" dan memperluas \"Apply promotion.\"' class=\"alignnone size-full wp-image-21967\" decoding=\"async\" height=\"870\" loading=\"lazy\" sizes=\"auto, (max-width: 1913px) 100vw, 1913px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4.png 1913w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4-300x136.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4-1024x466.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4-768x349.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf07b911d4-1536x699.png 1536w\" width=\"1913\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LT1H2W8X40RWTy4x_Enx7I1YAJf0GISGToh1rMKSeIswUvhuq9EEyp7puo69OScpryhJJI0HxEuFmUIOhBWOjDBAM8cCKquIP-BwKfict3rXE0Vl0k5Q20ruQmNaHDQaqhjuOmcH9-819k5N_ubZbaTazo8iPfqfI7Fj_Y-NnQzOECwnvcgkLrfzQgmU4PlDs9TfrL9ijsEVYntsUnUipnEDOm5zJ4C_NWazXS9KnQ6SvPU-\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LT1H2W8X40RWTy4x_Enx7I1YAJf0GISGToh1rMKSeIswUvhuq9EEyp7puo69OScpryhJJI0HxEuFmUIOhBWOjDBAM8cCKquIP-BwKfict3rXE0Vl0k5Q20ruQmNaHDQaqhjuOmcH9-819k5N_ubZbaTazo8iPfqfI7Fj_Y-NnQzOECwnvcgkLrfzQgmU4PlDs9TfrL9ijsEVYntsUnUipnEDOm5zJ4C_NWazXS9KnQ6SvPU-\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">PlantUML<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:NP1D2eD034RtWdS8xlK0HSGRwA8NY1fic3-P6Q5IUlTc58ljAiCtZvUFj26YZwlHUOOU7w3OCoW2XHPjdacgelFGaqOxpqUaN4G5nTqf1vtLRAc0Lvu1h85632HVP1QCue25GZ8L46Z06HbwZIFzm9qiu8211JO3RjBZokDcoCO_lSTbjtjdNE0BdOB8Jdg-KzLlRoZBvjmjSNf0LJMd7cvGrsn7lKxKD0ASdWFQyOJGCvAT4j7AbBDz0000\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-plantuml\" data-nodeid=\"17140\"><code class=\"language-plantuml\" data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\narah kiri ke kanan\r\n\r\naktor Pelanggan\r\n\r\nkotak \"Toko Online\" {\r\n  usecase \"Tempatkan pesanan\" sebagai Place\r\n  usecase \"Otorisasi pembayaran\" sebagai Payment\r\n  usecase \"Terapkan promosi\" sebagai Promotion\r\n}\r\n\r\nPelanggan --&gt; Place\r\n\r\nPlace ..&gt; Payment : &lt;&lt;include&gt;&gt;\r\nPromotion ..&gt; Place : &lt;&lt;extend&gt;&gt;\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:NP1D2eD034RtWdS8xlK0HSGRwA8NY1fic3-P6Q5IUlTc58ljAiCtZvUFj26YZwlHUOOU7w3OCoW2XHPjdacgelFGaqOxpqUaN4G5nTqf1vtLRAc0Lvu1h85632HVP1QCue25GZ8L46Z06HbwZIFzm9qiu8211JO3RjBZokDcoCO_lSTbjtjdNE0BdOB8Jdg-KzLlRoZBvjmjSNf0LJMd7cvGrsn7lKxKD0ASdWFQyOJGCvAT4j7AbBDz0000\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LT1H2W8X40RWTy4x_Enx7I1YAJf0GISGToh1rMKSeIswUvhuq9EEyp7puo69OScpryhJJI0HxEuFmUIOhBWOjDBAM8cCKquIP-BwKfict3rXE0Vl0k5Q20ruQmNaHDQaqhjuOmcH9-819k5N_ubZbaTazo8iPfqfI7Fj_Y-NnQzOECwnvcgkLrfzQgmU4PlDs9TfrL9ijsEVYntsUnUipnEDOm5zJ4C_NWazXS9KnQ6SvPU-\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LT1H2W8X40RWTy4x_Enx7I1YAJf0GISGToh1rMKSeIswUvhuq9EEyp7puo69OScpryhJJI0HxEuFmUIOhBWOjDBAM8cCKquIP-BwKfict3rXE0Vl0k5Q20ruQmNaHDQaqhjuOmcH9-819k5N_ubZbaTazo8iPfqfI7Fj_Y-NnQzOECwnvcgkLrfzQgmU4PlDs9TfrL9ijsEVYntsUnUipnEDOm5zJ4C_NWazXS9KnQ6SvPU-\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p data-nodeid=\"17141\">Panah <code data-backticks=\"1\" data-nodeid=\"17305\">Place ..&gt; Payment<\/code> berarti bahwa &#8220;Tempatkan pesanan&#8221; mencakup perilaku pembayaran yang diperlukan. Panah <code data-backticks=\"1\" data-nodeid=\"17307\">Promotion ..&gt; Place<\/code> berarti bahwa &#8220;Terapkan promosi&#8221; memperluas &#8220;Tempatkan pesanan&#8221; ketika kondisinya terpenuhi.<\/p>\n<p data-nodeid=\"17142\">Dokumentasikan kondisinya\u2014misalnya, &#8220;pelanggan memasukkan kode promosi yang valid&#8221;\u2014dalam deskripsi use case atau catatan.<\/p>\n<h2 data-nodeid=\"17143\">6. Contoh: generalisasi aktor dan sistem eksternal<\/h2>\n<p data-nodeid=\"17144\">Aktor khusus mewarisi interaksi dari aktor yang lebih umum. Layanan eksternal juga dapat menjadi aktor ketika berinteraksi dengan sistem.<\/p>\n<p id=\"RxUdJmF\"><img alt=\"Antarmuka VPasCode menampilkan kode PlantUML dan diagram UML yang dihasilkan yang menunjukkan Pelanggan Terdaftar yang melakukan generalisasi terhadap User dan Gateway Pembayaran yang berinteraksi dengan Toko Online.\" class=\"alignnone size-full wp-image-21968\" decoding=\"async\" height=\"872\" loading=\"lazy\" sizes=\"auto, (max-width: 1917px) 100vw, 1917px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59.png 1917w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59-300x136.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59-1024x466.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59-768x349.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf09ff1d59-1536x699.png 1536w\" width=\"1917\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP31QWCX48RlWkymx3rvW18aj8SU6rBw0ABJhU1gc1a9eUsxLrUpD2V7yVEVJuyibgGiKQk8dmAIWSBy9U03ePEGarPQMIUPOFfWf0aiGoksxXddm8A47bnXoSk0NiPc0q_sjc0IcAtWrTvMwBNNRSYTXztknumHMZKBc-Q8CBsb61B2Umt32Rwr0YYCpd8zUwPyhUk5iYzEUCtklGVi5Ar3oEI7uxf_92WxP8PBb-rK4_njDisg-faj-v-qkQVr8VkzQHVX2Gw7a5mi7etHQZouyottYCdN__y3\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP31QWCX48RlWkymx3rvW18aj8SU6rBw0ABJhU1gc1a9eUsxLrUpD2V7yVEVJuyibgGiKQk8dmAIWSBy9U03ePEGarPQMIUPOFfWf0aiGoksxXddm8A47bnXoSk0NiPc0q_sjc0IcAtWrTvMwBNNRSYTXztknumHMZKBc-Q8CBsb61B2Umt32Rwr0YYCpd8zUwPyhUk5iYzEUCtklGVi5Ar3oEI7uxf_92WxP8PBb-rK4_njDisg-faj-v-qkQVr8VkzQHVX2Gw7a5mi7etHQZouyottYCdN__y3\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">PlantUML<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP51RiCW44NtIDnXn3uvG1MXg5r4wgPUf0SOsrE7OW_M08gYjdSlj4djI5qXmUF_Dx2F2INbQTGA1K_WdJZm11uPMQkowrCGC0tnC6H60v5Q7D31QoHP7OzO06H893s-bT25VCenXMb57qZQWiDCKukNqiiBVC14PxpKwjizs6m-xRLFAnyIUZ37u0EyyEYO37ne1P0ZTHW9p7EHUSUJWrb2d_sI_IZX7EcEFT8qOohJ5fbOPrxePiJk7cuaH8h_QZTL-QlwLSzYRF_QLcFOM-ZF0jkjhHVX0NOxnzsOUx9Mg-iJ_F8rTq_Sbo_w1W00\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-plantuml\" data-nodeid=\"17145\"><code class=\"language-plantuml\" data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\narah kiri ke kanan\r\n\r\naktor \"Pengguna\" sebagai User\r\naktor \"Pelanggan terdaftar\" sebagai Customer\r\naktor \"Gerbang pembayaran\" sebagai Gateway\r\n\r\nCustomer --|&gt; User\r\n\r\nkotak \"Toko Online\" {\r\n  usecase \"Jelajahi produk\" sebagai Browse\r\n  usecase \"Tempatkan pesanan\" sebagai Place\r\n  usecase \"Proses pembayaran\" sebagai Pay\r\n}\r\n\r\nUser --&gt; Browse\r\nCustomer --&gt; Place\r\nPlace ..&gt; Pay : &lt;&lt;include&gt;&gt;\r\nGateway --&gt; Pay\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP51RiCW44NtIDnXn3uvG1MXg5r4wgPUf0SOsrE7OW_M08gYjdSlj4djI5qXmUF_Dx2F2INbQTGA1K_WdJZm11uPMQkowrCGC0tnC6H60v5Q7D31QoHP7OzO06H893s-bT25VCenXMb57qZQWiDCKukNqiiBVC14PxpKwjizs6m-xRLFAnyIUZ37u0EyyEYO37ne1P0ZTHW9p7EHUSUJWrb2d_sI_IZX7EcEFT8qOohJ5fbOPrxePiJk7cuaH8h_QZTL-QlwLSzYRF_QLcFOM-ZF0jkjhHVX0NOxnzsOUx9Mg-iJ_F8rTq_Sbo_w1W00\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP31QWCX48RlWkymx3rvW18aj8SU6rBw0ABJhU1gc1a9eUsxLrUpD2V7yVEVJuyibgGiKQk8dmAIWSBy9U03ePEGarPQMIUPOFfWf0aiGoksxXddm8A47bnXoSk0NiPc0q_sjc0IcAtWrTvMwBNNRSYTXztknumHMZKBc-Q8CBsb61B2Umt32Rwr0YYCpd8zUwPyhUk5iYzEUCtklGVi5Ar3oEI7uxf_92WxP8PBb-rK4_njDisg-faj-v-qkQVr8VkzQHVX2Gw7a5mi7etHQZouyottYCdN__y3\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:LP31QWCX48RlWkymx3rvW18aj8SU6rBw0ABJhU1gc1a9eUsxLrUpD2V7yVEVJuyibgGiKQk8dmAIWSBy9U03ePEGarPQMIUPOFfWf0aiGoksxXddm8A47bnXoSk0NiPc0q_sjc0IcAtWrTvMwBNNRSYTXztknumHMZKBc-Q8CBsb61B2Umt32Rwr0YYCpd8zUwPyhUk5iYzEUCtklGVi5Ar3oEI7uxf_92WxP8PBb-rK4_njDisg-faj-v-qkQVr8VkzQHVX2Gw7a5mi7etHQZouyottYCdN__y3\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p data-nodeid=\"17146\">\u201cPelanggan terdaftar\u201d mengkhususkan \u201cPengguna\u201d dan mewarisi interaksi pengguna umum. Gerbang pembayaran berada di luar batas Toko Online tetapi berpartisipasi dalam kasus penggunaan pembayaran.<\/p>\n<h2 data-nodeid=\"17147\">7. Contoh: generalisasi kasus penggunaan<\/h2>\n<p data-nodeid=\"17148\">Generalisasi dapat mewakili versi khusus dari kasus penggunaan yang lebih luas. Segitiga kosong mengarah ke kasus penggunaan umum.<\/p>\n<p id=\"mCUPRYk\"><img alt=\"Antarmuka VPasCode menampilkan kode PlantUML dan diagram UML yang dihasilkan yang menunjukkan aktor Pelanggan dengan panah generalisasi yang mengarah ke kasus penggunaan Make payment.\" class=\"alignnone size-full wp-image-21969\" decoding=\"async\" height=\"876\" loading=\"lazy\" sizes=\"auto, (max-width: 1919px) 100vw, 1919px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091.png 1919w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091-300x137.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091-1024x467.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091-768x351.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf0bcc5091-1536x701.png 1536w\" width=\"1919\"\/><\/p>\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP112eCm44NtWTpXuzuhIC5reT1UO8oZ5KrIad4XRU_UQ1MnT9UyzmYVdA9GaD4EMWtS2CGZTErTK7U1ZNJUQQKL6V41vHZ5MmupcIMvTc1a5veiEy5rYi8smrChO8niA2Pxffxn-2OPA6BD3r5Yg2OO2lNIbEdmBwZ8zP10BZOSblAsNhHwpxEsYSZpOdtbWFOyYQGJV1Nxf4t_u1ExEdtH1m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n<div class=\"vpascode-viewer-container vpascode-fancy-active\">\n<div class=\"vpascode-header\">\n<span class=\"vpascode-lang-label\">PlantUML<\/span><br \/>\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP112eCm44NtWTpXuzuhIC5reT1UO8oZ5KrIad4XRU_UQ1MnT9UyzmYVdA9GaD4EMWtS2CGZTErTK7U1ZNJUQQKL6V41vHZ5MmupcIMvTc1a5veiEy5rYi8smrChO8niA2Pxffxn-2OPA6BD3r5Yg2OO2lNIbEdmBwZ8zP10BZOSblAsNhHwpxEsYSZpOdtbWFOyYQGJV1Nxf4t_u1ExEdtH1m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 8px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<div class=\"vpascode-code-wrapper\">\n            <div class=\"vpascode-viewer-container vpascode-fancy-active\">\r\n                                <div class=\"vpascode-header\">\r\n                    <span class=\"vpascode-lang-label\">PlantUML<\/span>\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:TP0n3i8m34NtIBc3rRrNg10h2n9SmAKcXBIcYjC10NV70KfR8PP8UVz_vpihIHZJqBNMOCGJD1Wz19yFWe2CR8rA8LqYRAb5TkwDUef2paEFV5OAnSvBeavDNOrNdSK5tAm168GEA0J5Ui04_KmMgj6XdqMM_ioW8TONjOgsd2ARVFtlJZfBZXIXHWvJQl_1rZpo2jzze2ohSUGIJWbhNWQbzshHUBJyAYlYHd_s2G00\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 8px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n                                <div class=\"vpascode-code-wrapper\">\r\n                    <pre class=\"lang-plantuml\" data-nodeid=\"17149\"><code class=\"language-plantuml\" data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\narah dari kiri ke kanan\r\n\r\naktor Pelanggan\r\n\r\npersegi panjang \"Sistem Pembayaran\" {\r\n  usecase \"Buat pembayaran\" sebagai Pembayaran\r\n  usecase \"Bayar dengan kartu\" sebagai Kartu\r\n  usecase \"Bayar dengan transfer bank\" sebagai Transfer\r\n}\r\n\r\nPelanggan --&gt; Kartu\r\nPelanggan --&gt; Transfer\r\n\r\nKartu --|&gt; Pembayaran\r\nTransfer --|&gt; Pembayaran\r\n@enduml\r\n<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:TP0n3i8m34NtIBc3rRrNg10h2n9SmAKcXBIcYjC10NV70KfR8PP8UVz_vpihIHZJqBNMOCGJD1Wz19yFWe2CR8rA8LqYRAb5TkwDUef2paEFV5OAnSvBeavDNOrNdSK5tAm168GEA0J5Ui04_KmMgj6XdqMM_ioW8TONjOgsd2ARVFtlJZfBZXIXHWvJQl_1rZpo2jzze2ohSUGIJWbhNWQbzshHUBJyAYlYHd_s2G00\" \r\n                       target=\"_blank\" \r\n                       rel=\"noopener noreferrer\" \r\n                       class=\"vpascode-fancy-btn\">\r\n                        <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"margin-right: 6px;\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg>\r\n                        <span>Edit PlantUML in VPasCode<\/span>\r\n                    <\/a>\r\n                <\/div>\r\n            <\/div>\r\n            \n<\/p><\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP112eCm44NtWTpXuzuhIC5reT1UO8oZ5KrIad4XRU_UQ1MnT9UyzmYVdA9GaD4EMWtS2CGZTErTK7U1ZNJUQQKL6V41vHZ5MmupcIMvTc1a5veiEy5rYi8smrChO8niA2Pxffxn-2OPA6BD3r5Yg2OO2lNIbEdmBwZ8zP10BZOSblAsNhHwpxEsYSZpOdtbWFOyYQGJV1Nxf4t_u1ExEdtH1m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"vpascode-actions\">\n<a class=\"vpascode-fancy-btn\" href=\"https:\/\/www.vpascode.com\/editor\/#plantuml:RP112eCm44NtWTpXuzuhIC5reT1UO8oZ5KrIad4XRU_UQ1MnT9UyzmYVdA9GaD4EMWtS2CGZTErTK7U1ZNJUQQKL6V41vHZ5MmupcIMvTc1a5veiEy5rYi8smrChO8niA2Pxffxn-2OPA6BD3r5Yg2OO2lNIbEdmBwZ8zP10BZOSblAsNhHwpxEsYSZpOdtbWFOyYQGJV1Nxf4t_u1ExEdtH1m00\" rel=\"noopener noreferrer\" target=\"_blank\"><br \/>\n<svg fill=\"none\" height=\"14\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" style=\"margin-right: 6px;\" viewbox=\"0 0 24 24\" width=\"14\"><path d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"><\/path><path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\"><\/path><\/svg><br \/>\n<span>Edit PlantUML di VPasCode<\/span><br \/>\n<\/a>\n<\/div>\n<\/div>\n<p data-nodeid=\"17150\">Gunakan ini ketika kasus penggunaan khusus berbagi tujuan umum tetapi memiliki perbedaan yang bermakna. Jika variasi hanyalah langkah bersyarat, sebuah <code data-backticks=\"1\" data-nodeid=\"17316\">&lt;&lt;extend&gt;&gt;<\/code> relasi atau deskripsi kasus penggunaan tertulis mungkin lebih jelas.<\/p>\n<h2 data-nodeid=\"17151\">8. Bekerja di VPasCode<\/h2>\n<p data-nodeid=\"17152\">Alur kerja praktis:<\/p>\n<p><img alt=\"Diagram alur kerja yang menunjukkan tujuh langkah untuk membuat diagram kasus penggunaan PlantUML di VPasCode, termasuk mendefinisikan ruang lingkup, membuat draf kode, dan memvalidasi dengan pemangku kepentingan.\" class=\"alignnone size-full wp-image-21970\" decoding=\"async\" height=\"1024\" loading=\"lazy\" sizes=\"auto, (max-width: 1536px) 100vw, 1536px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485.png 1536w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485-300x200.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485-1024x683.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485-768x512.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf11378485-120x80.png 120w\" width=\"1536\"\/><\/p>\n<ol data-nodeid=\"17153\">\n<li data-nodeid=\"17154\">\n<p data-nodeid=\"17155\"><strong data-nodeid=\"17324\">Tentukan ruang lingkup.<\/strong> Identifikasi batas sistem, peran aktor, dan tujuan yang ingin dicapai oleh setiap peran.<\/p>\n<\/li>\n<li data-nodeid=\"17156\">\n<p data-nodeid=\"17157\"><strong data-nodeid=\"17329\">Buat draf.<\/strong> Tulis PlantUML secara langsung atau minta asisten AI untuk membuat diagram kasus penggunaan.<\/p>\n<\/li>\n<li data-nodeid=\"17158\">\n<p data-nodeid=\"17159\"><strong data-nodeid=\"17334\">Tinjau kode dan pratinjau.<\/strong> Konfirmasi bahwa aktor berada di luar batas sistem, kasus penggunaan berada di dalamnya, dan panah mengarah ke arah yang benar.<\/p>\n<\/li>\n<li data-nodeid=\"17160\">\n<p data-nodeid=\"17161\"><strong data-nodeid=\"17339\">Sempurnakan model.<\/strong> Ganti nama yang samar, hapus detail implementasi, dan tambahkan relasi hanya jika mencerminkan persyaratan nyata.<\/p>\n<\/li>\n<li data-nodeid=\"17162\">\n<p data-nodeid=\"17163\"><strong data-nodeid=\"17344\">Minta penyuntingan AI yang ditargetkan.<\/strong> Sebagai contoh: \u201cTambahkan aktor gerbang pembayaran eksternal dan tampilkan interaksi pembayaran yang diperlukan menggunakan relasi include. Biarkan sisanya tidak berubah.\u201d<\/p>\n<\/li>\n<li data-nodeid=\"17164\">\n<p data-nodeid=\"17165\"><strong data-nodeid=\"17349\">Validasi dengan pemangku kepentingan.<\/strong> Periksa bahwa diagram mencerminkan ruang lingkup aktual sistem dan tujuan pengguna.<\/p>\n<\/li>\n<li data-nodeid=\"17166\">\n<p data-nodeid=\"17167\"><strong data-nodeid=\"17356\">Simpan sumbernya.<\/strong> Simpan <code data-backticks=\"1\" data-nodeid=\"17354\">.puml<\/code> teks bersama dokumentasi proyek atau dalam kontrol versi. Ekspor gambar saat diperlukan untuk dokumen atau presentasi.<\/p>\n<\/li>\n<\/ol>\n<h3 data-nodeid=\"17168\">Contoh permintaan bantuan AI<\/h3>\n<blockquote data-nodeid=\"17169\">\n<p data-nodeid=\"17170\">Buat diagram kasus penggunaan UML dalam PlantUML untuk toko online. Sertakan batas sistem, aktor Pelanggan dan Administrator, serta tujuan Jelajahi produk, Tempatkan pesanan, Lacak pengiriman, dan Kelola katalog. Tampilkan otorisasi pembayaran sebagai perilaku yang diperlukan yang disertakan oleh Tempatkan pesanan. Tampilkan penerapan promosi sebagai ekstensi bersyarat dari Tempatkan pesanan. Kembalikan hanya sumber PlantUML yang valid.<\/p>\n<\/blockquote>\n<p data-nodeid=\"17171\">Anggap kode yang dihasilkan AI sebagai draf awal. Tinjau aktor, batas, hubungan, dan asumsi bisnis sebelum menggunakannya.<\/p>\n<h2 data-nodeid=\"17172\">9. Jebakan umum<\/h2>\n<p><img alt=\"Infografis yang mengilustrasikan enam jebakan umum dalam diagram kasus penggunaan UML, termasuk definisi aktor yang salah, penamaan, dan panah hubungan.\" class=\"alignnone size-full wp-image-21973\" decoding=\"async\" height=\"941\" loading=\"lazy\" sizes=\"auto, (max-width: 1672px) 100vw, 1672px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823.png 1672w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823-300x169.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823-1024x576.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823-768x432.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf16300823-1536x864.png 1536w\" width=\"1672\"\/><\/p>\n<ul data-nodeid=\"17173\">\n<li data-nodeid=\"17174\">\n<p data-nodeid=\"17175\"><strong data-nodeid=\"17365\">Memodelkan komponen internal sebagai aktor:<\/strong>Aktor harus berupa peran eksternal atau sistem yang berinteraksi dengan subjek.<\/p>\n<\/li>\n<li data-nodeid=\"17176\">\n<p data-nodeid=\"17177\"><strong data-nodeid=\"17370\">Menamai kasus penggunaan sebagai tugas implementasi:<\/strong>Lebih prefer &#8220;Lacak pengiriman&#8221; daripada &#8220;Panggil API pelacakan.&#8221;<\/p>\n<\/li>\n<li data-nodeid=\"17178\">\n<p data-nodeid=\"17179\"><strong data-nodeid=\"17377\">Menggunakan <code data-backticks=\"1\" data-nodeid=\"17373\">&lt;&lt;include&gt;&gt;<\/code> untuk perilaku opsional:<\/strong> Include merepresentasikan perilaku yang diperlukan oleh kasus penggunaan dasar.<\/p>\n<\/li>\n<li data-nodeid=\"17180\">\n<p data-nodeid=\"17181\"><strong data-nodeid=\"17382\">Memutar arah panah hubungan:<\/strong> Include menunjuk ke kasus penggunaan yang disertakan; extend menunjuk ke kasus penggunaan dasar.<\/p>\n<\/li>\n<li data-nodeid=\"17182\">\n<p data-nodeid=\"17183\"><strong data-nodeid=\"17387\">Memadatkan satu diagram dengan detail:<\/strong>Gunakan diagram tingkat tinggi untuk ruang lingkup, lalu gunakan diagram terpisah atau teks untuk skenario terperinci.<\/p>\n<\/li>\n<li data-nodeid=\"17184\">\n<p data-nodeid=\"17185\"><strong data-nodeid=\"17392\">Mengasumsikan render yang berhasil berarti modelnya benar:<\/strong>PlantUML dapat merender diagram yang masih salah merepresentasikan persyaratan.<\/p>\n<\/li>\n<\/ul>\n<h2 data-nodeid=\"17186\">10. Daftar periksa tinjauan<\/h2>\n<p data-nodeid=\"17187\">Sebelum membagikan diagram, pastikan bahwa:<\/p>\n<p><img alt=\"Daftar periksa tinjauan Diagram Kasus Penggunaan yang mencantumkan delapan poin validasi berdampingan dengan diagram contoh yang menunjukkan Pelanggan berinteraksi dengan Sistem Belanja Online.\" class=\"alignnone size-full wp-image-21974\" decoding=\"async\" height=\"941\" loading=\"lazy\" sizes=\"auto, (max-width: 1672px) 100vw, 1672px\" src=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d.png\" srcset=\"https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d.png 1672w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d-300x169.png 300w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d-1024x576.png 1024w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d-768x432.png 768w, https:\/\/www.cybermedian.com\/wp-content\/uploads\/2026\/10\/img_6acdf22d2011d-1536x864.png 1536w\" width=\"1672\"\/><\/p>\n<ul data-nodeid=\"17188\">\n<li data-nodeid=\"17189\">\n<p data-nodeid=\"17190\">Batas sistem jelas.<\/p>\n<\/li>\n<li data-nodeid=\"17191\">\n<p data-nodeid=\"17192\">Setiap aktor bersifat eksternal dan mewakili sebuah peran.<\/p>\n<\/li>\n<li data-nodeid=\"17193\">\n<p data-nodeid=\"17194\">Nama kasus penggunaan menggambarkan tujuan yang bermakna.<\/p>\n<\/li>\n<li data-nodeid=\"17195\">\n<p data-nodeid=\"17196\">Asosiasi aktor mencerminkan interaksi yang sebenarnya.<\/p>\n<\/li>\n<li data-nodeid=\"17197\">\n<p data-nodeid=\"17198\">Hubungan include bersifat wajib; hubungan extend bersifat bersyarat atau dibenarkan dengan cara lain.<\/p>\n<\/li>\n<li data-nodeid=\"17199\">\n<p data-nodeid=\"17200\">Panah generalisasi menunjuk ke aktor atau kasus penggunaan yang lebih umum.<\/p>\n<\/li>\n<li data-nodeid=\"17201\">\n<p data-nodeid=\"17202\">Diagram tetap mudah dibaca pada ukuran yang dimaksudkan.<\/p>\n<\/li>\n<li data-nodeid=\"17203\">\n<p class=\"\" data-nodeid=\"17204\">Asumsi yang dihasilkan oleh AI telah ditinjau bersama orang-orang yang memahami persyaratan.<\/p>\n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Diagram use case UML menunjukkan apa yang ditawarkan oleh suatu sistem dan siapa\u2014atau apa\u2014yang berinteraksi dengannya. Dengan alur kerja diagram-sebagai-kode,<\/p>\n","protected":false},"author":11,"featured_media":12289,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_yoast_wpseo_title":"","_yoast_wpseo_metadesc":"","source_url":"","source_h1_title":"","fifu_image_url":"","fifu_image_alt":"","_fifu_image_alt":"","fifu_alt":"","_fifu_alt":"","fifu_image_title":"","_fifu_image_title":"","fifu_input_alt":"","vp_image_hash":"","footnotes":""},"categories":[82,3,117],"tags":[],"asset-category":[],"class_list":["post-12288","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ai","category-unified-modeling-language","category-vpascode"],"source_url":"","source_h1_title":"","fifu_image_url":"","fifu_image_alt":"","vp_image_hash":"","yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.7 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\" \/>\n<meta property=\"og:locale\" content=\"id_ID\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya\" \/>\n<meta property=\"og:description\" content=\"Diagram use case UML menunjukkan apa yang ditawarkan oleh suatu sistem dan siapa\u2014atau apa\u2014yang berinteraksi dengannya. Dengan alur kerja diagram-sebagai-kode,\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\" \/>\n<meta property=\"og:site_name\" content=\"Media Maya\" \/>\n<meta property=\"article:published_time\" content=\"2026-10-13T08:56:52+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-14T05:08:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1536\" \/>\n\t<meta property=\"og:image:height\" content=\"1024\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"curtis\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Ditulis oleh\" \/>\n\t<meta name=\"twitter:data1\" content=\"curtis\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimasi waktu membaca\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 menit\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\"},\"author\":{\"name\":\"curtis\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d\"},\"headline\":\"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode\",\"datePublished\":\"2026-10-13T08:56:52+00:00\",\"dateModified\":\"2026-10-14T05:08:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\"},\"wordCount\":1048,\"image\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png\",\"articleSection\":[\"AI\",\"Unified Modeling Language\",\"VPasCode\"],\"inLanguage\":\"id\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\",\"url\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\",\"name\":\"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya\",\"isPartOf\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png\",\"datePublished\":\"2026-10-13T08:56:52+00:00\",\"dateModified\":\"2026-10-14T05:08:21+00:00\",\"author\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#breadcrumb\"},\"inLanguage\":\"id\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage\",\"url\":\"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png\",\"contentUrl\":\"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png\",\"width\":1536,\"height\":1024},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.cybermedian.com\/id\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/#website\",\"url\":\"https:\/\/www.cybermedian.com\/id\/\",\"name\":\"Media Maya\",\"description\":\"Belajar satu hal baru setiap hari\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.cybermedian.com\/id\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"id\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d\",\"name\":\"curtis\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"id\",\"@id\":\"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/6910084565fcc601ec03c6693bb8ea480c1e52ccaa0efb299eb038bb6a1edc87?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/6910084565fcc601ec03c6693bb8ea480c1e52ccaa0efb299eb038bb6a1edc87?s=96&d=mm&r=g\",\"caption\":\"curtis\"},\"url\":\"https:\/\/www.cybermedian.com\/id\/author\/curtis\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/","og_locale":"id_ID","og_type":"article","og_title":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya","og_description":"Diagram use case UML menunjukkan apa yang ditawarkan oleh suatu sistem dan siapa\u2014atau apa\u2014yang berinteraksi dengannya. Dengan alur kerja diagram-sebagai-kode,","og_url":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/","og_site_name":"Media Maya","article_published_time":"2026-10-13T08:56:52+00:00","article_modified_time":"2026-10-14T05:08:21+00:00","og_image":[{"width":1536,"height":1024,"url":"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png","type":"image\/png"}],"author":"curtis","twitter_card":"summary_large_image","twitter_misc":{"Ditulis oleh":"curtis","Estimasi waktu membaca":"7 menit"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#article","isPartOf":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/"},"author":{"name":"curtis","@id":"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d"},"headline":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode","datePublished":"2026-10-13T08:56:52+00:00","dateModified":"2026-10-14T05:08:21+00:00","mainEntityOfPage":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/"},"wordCount":1048,"image":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage"},"thumbnailUrl":"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png","articleSection":["AI","Unified Modeling Language","VPasCode"],"inLanguage":"id"},{"@type":"WebPage","@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/","url":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/","name":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode - Media Maya","isPartOf":{"@id":"https:\/\/www.cybermedian.com\/id\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage"},"image":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage"},"thumbnailUrl":"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png","datePublished":"2026-10-13T08:56:52+00:00","dateModified":"2026-10-14T05:08:21+00:00","author":{"@id":"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d"},"breadcrumb":{"@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#breadcrumb"},"inLanguage":"id","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/"]}]},{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#primaryimage","url":"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png","contentUrl":"https:\/\/www.cybermedian.com\/id\/wp-content\/uploads\/sites\/17\/2026\/10\/img_6acdef429169c.png","width":1536,"height":1024},{"@type":"BreadcrumbList","@id":"https:\/\/www.cybermedian.com\/id\/uml-use-case-diagrams-as-code-with-plantuml-and-vpascode\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.cybermedian.com\/id\/"},{"@type":"ListItem","position":2,"name":"Diagram Use Case UML sebagai Kode dengan PlantUML dan VPasCode"}]},{"@type":"WebSite","@id":"https:\/\/www.cybermedian.com\/id\/#website","url":"https:\/\/www.cybermedian.com\/id\/","name":"Media Maya","description":"Belajar satu hal baru setiap hari","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.cybermedian.com\/id\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"id"},{"@type":"Person","@id":"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/016578d8c88d35825fd3fbafc4f76b4d","name":"curtis","image":{"@type":"ImageObject","inLanguage":"id","@id":"https:\/\/www.cybermedian.com\/id\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6910084565fcc601ec03c6693bb8ea480c1e52ccaa0efb299eb038bb6a1edc87?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6910084565fcc601ec03c6693bb8ea480c1e52ccaa0efb299eb038bb6a1edc87?s=96&d=mm&r=g","caption":"curtis"},"url":"https:\/\/www.cybermedian.com\/id\/author\/curtis\/"}]}},"_links":{"self":[{"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/posts\/12288","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/comments?post=12288"}],"version-history":[{"count":0,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/posts\/12288\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/media\/12289"}],"wp:attachment":[{"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/media?parent=12288"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/categories?post=12288"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/tags?post=12288"},{"taxonomy":"asset-category","embeddable":true,"href":"https:\/\/www.cybermedian.com\/id\/wp-json\/wp\/v2\/asset-category?post=12288"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}