{"id":75,"date":"2026-05-26T07:16:09","date_gmt":"2026-05-26T07:16:09","guid":{"rendered":"https:\/\/www.vpascode.com\/ja\/docs\/uncategorized\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/"},"modified":"2026-07-29T08:29:52","modified_gmt":"2026-07-29T08:29:52","slug":"plantuml-state-diagram-syntax-guide","status":"publish","type":"ld_docs","link":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/","title":{"rendered":"PlantUML State Diagram Syntax Guide"},"content":{"rendered":"<h2>What is a State Diagram?<\/h2>\n<p>A <strong>State Diagram<\/strong> (often called a State Machine or Statechart Diagram) is a behavioral <strong>UML diagram<\/strong> that models the lifecycle of a single system object, business entity, or runtime process. As a fundamental component of the Unified Modeling Language (UML) specification, this specific <strong>UML diagram type<\/strong> illustrates the various states an object can inhabit from its initial instantiation to its final destruction, along with the specific events or conditions that trigger a change from one state to another.<\/p>\n<p>Whether you are documenting the intricate connection flags of a WebSocket connection, the order processing steps of an e-commerce checkout model, or the behavior of an autonomous hardware system, a UML state machine provides software developers and software architects with a clear, unambiguous blueprint of complex reactive logic. With <strong>VPasCode<\/strong>, you can script out complex state transitions instantly without wrestling with grid alignments or overlapping boundary arrows.<\/p>\n<h2>Core Syntax Guide: Elements and Constructs<\/h2>\n<p>To write high-quality, standard-compliant statechart layouts, you need to understand start and end points, state definitions, event transitions, nested composite states, and conditional choice points.<\/p>\n<h3>1. Initial and End States<\/h3>\n<p>Every state machine must have an entry point and, optionally, a terminal point. In PlantUML syntax, these boundary elements are represented by a clean asterisk symbol wrapper:<\/p>\n<ul>\n<li><code>[*] --&gt; StateName<\/code> (Defines the initial start state)<\/li>\n<li><code>StateName --&gt; [*]<\/code> (Defines the terminal end state)<\/li>\n<\/ul>\n<h3>2. Defining States and Event Transitions<\/h3>\n<p>States are declared automatically whenever they are linked by a directional arrow (<code>--&gt;<\/code>). To add context to a transition, append a colon (<code>:<\/code>) followed by the specific event, API trigger, or method call that causes the state change:<\/p>\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\/#plantuml:YzQALT3LjLDmoInEpi_BIqqkIKtXvKBcWQMT8RpCl7G5AmKbg9o6fX8l5v8CaaAWDg2wnDAIZFZYqkJarE9Y9G00\" \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\"><code data-language=\"plantuml\" class=\"language-plantuml\">[*] --&gt; Disconnected\r\nDisconnected --&gt; Connecting : \"connect()\"\r\nConnecting --&gt; Connected : \"auth_success\"<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#plantuml:YzQALT3LjLDmoInEpi_BIqqkIKtXvKBcWQMT8RpCl7G5AmKbg9o6fX8l5v8CaaAWDg2wnDAIZFZYqkJarE9Y9G00\" \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 id=\"YJmYckH\"><img fetchpriority=\"high\" decoding=\"async\" width=\"158\" height=\"386\" class=\"alignnone size-full wp-image-573 \" src=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png 158w, https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94-123x300.png 123w\" sizes=\"(max-width: 158px) 100vw, 158px\" \/><\/p>\n<h3>3. Composite \/ Nested States<\/h3>\n<p>Complex applications often feature individual states that contain their own nested sub-states. You can implement these composite structures by using the <code>state<\/code> keyword followed by an opening curly brace:<\/p>\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\/#plantuml:Aov9B4bLS4mkoInB3SyloYukI4nELQZcvL80WcYjM0LTNJi5pvISL8W8Y0KM2gaioCnBLx1IKCfEhImeIYqkLeAeW4h0j85Kb6JcfkQNbW0Lr080\" \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\"><code data-language=\"plantuml\" class=\"language-plantuml\">state ActiveWorkspace {\r\n    [*] --&gt; Idle\r\n    Idle --&gt; Typing : \"keypress\"\r\n    Typing --&gt; Idle : \"timeout\"\r\n}<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#plantuml:Aov9B4bLS4mkoInB3SyloYukI4nELQZcvL80WcYjM0LTNJi5pvISL8W8Y0KM2gaioCnBLx1IKCfEhImeIYqkLeAeW4h0j85Kb6JcfkQNbW0Lr080\" \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 id=\"hZnVjpF\"><img decoding=\"async\" width=\"167\" height=\"259\" class=\"alignnone size-full wp-image-574 \" src=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18fec6f2cd1.png\" alt=\"\" \/><\/p>\n<h3>4. Choice Points (Conditional Branching)<\/h3>\n<p>When an event occurs, the system often has to evaluate internal data flags before determining the next state destination. To draw a standard UML choice diamond, use the <code>&lt;&lt;choice&gt;&gt;<\/code> stereotype token:<\/p>\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\/#plantuml:Aov9B4bLICv8JSwEBqYip4tDAr6miKdEoCzCJhMpu-NoBqf9BGh8IKnEJL7GrRL3Kscbe5HGb9-SMboieQd4ouKg2L8Ua9YP0bGLdPIOavYNdAfWPwjGab-Ic1EBJR5ROcPEAefo6wXg0000\" \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\"><code data-language=\"plantuml\" class=\"language-plantuml\">state check_payment &lt;&lt;choice&gt;&gt;\r\nOrderPlaced --&gt; check_payment : \"process()\"\r\ncheck_payment --&gt; Paid : [balance &gt;= total]\r\ncheck_payment --&gt; Failed : [balance &lt; total]<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#plantuml:Aov9B4bLICv8JSwEBqYip4tDAr6miKdEoCzCJhMpu-NoBqf9BGh8IKnEJL7GrRL3Kscbe5HGb9-SMboieQd4ouKg2L8Ua9YP0bGLdPIOavYNdAfWPwjGab-Ic1EBJR5ROcPEAefo6wXg0000\" \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 id=\"RkdCHRB\"><img decoding=\"async\" width=\"273\" height=\"279\" class=\"alignnone size-full wp-image-575 \" src=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18fed4616f4.png\" alt=\"\" \/><\/p>\n<h2>Best Practices for Clean Statecharts<\/h2>\n<ul>\n<li><strong>Leverage State Descriptions:<\/strong> You can append clear operational details, entry hooks, or exit functions straight inside a state node by using a colon wrapper inline (e.g., <code>StateName : entry \/ logTimestamp()<\/code>).<\/li>\n<li><strong>Keep State Names Compact:<\/strong> Use CamelCase or snake_case for your internal state variable codes (e.g., <code>PaymentProcessing<\/code>), and use quotation marks if you need to attach a long human-readable label to them.<\/li>\n<li><strong>Manage Vector Routing directions:<\/strong> If your multi-tier lifecycle maps become cluttered vertically, inject inline spatial rules inside the connection arrows (e.g., <code>-right-&gt;<\/code> or <code>-down-&gt;<\/code>) to balance layout density.<\/li>\n<\/ul>\n<h2>Real-World PlantUML State Diagram Examples<\/h2>\n<h3>Example 1: IoT Device Network Lifecycle (Composite States &amp; Choices)<\/h3>\n<p>This boilerplate tracks the connection behavioral state loops of an IoT sensor module, demonstrating complex structural nested blocks and conditional evaluation choice pins.<\/p>\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\/#plantuml:VLBBRW8n3BoljFyGxR4IFu0GGYg7zj9MfJU48fEOtMX3GhDcAQtwxtL2A8-YvfJOCxPdd4b746YxjcKnlrk8mM0idbShQnoMHLdaQmhVU-TGaN6r68fgutSOf7TLX74DmdF0Lra8FiUAZywG0Mi-ENV8d4SIv1KxRtj-JPzciNu3GUyWe0m8UbyTM1UWo9gXq_ny0AUx1bgCJBEHeDwt9g1cslTfFjXIWuwC0ZBUITMWQiLef1fl58x7PN4c81Q_YUS60HMQ7cM7eMSFL0FMeginMN6Jb5nroScXc9DlqScUrUl5VuJi_Iy3FpPHr2BEiEHKozveQPFCeyRSvTf_RJ7xphSKUWlWkhMXg7OA1B4ecJNheM3g6aEs_0_kM2yIGCKPaXkwkchm4Z_83FhyNwpVoIKGOTXBZSGsdzQJXxuKNQcy3JR5-euOFE5jyq_z0G00\" \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\"><code data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\n[*] --&gt; Offline\r\n\r\nOffline --&gt; Connecting : \"power_on\"\r\n\r\nstate Connecting {\r\n    [*] --&gt; Initializing\r\n    Initializing --&gt; ResolvingDNS : \"hardware_ready\"\r\n    ResolvingDNS --&gt; SendingHandshake : \"ip_acquired\"\r\n}\r\n\r\nstate authentication_check &lt;&lt;choice&gt;&gt;\r\nConnecting --&gt; authentication_check : \"receive_server_challenge\"\r\n\r\nauthentication_check --&gt; Online : [token_valid]\r\nauthentication_check --&gt; Offline : [token_expired] : \"blink_red_led\"\r\n\r\nstate Online {\r\n    [*] --&gt; Idle\r\n    Idle --&gt; TransmittingData : \"timer_trigger\"\r\n    TransmittingData --&gt; Idle : \"ack_received\"\r\n    Idle --&gt; PowerSaving : \"low_battery_detected\"\r\n}\r\n\r\nOnline --&gt; Offline : \"connection_lost\"\r\n@enduml<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#plantuml:VLBBRW8n3BoljFyGxR4IFu0GGYg7zj9MfJU48fEOtMX3GhDcAQtwxtL2A8-YvfJOCxPdd4b746YxjcKnlrk8mM0idbShQnoMHLdaQmhVU-TGaN6r68fgutSOf7TLX74DmdF0Lra8FiUAZywG0Mi-ENV8d4SIv1KxRtj-JPzciNu3GUyWe0m8UbyTM1UWo9gXq_ny0AUx1bgCJBEHeDwt9g1cslTfFjXIWuwC0ZBUITMWQiLef1fl58x7PN4c81Q_YUS60HMQ7cM7eMSFL0FMeginMN6Jb5nroScXc9DlqScUrUl5VuJi_Iy3FpPHr2BEiEHKozveQPFCeyRSvTf_RJ7xphSKUWlWkhMXg7OA1B4ecJNheM3g6aEs_0_kM2yIGCKPaXkwkchm4Z_83FhyNwpVoIKGOTXBZSGsdzQJXxuKNQcy3JR5-euOFE5jyq_z0G00\" \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 id=\"FHGMizM\"><img loading=\"lazy\" decoding=\"async\" width=\"662\" height=\"735\" class=\"alignnone size-full wp-image-576 \" src=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18fee62c246.png\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18fee62c246.png 662w, https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18fee62c246-270x300.png 270w\" sizes=\"(max-width: 662px) 100vw, 662px\" \/><\/p>\n<p><strong>Syntax Breakdown:<\/strong> This map clearly segregates individual operational loops. When the hardware transitions into the composite <code>Connecting<\/code> wrapper state, it tracks localized sub-states like DNS resolution before reaching the <code>authentication_check<\/code> choice diamond. The brackets (<code>[token_valid]<\/code>) represent standard UML guard conditions.<\/p>\n<h3>Example 2: E-Commerce Order Fulfillment State Machine (Concurrent Sub-States)<\/h3>\n<p>This advanced enterprise blueprint models a multi-threaded order system showing orthogonal concurrent behaviors (processing shipping packages and billing records simultaneously) using split lines (<code>--<\/code>).<\/p>\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\/#plantuml:RLFBQiCm4BmR_0ycnu9_e8UI9crfeD3G74inYhI9HVGmgrLeMlBlbQpOiTtuOdbdPdV6QyyTCIIlLPvztdqLPVbGR6hRDDBibm78ipmRFhU4TnI06x_LaWX4SL_CU0tyO3rLN4b-cENPX19LQxGSd0kDrkoamL0KCa-rHVa3rSuRuMPnNd14S8F-csT5k3gRIsk8SGg41JE7X8rhAGqGAOWDqYdvPGrvXCfv7eU4iUSu-V_CFcxel9Eeaxn9Q4WB344CN4-u4yjlTYyTIUvUcH4gZ4bmalu3E_MmmpgytW2j2BIxeiDgeh6siB3VqQuqn-3Mugbom7qot4klp3QhfnUBJw3a4V0KnOfjGLKDIaEzy9nkPJcEjv0g-lu0Rb6uOROnSYlOqkf6HixA7AtaS6LCaPP-EJzh9YyhRSIkseC1P2EVxLudM-cN-eYy3a5RlRXahdZ7wpxZdXLrmM-UpS68yCly0G00\" \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\"><code data-language=\"plantuml\" class=\"language-plantuml\">@startuml\r\n[*] --&gt; ShoppingCart\r\n\r\nShoppingCart --&gt; OrderSubmitted : \"checkout_click\"\r\nOrderSubmitted --&gt; ProcessingPayment : \"authorize_funds\"\r\n\r\nstate ProcessingPayment {\r\n    [*] --&gt; ContactingBank\r\n    ContactingBank --&gt; SettlementSettled : \"capture_success\"\r\n}\r\n\r\nProcessingPayment --&gt; OrderConfirmed : \"payment_cleared\"\r\n\r\nstate OrderConfirmed {\r\n    [*] --&gt; LogisticsHandling\r\n    state LogisticsHandling {\r\n        [*] --&gt; PickingItems\r\n        PickingItems --&gt; PackingBox : \"inventory_secured\"\r\n        PackingBox --&gt; OutForDelivery : \"label_printed\"\r\n    }\r\n    --\r\n    [*] --&gt; BillingRecords\r\n    state BillingRecords {\r\n        [*] --&gt; CompilingInvoice\r\n        CompilingInvoice --&gt; InvoiceEmailed : \"pdf_generated\"\r\n    }\r\n}\r\n\r\nOrderConfirmed --&gt; OrderArchived : \"delivery_confirmed\"\r\nOrderArchived --&gt; [*]\r\n@enduml<\/code><\/pre>                <\/div>\r\n                <div class=\"vpascode-actions\">\r\n                    <a href=\"https:\/\/www.vpascode.com\/#plantuml:RLFBQiCm4BmR_0ycnu9_e8UI9crfeD3G74inYhI9HVGmgrLeMlBlbQpOiTtuOdbdPdV6QyyTCIIlLPvztdqLPVbGR6hRDDBibm78ipmRFhU4TnI06x_LaWX4SL_CU0tyO3rLN4b-cENPX19LQxGSd0kDrkoamL0KCa-rHVa3rSuRuMPnNd14S8F-csT5k3gRIsk8SGg41JE7X8rhAGqGAOWDqYdvPGrvXCfv7eU4iUSu-V_CFcxel9Eeaxn9Q4WB344CN4-u4yjlTYyTIUvUcH4gZ4bmalu3E_MmmpgytW2j2BIxeiDgeh6siB3VqQuqn-3Mugbom7qot4klp3QhfnUBJw3a4V0KnOfjGLKDIaEzy9nkPJcEjv0g-lu0Rb6uOROnSYlOqkf6HixA7AtaS6LCaPP-EJzh9YyhRSIkseC1P2EVxLudM-cN-eYy3a5RlRXahdZ7wpxZdXLrmM-UpS68yCly0G00\" \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 id=\"viuKPko\"><img loading=\"lazy\" decoding=\"async\" width=\"271\" height=\"1679\" class=\"alignnone size-full wp-image-578 \" src=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18ff89bb741.png\" alt=\"\" srcset=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18ff89bb741.png 271w, https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18ff89bb741-248x1536.png 248w\" sizes=\"(max-width: 271px) 100vw, 271px\" \/><\/p>\n<p><strong>Syntax Breakdown:<\/strong> Inside the <code>OrderConfirmed<\/code> composite structure, the double dash delimiter (<code>--<\/code>) acts as an orthogonal divider. This instructs PlantUML to split the diagram into two concurrent states that execute in parallel: the physical logistics pipeline on the left, and the corporate billing updates on the right.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>What is a State Diagram? A State Diagram&#8230;<\/p>\n","protected":false},"author":4,"featured_media":0,"parent":47,"menu_order":5,"template":"","meta":{"inline_featured_image":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"ld_collection":[14],"class_list":["post-75","ld_docs","type-ld_docs","status-publish","hentry","ld_collection-vpascode-docs"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide<\/title>\n<meta name=\"description\" content=\"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.\" \/>\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.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/\" \/>\n<meta property=\"og:locale\" content=\"ja_JP\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide\" \/>\n<meta property=\"og:description\" content=\"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/\" \/>\n<meta property=\"og:site_name\" content=\"VPasCode\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-29T08:29:52+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u63a8\u5b9a\u8aad\u307f\u53d6\u308a\u6642\u9593\" \/>\n\t<meta name=\"twitter:data1\" content=\"4\u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/\",\"name\":\"PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/wp-content\\\/uploads\\\/sites\\\/8\\\/2026\\\/05\\\/img_6a18feb546e94.png\",\"datePublished\":\"2026-05-26T07:16:09+00:00\",\"dateModified\":\"2026-07-29T08:29:52+00:00\",\"description\":\"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/#breadcrumb\"},\"inLanguage\":\"ja\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ja\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/wp-content\\\/uploads\\\/sites\\\/8\\\/2026\\\/05\\\/img_6a18feb546e94.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/wp-content\\\/uploads\\\/sites\\\/8\\\/2026\\\/05\\\/img_6a18feb546e94.png\",\"width\":158,\"height\":386},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/plantuml-state-diagram-syntax-guide\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Lean Docs\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/%ld_collection%\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"PlantUML Playbook\",\"item\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/docs\\\/vpascode-docs\\\/plantuml-playbook\\\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"PlantUML State Diagram Syntax Guide\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#website\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/\",\"name\":\"VPasCode\",\"description\":\"by Visual Paradigm\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ja\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#organization\",\"name\":\"VPasCode\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"ja\",\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/wp-content\\\/uploads\\\/sites\\\/8\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"contentUrl\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/wp-content\\\/uploads\\\/sites\\\/8\\\/2026\\\/06\\\/cropped-vp-online-logo-v1.png\",\"width\":128,\"height\":138,\"caption\":\"VPasCode\"},\"image\":{\"@id\":\"https:\\\/\\\/www.vpascode.com\\\/ja\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide","description":"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.","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.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/","og_locale":"ja_JP","og_type":"article","og_title":"PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide","og_description":"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.","og_url":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/","og_site_name":"VPasCode","article_modified_time":"2026-07-29T08:29:52+00:00","og_image":[{"url":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"\u63a8\u5b9a\u8aad\u307f\u53d6\u308a\u6642\u9593":"4\u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/","url":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/","name":"PlantUML State Diagram Syntax | VPasCode Text to Diagram Guide","isPartOf":{"@id":"https:\/\/www.vpascode.com\/ja\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/#primaryimage"},"image":{"@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/#primaryimage"},"thumbnailUrl":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png","datePublished":"2026-05-26T07:16:09+00:00","dateModified":"2026-07-29T08:29:52+00:00","description":"Map complex state machine transitions with PlantUML state diagrams using VPasCode, an agile diagram-as-code tool.","breadcrumb":{"@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/#breadcrumb"},"inLanguage":"ja","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/"]}]},{"@type":"ImageObject","inLanguage":"ja","@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/#primaryimage","url":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png","contentUrl":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/05\/img_6a18feb546e94.png","width":158,"height":386},{"@type":"BreadcrumbList","@id":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/plantuml-state-diagram-syntax-guide\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.vpascode.com\/ja\/"},{"@type":"ListItem","position":2,"name":"Lean Docs","item":"https:\/\/www.vpascode.com\/ja\/docs\/%ld_collection%\/"},{"@type":"ListItem","position":3,"name":"PlantUML Playbook","item":"https:\/\/www.vpascode.com\/ja\/docs\/vpascode-docs\/plantuml-playbook\/"},{"@type":"ListItem","position":4,"name":"PlantUML State Diagram Syntax Guide"}]},{"@type":"WebSite","@id":"https:\/\/www.vpascode.com\/ja\/#website","url":"https:\/\/www.vpascode.com\/ja\/","name":"VPasCode","description":"by Visual Paradigm","publisher":{"@id":"https:\/\/www.vpascode.com\/ja\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.vpascode.com\/ja\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ja"},{"@type":"Organization","@id":"https:\/\/www.vpascode.com\/ja\/#organization","name":"VPasCode","url":"https:\/\/www.vpascode.com\/ja\/","logo":{"@type":"ImageObject","inLanguage":"ja","@id":"https:\/\/www.vpascode.com\/ja\/#\/schema\/logo\/image\/","url":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/06\/cropped-vp-online-logo-v1.png","contentUrl":"https:\/\/www.vpascode.com\/ja\/wp-content\/uploads\/sites\/8\/2026\/06\/cropped-vp-online-logo-v1.png","width":128,"height":138,"caption":"VPasCode"},"image":{"@id":"https:\/\/www.vpascode.com\/ja\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/ld_docs\/75","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/ld_docs"}],"about":[{"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/types\/ld_docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/users\/4"}],"up":[{"embeddable":true,"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/ld_docs\/47"}],"wp:attachment":[{"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/media?parent=75"}],"wp:term":[{"taxonomy":"ld_collection","embeddable":true,"href":"https:\/\/www.vpascode.com\/ja\/wp-json\/wp\/v2\/ld_collection?post=75"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}