ChatGPT para la creación de producto

Las capacidades de codificación de ChatGPT hacen que sea muy fácil codificar productos completos en muy poco tiempo, si sabe cómo usarlo de la manera correcta.

Vamos a tomar como ejemplo la creación de un producto con ChatGPT de un tutor Alemán a partir de ChatGPT.

Veremos que tener en cuenta para el diseño de la aplicación (y específicamente su backend) y cómo deberíamos conectar y configurar los diferentes servicios basados en IA.

Hay una cosa que debemos que tener en cuenta par esto y que prácticamente lo omitimos siempre, que es cómo crear la interfaz de la aplicación.

Verás, no soy un programador frontend, y mi conocimiento de JavaScript se suma al hecho de que sólo sé que necesito colocarlo dentro de las etiquetas <script></script>.

Pero la aplicación de ejemplo que tenemos en mente requiere una interfaz de usuario, y una bastante dinámica. Eso significa HTML, JavaScript y CSS , pero no tenemos ni idea de cómo comenzar a codificarlos.

Lo que sí sabemos es cómo queremos que se vea. Tenemos el diseño en mente y sabemos cómo lo haríamos si hubiéramos sabido cómo codificarlos.

Así que optemos por un enfoque nuevo y bastante radical :  Le pediremos a ChatGPT que escriba el código por nosotros. En este momento ya tenemos quizás la experiencia en pedirle a ChatGPT solicitudes relacionadas con el código, pero lo que vamos a probar es algo mucho más complejo.

Escribo esto una vez más, solo para asegurarme de que entendamos lo que vamos a hacer: un algoritmo codificará una aplicación completa solo porque noostros se la vamos a explicar en un lenguaje sencillo. 😲

Aún así, por sorprendente que fuera, este proceso no resultará tan trivial como podría parecer  y, por lo tanto, me gustaría aprovechar la oportunidad y compartir algunos consejos que aprendí en el pasado sobre cómo generar código complejo usando ChatGPT.

1. Diséñelo usted mismo.

Los LLM son herramientas poderosas para crear código y contenido, pero no piensan, solo pueden cumplir con las solicitudes (o al menos lo intentan). Eso significa que depende de nosotros pensar, y específicamente el diseño. Asegúrese de saber cómo debe verse el producto final antes de comenzar a enviar solicitudes al modelo generativo.

Más sobre esto: depende de nosotros investigar cuál es la mejor tecnología que se precisa. Como necesitará dividir su aplicación compleja en pasos (consulte el n.° 2 a continuación), el LLM no puede prever cómo se verá el producto final y podría usar bibliotecas o servicios subóptimos.

Por ejemplo, la primera interfaz de usuario que ChatGPT generó para nuestro ejemplo se basó en tkinter, que crea una aplicación real y no una interfaz de usuario web. Esto hace que la interfaz de usuario dinámica sea algo mucho más complicado de crear (y menos estándar en estos días).

Otro intento se basó en steamlit, que hace que las interfaces de usuario no complejas sean súper fáciles de crear, pero nuevamente no fue diseñado para solicitudes complejas (por ejemplo: “Agregue un botón de reproducción de grabación solo al lado de los mensajes del usuario, pero solo si el usuario grabó un audio”).

Para el caso, depende de nosotros entender que usar Flask es la forma óptima de hacerlo.

2. Divídalo en tareas y comience de manera simple.

Si pedimos a ChatGPT que codifique todo el producto a la vez, es muy probable que obtengamos un código roto.

Tan “inteligente” como es, no esperemos que pueda prestar atención a todos los detalles a la vez. Dividamos el diseño en tareas y fases, comenzando con algo bastante simple y agregando encima.

Por ejemplo, así sería nuestra interfaz de usuario diseñada y planeada inicialmente de chat:

Puede ver que hay todo tipo de botones y funcionalidades en la interfaz de usuario y, sin embargo, el primer mensaje que enviamos a ChatGPT es:

Escriba una interfaz de usuario web de Python para una aplicación de chatbot. 
El cuadro de texto donde el usuario ingresa su mensaje que se encuentra en la parte
inferior de la pantalla, y todos los mensajes anteriores se mantienen en la pantalla

Sin botones especiales, sin imágenes de perfil junto a los mensajes, nada especial. Solo una interfaz de usuario de chat simple, que será el núcleo sobre el que construiremos. Este aviso nos arroja 4 archivos:

• Un archivo de Python que funciona como backend (usando Flask)
• Un archivo HTML
• Un archivo JavaScript (usando jQuery)
• Un archivo CSS

Una vez que tenemos esto, podemos comenzar a hacer el producto más complejo.

Podrías pensar que me contradije a mí mismo ,  diciéndote que dividieras tu aplicación en pequeños pasos, pero debo confesar que el primer aviso generó estos cuatro archivos.

Por cada solicitud de ChatGPT, existe una compensación entre la cantidad de código que se requiere para completar la tarea y lo no estándar y específico que es. Solicitar una interfaz de usuario de chat completa generará algo bastante general, pero requiere mucho código.

Pedir “Agregar un botón de traducción al lado de los mensajes del tutor”, y también asegurarse de que esté ubicado en el lado derecho de la burbuja de mensajes, siempre en el centro vertical y arriba del botón de reproducción de sonido es algo muy específico, y por lo que será una solicitud en sí misma.

3. Explique cuidadosamente lo que realmente quiere.

Cada solicitud y adición que realicemos al producto puede implicar potencialmente cambios en más de un archivo (y en más de un cambio por cada archivo).

Eso significa que se crearán nuevas variables, funciones y puntos finales en cada solicitud de este tipo, y se hará referencia a ellas desde diferentes ubicaciones.

ChatGPT les dará los nombres proporcionados y hará todo lo posible para proporcionarles nombres significativos, pero solo puede hacerlo si explica bien el contexto.

Por ejemplo, si desea agregar un botón “Guardar” a su producto, es mejor pedirlo así:

Agregue un botón "Guardar sesión" a la izquierda del cuadro de texto. Deberia tener
un icono de disquete. Una vez hecho clic, todos los mensajes en la interfaz de usuario se guardarán en
un archivo JSON llamado "saved_session.json"

En lugar de un mensaje sin contexto como el siguiente:

Agregue un botón a la izquierda del cuadro de texto con un icono de disquete. Una vez
Al hacer clic, todos los mensajes en la interfaz de usuario se guardarán en un archivo JSON.

Preferir indicaciones ricas en contexto producirá mejores convenciones de nomenclatura.

4. Sé muy consciente de lo que pides exactamente.

Aquí hay un problema real que tenemos que resolver y que no vi venir: queremos que la interfaz de usuario muestre el texto generado por el ejemplo del tutor de Alemán mientras se transmite, de manera similar al efecto en ChatGPT.

La API de Python que estaba usando para crear la respuesta del tutor (API de OpenAI ChatCompletion) devuelve un generador de Python, que luego se necesitaba para consumir e imprimir en la pantalla.

Entonces le pregunté a ChatGPT:

Escriba una función de JavaScript que consuma el generador y actualice el
mensaje de texto un elemento a la vez

Lo que no sabía,  ya que nunca he escrito JavaScript en mi vida ,  era que pedí algo imposible. JavaScript no tiene forma de manejar un generador de Python.

Lo que sucede en este caso es que ChatGPT nos da todo tipo de soluciones extrañas y completamente inútiles, ya que intenta hacer exactamente lo que le pedimos: alterar el código JavaScript.

Debe recordar que ChatGPT intenta cumplir con sus solicitudes exactamente como uno las solicita, siempre que no violen sus pautas. Lo que realmente necesitaba en ese momento era que me dijera que estoy pidiendo algo tonto, pero no es así como funciona.

Este problema solo se soluciona una vez que nos damos cuenta de que estamos pidiendo lo imposible (a la antigua : Google y StackOverflow), y modificamos el aviso, para nuestro ejemplo a algo como esto:

Dado el generador de respuesta, agregue funcionalidad para consumir el generador
y actualiza el texto del mensaje un elemento a la vez

Lo que resultó en modificaciones tanto en el archivo JavaScript como en Python, lo que permitió el resultado deseado.

5. Los LLM no pueden revertir su código (y cómo revertir)

Si bien ChatGPT es excepcional para escribir código, sigue siendo solo un modelo de lenguaje y no funciona bien para revertir sus propios cambios, especialmente si le pide que revierta y retroceda dos o tres indicaciones.

Cuando trabaje con LLM para generar código en fases, recomiendo encarecidamente que siempre mantenga una copia de la última versión funcional del código con el que está satisfecho; por lo tanto, si algún código nuevo agregado por ChatGPT está dañado y no se puede reparar, puede revertirlo fácilmente a la última vez que funcionó.

Pero hay una trampa: porque si revierte su código, también deberá revertir ChatGPT, para asegurarse de que sepa exactamente cómo se ve su código ahora.

La mejor manera de hacerlo es iniciar una nueva sesión y comenzar con un mensaje como este:

Estoy construyendo una aplicación de chatbot. Aquí está mi código hasta ahora:

HTML:
```
su código HTML
```

JavaScript:
```
su código JavaScript
```

CSS:
```
su código CSS
```

Python:
```
tu código Python
```

Agregue un botón "Guardar sesión" a la izquierda del cuadro de texto. Deberia tener
un icono de disquete. Una vez hecho clic, todos los mensajes en la interfaz de usuario se guardarán en
un archivo JSON llamado "saved_session.json"

También puede cargar los archivos en Code Interpreter de ChatGPT. Si el aviso es demasiado largo para enviarlo como un solo mensaje, divídalo en dos. Haga clic en “Dejar de generar” entre estos mensajes, para evitar que el bot inserte texto innecesario en el medio.

6. No luches por mucho tiempo

Una de las mejores cosas de la codificación con ChatGPT es que si escribe un código roto o el código no funciona según lo previsto, puede enviarle el mensaje de error y corregirá el código en consecuencia.

Pero eso no siempre sucede. A veces, ChatGPT no logra corregir el error o crea otro error en su lugar. Luego le enviamos el nuevo error y le pedimos nuevamente que lo solucione.

Si eso sucede más de dos o tres veces, existe una probabilidad de descenso de que el código esté tan roto o demasiado modificado que simplemente no funcionará. Si ha llegado a ese punto, deténgase, revierta (ver arriba) y reformule su solicitud.

7. Aprende a solicitar

Si bien el objetivo principal de ChatGPT es el hecho de que puedes interactuar con él utilizando el lenguaje cotidiano, saber cómo escribir sus indicaciones correctamente puede tener un efecto inmenso en el resultado.

Realmente recomiendo tomarse el tiempo para aprender a hacerlo. Hay cursos gratuitos de OpenAI y DeepLearning.AI sobre ingeniería de avisos que es imprescindible, y específicamente la lección sobre cómo combinar instrucciones, código y ejemplos en un solo aviso.

Una de las cosas más importantes que puede aprender acerca de las solicitudes es primero asegurarse de que haya una diferencia distinguible entre el texto libre y el código en su solicitud.

Así que en lugar de escribir esto:

Here's a Python function: 
def func(x): 
  return x*2
Change it so it'll return the root of the absolute value of the input if 
it's negative.

Escríbelo así:

Here's a Python function: 
```
def func(x): 
  return x*2
```
Change it so it'll return the root of the absolute value of the input if 
it's negative.

Además, si es posible, bríndele ejemplos de entrada y salida. Ese es el mejor método para explicar un LLM 
lo que debe hacer, ya que elimina cualquier ambigüedad en su solicitud (¿qué debería devolver el modelo si 
la entrada es positiva? ¿Mantenerlo x * 2 o tal vez nada?):

Here's a Python function: 
```
def func(x): 
  return x*2
```
Change it so it'll return the root of the absolute value of the input if 
it's negative.

Examples:
Input: 2, Output: 4
Input: -9, Output: 3

Bonus: Elija el LLM correcto

Recuerda que “ChatGPT” es un nombre del producto web, no del modelo en sí. La versión gratuita le da acceso a GPT-3.5, mientras que la versión de pago incluye GPT-4, que funciona mucho mejor en tareas de codificación. El nuevo Code Interpreter también lo hace mucho mejor, ya que puede ejecutar y probar su código.

Incluso si decide elegir otro LLM para trabajar, asegúrese de que el que elija funcione bien en las tareas de codificación. De lo contrario, ninguno de estos consejos será de ayuda. Creo que lo más importante a tener en cuenta al comunicarse con los LLM es que cada palabra importa.

Los LLM no piensan y no pueden entender realmente lo que queremos sin explicárselo explícitamente de la manera que necesitan, porque , gracias a Dios , no son humanos (¿todavía?), son solo una herramienta.

Y como toda herramienta ,  si no sabes cómo trabajar con ella, no podrás hacer ningún trabajo. ¡Espero que encuentre estos consejos útiles en su próximo proyecto!