Introducción
La inteligencia artificial (IA) está avanzando a un ritmo acelerado, superando a los humanos en diversos campos como la comprensión lectora, el reconocimiento de imágenes, el entendimiento del lenguaje, el reconocimiento de la escritura y del habla, e incluso en el razonamiento predictivo. Puedes observar la comparación entre el rendimiento humano y el de las IA en diversas tareas en este gráfico interactivo.
Entre los modelos más conocidos de IA se encuentran ChatGPT de OpenAI y Gemini de Google. Sin embargo, junto a estos modelos surgen nuevos competidores que, en tan solo un año, han mejorado significativamente las capacidades de sus predecesores. Un claro ejemplo de esto es Claude, de la compañía Anthropic, que actualmente se posiciona como el modelo más avanzado gracias a su última versión, Claude 3.5 Sonnet. Este modelo, lanzado recientemente, supera prácticamente en todos los aspectos a los modelos más potentes existentes hasta ahora. Uno de los puntos que destaca respecto a sus competidores, es la capacidad de programar código de forma rápida y sencilla.
En este artículo, exploraremos en detalle la plataforma Claude 3.5 Sonnet y veremos cómo puedes aprovecharla para crear diversas aplicaciones de manera sencilla y gratuita.
Claude 3.5 Sonnet
Claude 3.5 Sonnet es la última versión del modelo de inteligencia artificial desarrollado por Anthropic. Este modelo ha demostrado ser superior en varias métricas clave comparado con otros modelos destacados en el mercado. Puedes revisar la tabla comparativa completa en esta página.
Creación de Cuenta en Claude
Antes de comenzar a utilizar Claude 3.5 Sonnet, es necesario crear una cuenta en la plataforma. A continuación, te mostramos cómo hacerlo:
- Registrarse: Visita el sitio web de Claude (https://claude.ai/) y crea una cuenta gratuita.
- Activar “Artifacts”: Una vez registrado, activa la función “Artifacts” en tu cuenta para aprovechar todas las capacidades del modelo.
- Limitaciones diarias: Ten en cuenta que la versión gratuita tiene una limitación diaria de uso, pero es suficiente para realizar muchas tareas diarias, como se demostrará en este tutorial.
Crear una Lista de Tareas
Claude 3.5 Sonnet puede ayudarte a crear aplicaciones funcionales con tan solo unos pocos comandos. Aquí te mostramos cómo crear una aplicación de lista de tareas (To-Do List) minimalista y moderna:
Prompt:
Crea una app de to-do list minimalista, moderna y con un UX muy bien trabajado. Haz la app funcional con los códigos HTML, CSS y JS.Puedes encontrar un ejemplo completo de este tipo de aplicación en este enlace.
Interacción con Documentos (PDFs)
Otra capacidad impresionante de Claude 3.5 Sonnet es la interacción con documentos. Puedes crear un panel interactivo a partir de un PDF que te permita visualizar y aprender la información de una manera más atractiva.
Prompt:
Crea un panel interactivo con la información del PDF para ayudarme a ver, probar y aprender esta información de una manera más atractiva visualmente. Añade una pestaña para gráficos que muestren los ejemplos y también otra pestaña de preguntas donde puedo probar mis conocimientos con un cuestionario de 10 preguntas basado en la información del PDF.Aplicación de Detección de Objetos en Tiempo Real
Claude 3.5 Sonnet también permite crear aplicaciones complejas como una aplicación de detección de objetos en tiempo real utilizando TensorFlow.js y el modelo COCO-SSD.
Prompt:
Cree un único archivo HTML para una aplicación web de detección de objetos en tiempo real utilizando TensorFlowjs y el modelo COCO-SSD. La solicitud debe:
1. Acceder a la cámara web del usuario y mostrar la transmisión de video.
2. Realizar la detección de objetos en la transmisión de video en tiempo real.
3. Dibujar cuadros delimitadores alrededor de los objetos detectados y etiquetarlos con su clase y confianza de detección.
4. Mostrar una lista de objetos detectados de forma única debajo de la transmisión de video, mostrando la clase de objeto y la hora en que se detectó por primera vez.
5. Asegurarse de que cada clase de objeto solo aparezca una vez, independientemente de cuántas veces se detecte.
6. Utilizar una frecuencia de detección de 2 FPS para equilibrar el rendimiento y la capacidad de respuesta.
7. Incluir manejo de errores para el acceso a la cámara y la carga del modelo.
8. Diseñar la aplicación para darle una apariencia limpia y moderna con un diseño responsivo.
9. Incluir todo el HTML, CSS y JavaScript necesarios en un archivo único e independiente que se puede ejecutar abriéndolo en un navegador web.
10. Utilizar enlaces CDN para las bibliotecas de modelos TensorFlow.js y COCO-SSD.Análisis Visual
Claude 3.5 Sonnet también puede analizar hojas de cálculo de manera visual e interactiva, generando gráficos e insights valiosos. Simplemente hará falta adjuntar el archivo .csv y el prompt de abajo.
Prompt:
Analízame de forma visual e interactiva esta hoja de cálculos, poniendo gráficas e insights.Puedes probar con archivos CSV de diferentes tamaños para observar los resultados.
Crear Modelos en 3D
Con Claude 3.5 Sonnet, puedes crear simulaciones 3D utilizando WebGL. A continuación, se muestra el ejemplo de cómo crear una página web que simule un modelo 3D interactivo varias bolas rebotando en un cubo grande.
Prompt:
Cree una página web que sea una simulación 3D utilizando WebGL que muestre varias bolas rebotando en un cubo grande. Exponer controles para la actualización:
- Número de bolas
- Gravedad
- Tamaño del cubo
Tenga en cuenta que si algo de lo siguiente no se puede realizar sin importar three.js OrbitControls, omita agregar esas funciones y tenga en cuenta que las está omitiendo.
## Interacciones del usuario
- Al hacer clic y arrastrar, el mundo 3D girará relativamente rápido, como si el mouse realmente lo estuviera moviendo.
- Al girar el mundo 3D, las bolas deben respetar la dirección del giro para que se muevan dentro del cubo de forma realista.
- Incluye un botón "Rebotar" que hará rebotar todas las bolas en el cubo usando la configuración actual, dándoles a todas las bolas una nueva dirección y velocidad aleatorias.
## Consideraciones de la interfaz de usuario
- Dar estilos limpios a la interfaz de usuario.
- Los controles deben estar en la parte superior izquierda y usar controles deslizantes de color rosa.
## Consideraciones mundiales
- Supongamos que el suelo tiene fricción, de modo que cuando una bola rueda por él, se frena.
- Las bolas deben frenar un poco cuando golpean la pared o el suelo.
- El cubo debe ser de color verde neón brillante.
- Las bolas deben usar una paleta de colores neón punk.
Recuerda lo siguiente:
- Si alguna de las siguientes opciones no se puede realizar sin importar three.js OrbitControls, omita agregar esas funciones y tenga en cuenta que las está omitiendo.
- Este es un mundo 3D, si "haces girar el mundo", todo en el mundo debería girar al mismo tiempo, respetando el espacio 3D, incluidos el cubo y las bolas.
- Sea conciso con su codificación, solo tiene una cierta cantidad de código que puede caber en este archivo
- Girar el cubo debe ser rápido, como si mi mouse estuviera girando el cubo.Creación de Juegos
Claude 3.5 Sonnet también permite la creación de juegos complejos. A continuación, se presentan algunos ejemplos de juegos que puedes desarrollar:
Juego Shooter 3D:
Puedes crear un juego shooter 3D utilizando múltiples prompts para obtener un resultado final impresionante. Encuentra más información en este enlace: https://x.com/ammaar/status/1804650588946194613
Juego de Ajedrez:
Puedes desarrollar un juego de ajedrez funcional con todas las reglas del juego implementadas.
Prompt:
Crea el código HTML, CSS y JS para un juego funcional de ajedrez para dos personas. Las piezas del juego han de moverse según las reglas de ajedrez, por lo que muestra previo al movimiento, las direcciones que puede hacer cada pieza al clicar sobre una de ellas. Posteriormente el usuario al clicar el movimiento que quiere, la pieza se moverá hacia esa ubicación para poder seguir el juego. Añade un pequeño cronómetro fuera del tablero para ver cuánto tarda cada usuario en elegir su movimiento.Puedes revisar un ejemplo en este enlace.
Aplicación de Recetas
Otra aplicación interesante es una app más compleja que podamos crear paso a paso, incluso indicándole por imágenes como nos gustaría que sea, como el ejemplo visto de la app de recetas saludables para smartphones. A continuación, se muestra el propmt usado en el vídeo.
Haz una app funcional para smartphones de recetas saludables para personas fitness. Para ello la app de incluir: 1) Un área de unicio con las comidas recomendadas para el día de hoy dividido entre el desayuno, comida y cena. 2) Cada receta debe poder cambiarse por otra o marcarla como que se ha complicdo la comida. 3) al clicar sobre la receta hay que expandir la información con los ingredientes y pasos para poder realizar la receta. 4) En el mismo área de iniciodebe salir el progreso de las comidas cumplicadas, kcal consumidas y macronutritientes, con los objetivos dependiendo que quiera el usuario. 5) Además del área de inicio, debes añadir otros como un buscador de recetas, una pestaña de recetas guardadas, otra opción de comunidad y un área de usuario.Conclusión
Aquí hemos estado creado en cuestión de minutos varias aplicaciones, que hace un tiempo, incluso a un programador profesional, le podría haber llevado días. Como estamos viendo ahora podemos crear practicamente cualquier cosa de forma cada vez más sencilla. Ahora, el único límite es dar el primer paso para convertir tus ideas en una nueva realidad.
