¿Qué tipos de diagramas puedes crear con PlantUML? (Guía completa)

@startuml
  
título Sistema de gestión de hoteles

' Definir interfaces
interfaz IReservable {
    + hacerReserva(cliente: Cliente, fechas: RangoDeFechas): boolean
    + cancelarReserva(idReserva: String): boolean
    + verificarDisponibilidad(fecha: Fecha): boolean
}

interfaz IPagable {
    + procesarPago(monto: double): boolean
    + emitirReembolso(idReserva: String): boolean
    + obtenerEstadoPago(): String
}

' Definir clase abstracta
clase abstracta Persona {
    - id: String
    - nombre: String
    - correo: String
    - teléfono: String
    + getId(): String
    + getNombre(): String
    + getInformaciónContacto(): String
    + actualizarInformaciónContacto(info: String): void
}

' Definir clases concretas
class Cliente {
    - puntosFidelidad: int
    - estanciasTotales: int
    - preferencias: Lista
    + ganarPuntosFidelidad(costoEstancia: double): void
    + canjearPuntosFidelidad(puntos: int): boolean
    + obtenerNivelFidelidad(): String
    + agregarPreferencia(preferencia: String): void
}

class Habitación {
    - númeroHabitación: String
    - tipoHabitación: TipoHabitación
    - capacidad: int
    - precioNoche: double
    - comodidades: Lista
    - estáDisponible: boolean
    + reservarHabitación(cliente: Cliente, fechas: RangoDeFechas): boolean
    + liberarHabitación(): void
    + obtenerPrecio(cliente: Cliente): double
    + agregarComodidad(comodidad: String): void
    + obtenerEstadoHabitación(): String
}

class Reserva {
    - idReserva: String
    - fechaEntrada: Fecha
    - fechaSalida: Fecha
    - precioTotal: double
    - estado: EstadoReserva
    - solicitudesEspeciales: String
    + calcularPrecioTotal(): double
    + confirmarReserva(): void
    + ingresar(): void
    + salir(): boolean
    + actualizarFechas(nuevaEntrada: Fecha, nuevaSalida: Fecha): boolean
    + obtenerDuración(): int
}

' Enumeración
enum TipoHabitación {
    ESTANDAR
    LUXE
    SUITE
    PRESIDENCIAL
}

' Enumeración
enum EstadoReserva {
    PENDIENTE
    CONFIRMADA
    INGRESADA
    SALIDA
    CANCELADA
}

' Relaciones
' Implementación de interfaz (línea punteada con triángulo)
IReservable <|.. Reserva : implementa
IPagable <|.. Reserva : implementa

' Herencia abstracta (línea sólida con triángulo)
Persona <|-- Cliente : extiende ' Composición (diamante sólido) - Habitación forma parte de Reserva Reserva *-- "1..*" Habitación : contiene >

' Asociación (línea sólida simple) con multiplicidad
Cliente "1" -- "0..*" Reserva : realiza >

' Dependencia (flecha punteada) - Cliente depende de TipoHabitación
Cliente ..> TipoHabitación : tiene nivel de fidelidad basado en >

' Asociación con etiqueta personalizada
Reserva "1" --o "1" Cliente : reservada por >

' Realización de interfaz por clase abstracta (conector adicional opcional)
IReservable <|.. Habitación : implementa

@enduml

@startuml
título Diagrama de componentes de aplicación web

paquete "Capa de cliente" {
    [Navegador web] como Navegador
    [Aplicación móvil] como Móvil
}

paquete "Servidor de aplicación" {
    [Pasarela de API] como Pasarela
    [Servicio de usuario] como ServicioUsuario
    [Servicio de pedidos] como ServicioPedidos
    [Servicio de pago] como ServicioPago
}

paquete "Capa de base de datos" {
    base de datos "Base de datos de usuarios" como BaseDeDatosUsuarios
    base de datos "Base de datos de pedidos" como BaseDeDatosPedidos
}

paquete "Servicios de terceros" {
    [API de Stripe] como Stripe
}

' Conexiones
Navegador --> Pasarela : HTTP / REST
Móvil --> Pasarela : HTTP / REST

Pasarela --> ServicioUsuario : REST interno
Pasarela --> ServicioPedidos : REST interno

ServicioUsuario --> BaseDeDatosUsuarios : Lectura / Escritura
ServicioPedidos --> BaseDeDatosPedidos : Lectura / Escritura
ServicioPedidos --> ServicioPago : Procesar pago

ServicioPago --> Stripe : HTTPS / API
@enduml

@startuml
título Diagrama de despliegue - Aplicación web de tres capas

skinparam estiloComponente rectángulo

nodo "Escritorio cliente" como nodoCliente {
  nodo "Navegador web" como navegador {
    artefacto "Frontend de aplicación web (HTML/JS)" como frontend
  }
}

nodo "Servidor de aplicación" como nodoServidorAplicación {
  nodo "Contenedor de servlets (Tomcat)" como tomcat {
    artefacto "API de backend (archivo WAR)" como apiBackend
  }
}

nodo "Servidor de base de datos" como nodoServidorBaseDatos {
  base de datos "PostgreSQL" como postgres {
    artefacto "Esquema de base de datos de aplicación" como esquemaBaseDatos
  }
}

nodoCliente -- nodoServidorAplicación : HTTPS (Puerto 443)
nodoServidorAplicación -- nodoServidorBaseDatos : JDBC (Puerto 5432)

@enduml

@startuml
titulo Flujo de Autenticación de Usuario

actor "Usuario" como usuario
participante "Aplicación Web" como app
participante "API de Autenticación" como auth
database "Base de Datos de Usuarios" como db

usuario -> app : Ingresar Credenciales
activar app

app -> auth : POST /api/v1/login
activar auth

auth -> db : Consultar usuario por correo
activar db
db --> auth : Devolver registro de usuario y hash
desactivar db

alt Credenciales Válidas
    auth -> auth : Verificar contraseña y generar JWT
    auth --> app : 200 OK (Token y Perfil)
    app --> usuario : Redirigir al Panel de Control
else Credenciales Inválidas
    auth --> app : 401 No Autorizado (Error)
    app --> usuario : Mostrar "Credenciales Inválidas"
fin

desactivar auth
desactivar app
@enduml

@startuml
titulo Diagrama de Casos de Uso del Sistema de Compras en Línea

dirección izquierda a derecha

actor Cliente
actor "Cliente Registrado" como ClienteRegistrado
actor "Pasarela de Pago" como SistemaPago

Cliente <|-- ClienteRegistrado rectángulo "Sistema de Comercio Electrónico" { usecase "Navegar Productos" como UC_Navegar usecase "Buscar Artículos" como UC_Buscar usecase "Gestionar Carrito" como UC_Carrito usecase "Finalizar Pedido" como UC_Finalizar usecase "Aplicar Cupón de Descuento" como UC_Cupon usecase "Procesar Pago" como UC_Pago usecase "Ver Historial de Pedidos" como UC_Historial } Cliente --> UC_Navegar
Cliente --> UC_Buscar
Cliente --> UC_Carrito
Cliente --> UC_Finalizar

ClienteRegistrado --> UC_Historial

UC_Finalizar .> UC_Pago : <>
UC_Finalizar <.. UC_Cupon : <>

UC_Pago -- SistemaPago
@enduml

@startuml
titulo Proceso de Cumplimiento de Pedidos

|Cliente|
iniciar
:Realizar Pedido;
:Enviar Detalles de Pago;

|Sistema de Pedidos|
si (Pago Válido?) entonces (sí)
  :Reservar Inventario;
  
  ' División de concurrencia
  fork
    |Almacén|
    :Seleccionar Artículos de los Estantes;
    :Empaquetar Artículos en Caja;
  fork again
    |Facturación|
    :Generar PDF de Factura;
    :Cobrar Método de Pago;
  fin fork

  |Envío|
  :Adjuntar Etiqueta de Envío;
  :Entregar al Mensajero;
  
  |Cliente|
  :Recibir Paquete;
  detener
sino (no)
  |Sistema de Pedidos|
  :Enviar Notificación de Fallo en el Pago;
  |Cliente|
  :Actualizar Método de Pago;
  detener
fin si
@enduml

@startuml
titulo Ciclo de Vida de un Pedido en Comercio Electrónico

[*] --> Pendiente : Pedido Realizado

estado Pendiente {
  [*] --> EsperandoPago
  EsperandoPago --> PagoFallido : Error en el Pago
  PagoFallido --> EsperandoPago : Volver a Intentar el Pago
}

Pendiente --> Procesando : Pago Autorizado
Pendiente --> Cancelado : Usuario Cancela el Pedido

estado Procesando {
  [*] --> Empaquetando
  Empaquetando --> ListoParaEnvío : Verificación de Calidad Aprobada
}

Procesando --> Enviado : Entrega al Transportista
Enviado --> Entregado : Confirmación de Entrega
Enviado --> Devuelto : Entrega Fallida / Rechazada

Entregado --> [*]
Cancelado --> [*]
Devuelto --> [*]
@enduml

@startuml
titulo Diagrama de Tiempo para Transferencia de Datos SPI

robusto "Reloj (SCLK)" como CLK
binario "Seleccionar Chip (CS)" como CS
binario "Salida Maestra (MOSI)" como MOSI
conciso "Bus de Datos (MISO)" como MISO

@0
CS es Alto
CLK es Bajo
MOSI es Bajo
MISO es "Ocupado"

@1
CS es Bajo
MISO es "Encabezado"

@2
CLK es Alto
MOSI es Alto

@3
CLK es Bajo

@4
CLK es Alto
MOSI es Bajo
MISO es "Carga"

@5
CLK es Bajo

@6
CS es Alto
CLK es Bajo
MOSI es Bajo
MISO es "Ocupado"

@enduml

@startuml
!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Context.puml

TÍTULO Diagrama de contexto del sistema para el sistema de banca en línea

Persona(cliente, "Cliente de banca personal", "Un cliente del banco, con cuentas bancarias personales.")
Sistema(sistema_bancario, "Sistema de banca en línea", "Permite a los clientes ver información sobre sus cuentas bancarias y realizar pagos.")

Sistema_Ext(sistema_mainframe, "Sistema de banca mainframe", "Almacena toda la información central de banca sobre clientes, cuentas, transacciones, etc.")
Sistema_Ext(sistema_correo, "Sistema de correo electrónico", "El sistema interno de correo electrónico de Microsoft Exchange.")

Rel(cliente, sistema_bancario, "Visualiza saldos de cuentas y realiza pagos usando")
Rel(sistema_bancario, sistema_mainframe, "Obtiene información de cuentas desde y realiza pagos usando")
Rel(sistema_bancario, sistema_correo, "Envía correos electrónicos usando")
Rel_Atraso(sistema_correo, cliente, "Envía correos electrónicos a")
@enduml

@startuml
!include <archimate/Archimate>

título Muestra ArchiMate - Pago de facturas en línea

Agrupación(empresa, "Capa de negocio"){
  Proceso_de_negocio(proceso_pago_factura, "Proceso de pago de facturas")
  Objeto_de_negocio(cuenta_bancaria_cliente, "Cuenta bancaria del cliente")
  Servicio_de_negocio(servicio_pago, "Servicio de pago de facturas")
}

Agrupación(aplicación, "Capa de aplicación"){
  Componente_de_aplicación(aplicación_bancaria_movil, "Aplicación móvil de banca")
  Función_de_aplicación(procesamiento_pago, "Lógica de procesamiento de pagos")
  Objeto_de_datos_de_aplicación(registro_transacción, "Carga de datos de transacción")
}

Agrupación(tecnología, "Capa de tecnología"){
  Artefacto_de_tecnología(token_jwt, "Token de sesión cifrado")
  Servicio_de_tecnología(puerta_de_enlace_api, "Servicio de puerta de enlace API")
  Servicio_de_tecnología(servicio_base_datos, "Servicio de base de datos principal")
}

Rel_Flujo_Derecha(proceso_pago_factura, cuenta_bancaria_cliente, "")
Rel_Servicio_Arriba(servicio_pago, proceso_pago_factura, "")
Rel_Especialización_Arriba(procesamiento_pago, servicio_pago, "")
Rel_Flujo_Derecha(registro_transacción, procesamiento_pago, "")
Rel_Asignación_Izquierda(aplicación_bancaria_movil, procesamiento_pago, "")
Rel_Realización_Arriba(token_jwt, registro_transacción, "")
Rel_Servicio_Arriba(puerta_de_enlace_api, procesamiento_pago, "")
Rel_Servicio_Arriba(servicio_base_datos, puerta_de_enlace_api, "")
@enduml

@startuml
título Esquema de base de datos de comercio electrónico (notación de pie de cuervo)

' Ocultar íconos circulares para entidades
ocultar círculo
skinparam linetype orto

entidad "Usuario" como usuario {
  * user_id : INT <>
  --
  * email : VARCHAR(255)
  * password_hash : VARCHAR(255)
  * created_at : TIMESTAMP
}

entidad "Perfil de cliente" como perfil {
  * profile_id : INT <>
  --
  * user_id : INT <>
  * first_name : VARCHAR(100)
  * last_name : VARCHAR(100)
    phone : VARCHAR(20)
}

entidad "Pedido" como pedido {
  * order_id : INT <>
  --
  * user_id : INT <>
  * order_date : TIMESTAMP
  * total_amount : DECIMAL(10,2)
  * status : VARCHAR(50)
}

entidad "Item de pedido" como item {
  * order_item_id : INT <>
  --
  * order_id : INT <>
  * product_id : INT <>
  * quantity : INT
  * unit_price : DECIMAL(10,2)
}

entidad "Producto" como producto {
  * product_id : INT <>
  --
  * sku : VARCHAR(50)
  * name : VARCHAR(150)
    description : TEXT
  * price : DECIMAL(10,2)
}

' Relaciones
usuario ||--o| perfil : "tiene"
usuario ||--o{ pedido : "realiza"
pedido ||--|{ item : "contiene"
producto ||--o{ item : "aparece en"

@enduml

@startnwdiag
título Topología de red empresarial

nwdiag {
  red Internet_Externa {
    address = "0.0.0.0/0"
    cliente_usuario [address = "203.0.113.15", description = "Usuario remoto"];
    firewall_borde [address = "192.168.1.1", description = "FW de perímetro"];
  }

  red Zona_DMZ {
    address = "192.168.1.0/24"
    firewall_borde;
    balanceador_carga [address = "192.168.1.10", description = "Balanceador de carga Nginx"];
    servidor_correo [address = "192.168.1.25", description = "Servidor SMTP"];
    firewall_interno [address = "192.168.1.254", description = "FW interno"];
  }

  red LAN_Privada {
    address = "10.0.1.0/24"
    firewall_interno;
    servidor_aplicacion_01 [address = "10.0.1.50", description = "Nodo API 1"];
    servidor_aplicacion_02 [address = "10.0.1.51", description = "Nodo API 2"];
    db_maestro [address = "10.0.1.100", description = "Primario PostgreSQL"];
  }

  red Subred_Gestión {
    address = "10.0.99.0/24"
    firewall_interno;
    bastión_admin [address = "10.0.99.5", description = "Host de bastión SSH"];
    nodo_monitorización [address = "10.0.99.20", description = "Host de Prometheus"];
  }
}
@endnwdiag

gantt
    título Cronograma de Lanzamiento del Producto de Software
    formatoFecha  YYYY-MM-DD
    formatoEje  %b %d

    sección Planificación y Diseño
    Recopilación de Requisitos   :a1, 2026-09-01, 10d
    Diseño de Arquitectura      :a2, después de a1, 10d

    sección Desarrollo
    Desarrollo de la API de Backend  :b1, después de a2, 15d
    Desarrollo de la Interfaz de Usuario Frontend  :b2, después de a2, 15d

    sección Pruebas y Lanzamiento
    Pruebas de Integración      :c1, después de b1 b2, 8d
    Auditoría de Seguridad           :c2, después de c1, 5d
    Lanzamiento en Producción       :hitoy, m1, después de c2, 0d

@startwbs
título Estructura de Desglose del Trabajo para el Rediseño del Sitio Web

* Proyecto de Rediseño del Sitio Web
** 1. Descubrimiento y Estrategia
*** 1.1 Entrevistas con Stakeholders
*** 1.2 Auditoría de Competidores
*** 1.3 Aprobación del Alcance y Estrategia
** 2. Diseño UX/UI
*** 2.1 Wireframing
**** 2.1.1 Diseños para Escritorio
**** 2.1.2 Diseños para Móvil
*** 2.2 Sistema de Diseño
**** 2.2.1 Biblioteca de Componentes
**** 2.2.2 Tipografía y Guía de Estilo
** 3. Desarrollo Técnico
*** 3.1 Frontend
**** 3.1.1 Plantillas de Páginas
**** 3.1.2 Integraciones de API
*** 3.2 CMS y Backend
**** 3.2.1 Tipos de Publicación Personalizados
**** 3.2.2 Migración de Base de Datos
** 4. Pruebas y Lanzamiento
*** 4.1 Pruebas de Navegadores Cruzados
*** 4.2 Migración de Contenido
*** 4.3 Cambio de DNS y Puesta en Producción
@endwbs

@startmindmap
título Mapa de Características de la Plataforma de Comercio Electrónico

* Plataforma de Comercio Electrónico
** Gestión de Cuentas de Usuario
*** Autenticación Social (Google, Apple)
*** Autenticación de Dos Factores
*** Historial de Pedidos y Seguimiento
** Catálogo de Productos y Búsqueda
*** Búsqueda Facetada y Filtros
*** Sincronización de Inventario
*** Comentarios y Calificaciones de Productos
** Proceso de Compra y Pagos
*** Pasarelas de Pago (Stripe, PayPal)
*** Motor de Cupones y Promociones
*** Compra Rápida para Invitados
** Soporte al Cliente
*** Asistente de Chat en Vivo
*** Portal Automatizado de Devoluciones
@endmindmap

@startuml
autonumber
actor Usuario
participant "Editor de VPasCode" como Editor
participant "Motor de IA" como IA

Usuario -> Editor: Pegar código PlantUML
Editor -> Editor: Detección automática de formato y representación en tiempo real
alt Error de sintaxis detectado
    Usuario -> Editor: Haz clic en "Corregir con IA"
    Editor -> IA: Enviar código dañado
    IA --> Editor: Devolver código corregido y diferencia
fin
Editor --> Usuario: Mostrar diagrama vectorial limpio (SVG/PNG)
@enduml