Mi encuentro inicial con ChatGPT fue impulsado por pura curiosidad cuando se lanzó. Me atrajeron particularmente los artículos que tratan sobre la generación de código, aunque yo personalmente no escribo código. E inicialmente creí que esa característica no sería relevante para mí.

Sin embargo, llegó un momento en el que me encontré trabajando en un diagrama UML que no tenía muchas ganas de crear.

En mi búsqueda por simplificar o acelerar el proceso, recurrí a varios métodos. Por lo general, creo diagramas UML usando código PlantUML... aquí, me di cuenta: esta es una forma de código, y el código se puede generar.

Por lo tanto, ChatGPT evolucionó hasta convertirse en una herramienta valiosa para la creación de diagramas y ahora estoy emocionado de compartir mis experiencias con ustedes.

Algunas palabras sobre UML

UML significa Lenguaje de modelado unificado y sirve como lenguaje para especificar, visualizar, construir y documentar artefactos de sistemas de software. UML se basa en conceptos de lenguajes de programación orientados a objetos; Tener conocimientos de desarrollo es beneficioso para el modelado UML, pero no obligatorio.

Está diseñado principalmente para describir aspectos del diseño de software, pero también ofrece un conjunto de diagramas de comportamiento para modelar los requisitos comerciales o del usuario.

En mi función, me ocupo de los procesos comerciales de TI, enfocándome específicamente en modelarlos para su análisis, optimización y traducirlos a un formato claro para que los desarrolladores los implementen.

Cuando se trata de modelado, empleo varios enfoques y herramientas, uno de los cuales es UML.

Aquí está lo bueno: no es necesario ser ingeniero de software para utilizar UML. Lo uso para navegar a través de procesos de negocios implementados con software, pero va más allá: es notablemente versátil y puede ser aplicado por varios roles en diferentes etapas de desarrollo. Considerándolo todo, pruébalo; es posible que te guste.

Dibujar vs Código

Como cualquier diagrama, puedes dibujarlo fácilmente: es simple, conveniente, rápido y proporciona una visión clara del proceso y el resultado. Hay numerosas herramientas gráficas disponibles para este propósito y yo las uso. Sin embargo, la mayoría de las veces elijo el enfoque de "código", gracias a PlantUML.

PlantUML , una herramienta y lenguaje de modelado de código abierto, le permite generar diagramas basados en lenguaje de texto sin formato. En términos más simples, puedes escribir código en PlantUML para crear diagramas.

Disfruto dibujando diagramas en mi 'modo creativo', pero la mayoría de las veces, luego los convierto en código o escribo el código directamente. Existen dos motivos principales para esto:

1. Puede insertar, mover y eliminar bloques en sus diagramas de manera mucho más eficiente

   Cambiar el orden de los bloques en los diagramas dibujados a menudo genera modificaciones en todo el diagrama, lo que afecta a otros bloques y enlaces. Cuando trabajas con código, no necesitas preocuparte por el aspecto visual; estás tratando con un texto y PlantUML se encarga de la representación gráfica por ti.

   
   

2. Puede trabajar y almacenar archivos de texto simples en lugar de trabajar con imágenes.

   Esto es particularmente beneficioso cuando se encuentran imágenes de diagramas en la documentación. La calidad puede verse comprometida. Es imposible seguir trabajando con estos diagramas y sólo se pueden volver a dibujar, no editar ni ampliar.

Otra ventaja importante es que ChatGPT comprende PlantUML y puede generar código , lo que le permite disfrutar de los beneficios de la generación de código e integrarlos perfectamente con UML. Compartiré algunos ejemplos de mi experiencia personal a continuación.

Puede utilizar cualquier editor de código para PluntUML. Personalmente prefiero Visual Studio Code y la extensión PlantUML. Otra forma es utilizar redactores en línea como https://plantuml.com u otros.

ChatGPT, escribe código PlntUML para mí

Ejemplo 1: No quiero empezar desde cero

Creemos un diagrama de casos de uso para una aplicación de taxi.

Primero, uso un mensaje:

use la sintaxis de https://plantuml.com/ru/use-case-diagram, cree un diagrama de casos de uso para una aplicación de taxi

ChatGPT genera un código:

 @startuml left to right direction actor "Passenger" as passenger actor "Driver" as driver rectangle "Taxi App" { usecase "Request Ride" as request usecase "Cancel Ride" as cancel usecase "Track Ride" as track usecase "Payment" as payment passenger -- (request) passenger -- (cancel) passenger -- (track) passenger -- (payment) driver -- (track) driver -- (payment) (request) --> (cancel) (request) --> (track) (track) --> (payment) } @enduml

Vista visual:

La idea está bien, pero tener sólo cuatro casos parece insuficiente. Solicito agregar casos adicionales y mejorarlo con algunos ejemplos de sintaxis, ya que no hay ninguno similar en PlantUML. Inmediato:

agregue más casos, puede usar diferentes tipos de enlaces como incluir, extender y generalizar, sintaxis:

(caso1).> (caso2_incluye_caso1): <<incluir>>

(padre) <|-- (hijo)

(caso1 extiende el caso 2).> (caso2): <<extiende>>

Luego le pido varias veces que

agregar más casos

nuevamente y realizar algunas solicitudes específicas para corregir errores.

Aquí está el resultado final de ChatGPT:

 @startuml left to right direction actor "Passenger" as passenger actor "Driver" as driver rectangle "Taxi App" { usecase "Request Ride" as request usecase "Cancel Ride" as cancel usecase "Track Ride" as track usecase "Payment" as payment usecase "Rate Driver" as rate usecase "View Ride History" as history usecase "Select Ride Type" as selectType usecase "Provide Feedback" as feedback usecase "View Driver Information" as driverInfo usecase "Update Profile" as updateProfile usecase "Promo Code" as promoCode usecase "Emergency Assistance" as emergencyAssistance passenger -- (selectType) passenger -- (request) passenger -- (cancel) passenger -- (track) passenger -- (payment) passenger -- (rate) passenger -- (history) passenger -- (feedback) passenger -- (driverInfo) passenger -- (updateProfile) passenger -- (promoCode) passenger -- (emergencyAssistance) driver -- (track) driver -- (payment) driver -- (rate) (request) ---> (cancel) (request) ---> (track) (track) ---> (payment) (track) ---> (rate) (history) --> (payment) (rate) --> (payment) (rate) ---> (track) (cancel) --> (request) (selectType) --> (request) (feedback) --> (rate) (driverInfo) ---> (track) (updateProfile) --> (track) (promoCode) --> (payment) (emergencyAssistance) --> (track) } @enduml 

Me gustan los casos, pero no las conexiones entre ellos. Entonces, edito ese código un poco.

Aquí esta el resultado final:

 @startuml actor "Passenger" as passenger actor "Driver" as driver rectangle "Taxi App" { usecase "Request Ride" as request usecase "Cancel Ride" as cancel usecase "Track Ride" as track usecase "Payment" as payment usecase "Rate Driver" as rate usecase "View Ride History" as history usecase "Select Ride Type" as selectType usecase "Provide Feedback" as feedback usecase "View Driver Information" as driverInfo usecase "Update Profile" as updateProfile usecase "Promo Code" as promoCode usecase "Emergency Assistance" as emergencyAssistance passenger -- (selectType) passenger - (request) passenger -- (track) passenger -- (payment) passenger -- (history) passenger -- (rate) passenger -- (updateProfile) passenger -- (emergencyAssistance) driver - (request) driver - (payment) driver - (rate) (request) --> (track) (track) --> (payment) (track) --> (rate) (selectType) --> (request) (cancel) .> (request) : <<extends>> (rate) <.. (feedback) : <<include>> (payment) <..(promoCode) : <<include>> (driverInfo) .> (track) : <<extends>> } @enduml 

Ciertamente, puedes incorporar más escenarios. Por ejemplo, no hay información sobre el registro y el inicio de sesión del usuario. Además, puede guiar a ChatGPT para que cree un diagrama relacionado con sus diseños. La clave es que tengas una base que puedas usar.

Ejemplo 2: necesito comprobar y mejorar un diagrama

Tengo una versión simple de un diagrama de secuencia para una solución de almacenamiento de imágenes con un proxy inverso:

 @startuml participant Client boundary "Reverse Proxy" as Proxy participant Back participant FileStorage participant Admin actor Editor Editor -> Admin: Add picture Admin -> FileStorage: Add picture Client -> Proxy: Get picture Proxy -> Proxy: Check cache alt cash is not empty Proxy -->> Client: Return picture else cash is empty Proxy -> FileStorage: Recieve picture FileStorage --> Proxy: Picture Proxy -> Proxy: Save to cache Proxy -->> Client: Return picture end @enduml 

Mejorémoslo. Mi mensaje:

Estoy diseñando una solución para almacenar y usar imágenes, consulte este diagrama y edítelo si es necesario.

Sugerencia de ChatGPT:

 1. **Participant Name Clarification:** - Consider renaming "Back" to something more descriptive, like "Application Server" or a similar term that better represents the functionality. 2. **Actor Placement:** - Move the "Editor" actor to a more standard position, usually at the top. @startuml participant Client actor Editor boundary "Reverse Proxy" as Proxy participant ApplicationServer participant FileStorage participant Admin Editor -> Admin: Add picture Admin -> FileStorage: Add picture Client -> Proxy: Get picture Proxy -> Proxy: Check cache alt cache is not empty Proxy -->> Client: Return picture else cache is empty Proxy -> ApplicationServer: Receive picture ApplicationServer --> Proxy: Picture Proxy -> Proxy: Save to cache Proxy -->> Client: Return picture end @enduml

No me gusta el punto sobre la ubicación de los actores, así que lo pospuse; todo lo demás está bien.

Luego repetí varias veces un mensaje:

Consulte este diagrama y mejórelo si es necesario.

y escribir indicaciones:

muestra cómo ApplicationServer obtiene una imagen de la base de datos

agregar foco de control

agregar algunos casos de esquina

Para finalizar, ajusto el foco de control y hago algunos cambios en el naming. Aquí está el resultado final:

 @startuml participant Client boundary "Reverse Proxy" as Proxy participant ApplicationServer database FileStorage participant Admin actor Editor Editor -> Admin: Add picture activate Admin deactivate Admin Admin -> FileStorage: Add picture activate FileStorage deactivate FileStorage Admin -> ApplicationServer: Store metadata activate ApplicationServer Client -> Proxy: Get picture activate Proxy Proxy -> Proxy: Check cache alt cache is not empty Proxy -->> Client: Return picture else cache is empty Proxy -> ApplicationServer: Receive picture request activate FileStorage ApplicationServer -> FileStorage: Retrieve picture from database alt picture not found in database FileStorage --> ApplicationServer: Picture not found deactivate FileStorage ApplicationServer -> Proxy: Notify picture not found Proxy -->> Client: Picture not found else FileStorage --> ApplicationServer: Picture data deactivate FileStorage ApplicationServer -> Proxy: Send picture to Proxy Proxy -> Proxy: Save to cache Proxy -->> Client: Return picture end end deactivate Proxy deactivate ApplicationServer deactivate Admin deactivate Editor @enduml 

Desventajas

En primer lugar hay que comprobarlo todo porque "ChatGPT puede cometer errores". No pretende ser un reemplazo para usted, sino más bien una herramienta para agilizar y optimizar su trabajo.

Los errores más comunes están relacionados con la sintaxis de PlantUML. A veces, sucede en medio de una conversación y tengo que arreglarlo y hacer que ChatGPT vuelva al camino correcto.

En segundo lugar, uso una versión gratuita de ChatGPT 3.5 y tiene altibajos. A veces, funciona peor y da algunas respuestas aleatorias para el mismo mensaje.

En tercer lugar, ChatGPT comprende algunos diagramas mejor que otros. Por ejemplo, funciona mucho mejor con diagramas de secuencia que con diagramas de casos de uso.

Sin embargo, a pesar de estas limitaciones, ChatGPT sigue siendo una herramienta valiosa y un excelente asistente capaz de aumentar su eficiencia y ahorrarle tiempo.

Conclusión

Utilizo ChatGPT de forma permanente en mi trabajo. Si es administrador, analista, desarrollador, evaluador o desempeña cualquier otro rol, puede utilizar UML. Si ese es el caso, considere escribir y generar código PlantUML: le ahorrará tiempo y aumentará su eficiencia.

Espero que mi experiencia te sea útil y te inspire. ¡Gracias!