Claude in Chrome: automatización desde la web
Contenido del curso
Claude in Chrome: automatización desde la web
Contenido del curso
Boris Turcios
Marco Aurelio
🤖 CLAUDE COWORK 📚 CLASE: CLAUDE IN CHROME — AUTOMATIZA TAREAS DESDE EL NAVEGADOR ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🎯 IDEA PRINCIPAL ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Claude in Chrome permite que Claude NO solamente lea información de Internet. También puede INTERACTUAR CON LAS PÁGINAS WEB. Claude puede: 🌐 Abrir páginas 👀 Leer contenido 🖱️ Hacer clic ⌨️ Escribir 📝 Completar formularios 🔎 Navegar entre páginas 📊 Extraer información 📑 Trabajar con diferentes pestañas Esto convierte al navegador en una herramienta que Claude puede utilizar para ejecutar tareas. 🧠 IDEA CLAVE: ANTES: 👤 YO → NAVEGO → BUSCO → COPIO → PEGO → PROCESO CON CLAUDE: 👤 YO → EXPLICO LA TAREA ↓ 🤖 CLAUDE NAVEGA ↓ 🔎 BUSCA ↓ 📝 EJECUTA ↓ 📄 ENTREGA RESULTADO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🧠 MEMOTECNIA PRINCIPAL ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🌐 "LEE → CLIC → ESCRIBE → EJECUTA" LEE → Claude puede leer páginas. CLIC → Puede interactuar con botones y enlaces. ESCRIBE → Puede introducir información. EJECUTA → Puede completar un flujo de trabajo. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣ ¿QUÉ ES CLAUDE IN CHROME? ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Claude in Chrome es una extensión que permite a Claude trabajar directamente dentro del navegador Chrome. En lugar de simplemente decir: "Busca información sobre X." podemos pedir: "Busca X, entra a estas páginas, compara la información y prepara un informe." Claude puede interactuar con las páginas para completar el trabajo. 📌 Actualmente Claude in Chrome está disponible en los planes de pago de Claude. :contentReference[oaicite:1]{index=1} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 2️⃣ CLAUDE NO SOLO OBSERVA... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Esta es una diferencia fundamental. Un buscador: 🔎 ENCUENTRA INFORMACIÓN. Claude tradicional: 💬 GENERA UNA RESPUESTA. Claude in Chrome: 🤖 PUEDE INTERACTUAR CON LA WEB. Puede: → Entrar a una página → Buscar información → Hacer clic → Navegar → Escribir → Completar formularios → Trabajar con varias páginas 🧠 MEMOTECNIA: "CLAUDE IN CHROME = OJOS + MANOS EN EL NAVEGADOR" ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 3️⃣ EJEMPLO SENCILLO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Supongamos que necesitamos investigar el precio de un producto. ANTES: 1. Abrir Google. 2. Buscar producto. 3. Abrir tiendas. 4. Copiar precios. 5. Comparar. 6. Crear una tabla. 😓 MUCHOS PASOS MANUALES. CON CLAUDE: "Busca el producto X en estas tiendas, compara precios y prepara una tabla con producto, precio y disponibilidad." Claude puede realizar la navegación y recopilar la información. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 4️⃣ AUTOMATIZAR UN FLUJO COMPLETO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Lo importante no es solamente automatizar UN CLIC. Podemos delegar una SECUENCIA COMPLETA. Ejemplo: 🌐 ENTRAR A SITIO ↓ 🔎 BUSCAR PRODUCTO ↓ 👀 LEER INFORMACIÓN ↓ 📋 COPIAR DATOS ↓ 📊 COMPARAR ↓ 📄 CREAR REPORTE Eso convierte al navegador en parte de un flujo de trabajo de Cowork. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 5️⃣ EJEMPLO: FORMULARIOS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Supongamos que debemos llenar un formulario repetitivo. Normalmente: 👤 Abrir página ↓ 👤 Buscar formulario ↓ 👤 Escribir datos ↓ 👤 Seleccionar opciones ↓ 👤 Enviar Con Claude in Chrome: 🤖 Claude puede: → Abrir el formulario → Identificar campos → Escribir información → Seleccionar opciones → Completar el proceso ⚠️ IMPORTANTE: Las acciones que puedan tener consecuencias importantes deben revisarse cuidadosamente. Claude tiene mecanismos de seguridad y puede pedir autorización antes de determinadas acciones. :contentReference[oaicite:2]{index=2} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 6️⃣ CLAUDE + PESTAÑAS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Una de las ventajas importantes es trabajar con información distribuida en diferentes páginas. Ejemplo: Pestaña 1: 📊 Dashboard de ventas Pestaña 2: 📦 Inventario Pestaña 3: 💰 Precios Pestaña 4: 📈 Competencia Claude puede trabajar con información de diferentes páginas para construir un resultado más completo. 🧠 MEMOTECNIA: "VARIAS PESTAÑAS → UN SOLO RESULTADO" ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 7️⃣ EJEMPLO PARA ZONA DIGITAL ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔥 CASO PRÁCTICO: Queremos investigar precios de consolas. Claude podría: 1️⃣ Entrar a diferentes tiendas. 2️⃣ Buscar PS5. 3️⃣ Obtener precios. 4️⃣ Obtener disponibilidad. 5️⃣ Comparar modelos. 6️⃣ Organizar los datos. 7️⃣ Crear un reporte. RESULTADO: 📊 COMPARATIVA DE MERCADO Producto | Precio | Disponibilidad PS5 | $XXX | Disponible PS5 Slim | $XXX | Disponible PS5 Pro | $XXX | Agotado ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 8️⃣ EJEMPLO PARA UN ABOGADO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Un abogado podría utilizar Claude in Chrome para tareas de investigación web. Por ejemplo: "Revisa determinadas fuentes jurídicas, localiza información relacionada con este tema, organiza los resultados y prepara un resumen." FLUJO: 🌐 FUENTES ↓ 🔎 BÚSQUEDA ↓ 📄 LECTURA ↓ 📊 ORGANIZACIÓN ↓ 📝 RESUMEN ↓ 👨⚖️ REVISIÓN HUMANA ⚠️ La información jurídica generada por IA debe verificarse antes de utilizarse profesionalmente. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 9️⃣ CLAUDE IN CHROME + COWORK ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔥 ESTA ES UNA DE LAS IDEAS MÁS IMPORTANTES. Claude in Chrome puede encargarse de la parte WEB. Claude Cowork puede encargarse del TRABAJO COMPLETO. Ejemplo: 🌐 CHROME → Investiga y recopila información. ⬇️ 🤖 COWORK → Analiza la información. ⬇️ 📊 COWORK → Crea una hoja de cálculo. ⬇️ 📄 COWORK → Genera un informe. Anthropic describe precisamente este flujo: Chrome puede recopilar información de la web y Cowork puede convertirla en entregables como informes, modelos de Excel o presentaciones. :contentReference[oaicite:3]{index=3} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔟 CLAUDE IN CHROME + SKILLS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Aquí conectamos con la clase anterior. Recordemos: 🧩 SKILL = enseña a Claude CÓMO realizar un tipo de trabajo. 🌐 CHROME = le permite interactuar con la WEB. Entonces: 🧩 SKILL + 🌐 CHROME = 🤖 FLUJO ESPECIALIZADO EN LA WEB Ejemplo: Skill: "Analizar precios de productos." Claude in Chrome: "Buscar esos precios en diferentes sitios." Resultado: 📊 REPORTE AUTOMÁTICO DE PRECIOS. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣1️⃣ CLAUDE IN CHROME + TAREAS PROGRAMADAS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔥 AQUÍ APARECE UNA COMBINACIÓN MUY POTENTE. Recordemos: SKILL → CÓMO hacerlo. CHROME → DÓNDE hacerlo. TAREA PROGRAMADA → CUÁNDO hacerlo. Entonces: 🧩 SKILL + 🌐 CHROME + ⏰ PROGRAMACIÓN = 🚀 AUTOMATIZACIÓN Ejemplo: Todos los lunes a las 8:00 AM: ⏰ INICIA ↓ 🌐 VISITA SITIOS ↓ 🔎 BUSCA PRECIOS ↓ 📊 COMPARA ↓ 📄 CREA REPORTE ↓ 👤 YO REVISO Claude in Chrome permite programar tareas recurrentes del navegador, incluyendo frecuencias diarias, semanales, mensuales o anuales. :contentReference[oaicite:4]{index=4} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣2️⃣ GRABAR UN FLUJO DE TRABAJO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ En la experiencia clásica del panel lateral, Claude in Chrome también permite registrar un flujo: 🎥 GRABAR 1. Iniciar grabación. 2. Realizar los pasos. 3. Detener grabación. 4. Guardar el flujo. 5. Reutilizarlo posteriormente. Esto permite enseñar a Claude una secuencia repetitiva de acciones. 📌 IMPORTANTE: La función de grabación pertenece al panel lateral clásico y no está disponible cuando el panel funciona como una sesión de Cowork. :contentReference[oaicite:5]{index=5} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣3️⃣ AUTOMATIZACIÓN DE TAREAS REPETITIVAS ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Una excelente candidata para automatizar es una tarea que: ✅ Se repite. ✅ Tiene pasos similares. ✅ Utiliza páginas conocidas. ✅ Tiene un resultado definido. ✅ Podemos revisar. Ejemplo: TODOS LOS VIERNES: 🌐 Entrar al dashboard. ↓ 📊 Obtener métricas. ↓ 📈 Comparar semana anterior. ↓ 📝 Crear resumen. ↓ 📧 Preparar reporte. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣4️⃣ SEGURIDAD: MUY IMPORTANTE ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🚨 Claude in Chrome tiene acceso para interactuar con páginas web. Eso significa que debemos tener cuidado. Riesgos: ⚠️ Información confidencial. ⚠️ Datos personales. ⚠️ Cuentas financieras. ⚠️ Acciones irreversibles. ⚠️ Instrucciones maliciosas dentro de páginas. ⚠️ Prompt injection. Una página web puede contener instrucciones diseñadas para intentar desviar al agente. Por eso: 🔐 UTILIZAR SITIOS DE CONFIANZA. 👀 SUPERVISAR ACCIONES IMPORTANTES. 🛑 DETENER EL PROCESO SI ALGO PARECE EXTRAÑO. Anthropic advierte específicamente sobre los riesgos de prompt injection y recomienda tener especial cuidado con información sensible y sitios de alto impacto. :contentReference[oaicite:6]{index=6} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣5️⃣ CLAUDE IN CHROME VS NAVEGADOR PROPIO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Actualmente Claude puede utilizar la web de dos maneras dentro de Cowork: 🌐 NAVEGADOR INTEGRADO → Claude utiliza su propio navegador dentro de Claude Desktop. 🟦 CLAUDE IN CHROME → Claude utiliza tu navegador Chrome mediante la extensión. Diferencia principal: NAVEGADOR INTEGRADO → Claude trabaja en su propio navegador. CLAUDE IN CHROME → Claude trabaja sobre tu navegador, con las páginas y cuentas que tienes abiertas. Anthropic permite elegir el navegador preferido desde Settings → Cowork → Preferred browser. :contentReference[oaicite:7]{index=7} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 1️⃣6️⃣ ¿CUÁNDO USAR CLAUDE IN CHROME? ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Es especialmente útil cuando: 🌐 La información está en una página web. 📝 Hay que completar formularios. 🖱️ Hay que hacer clic en diferentes elementos. 📊 Hay dashboards que no tienen conector. 🏢 Hay sistemas internos o portales antiguos. 📋 Hay que recopilar información de varias páginas. 🔄 Hay un proceso web repetitivo. Anthropic destaca precisamente su utilidad para dashboards, portales internos, herramientas sin conector y tareas que requieren interacción directa con páginas. :contentReference[oaicite:8]{index=8} ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🧠 LAS 4 D + CHROME ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ Esta clase también se conecta con las 4 D de Anthropic: 1️⃣ DELEGACIÓN ¿Qué tarea web voy a darle a Claude? 2️⃣ DESCRIPCIÓN ¿Cómo explico exactamente el proceso? 3️⃣ DISCERNIMIENTO ¿Cómo verifico lo que hizo? 4️⃣ DILIGENCIA ¿Qué riesgos existen y qué responsabilidad tengo sobre el resultado? 🔥 EJEMPLO: DELEGACIÓN → "Revisa estos sitios." DESCRIPCIÓN → "Busca precio, modelo y disponibilidad." DISCERNIMIENTO → "Compara los resultados y verifica datos." DILIGENCIA → "No realices compras ni acciones irreversibles sin mi autorización." ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔄 FLUJO COMPLETO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🎯 OBJETIVO ↓ 🤖 DELEGACIÓN ↓ 📝 DESCRIPCIÓN ↓ 🧩 SKILL ↓ 🌐 CLAUDE IN CHROME ↓ 🔎 NAVEGA ↓ 🖱️ INTERACTÚA ↓ 📊 RECOPILA ↓ 🤖 PROCESA ↓ 🔍 DISCERNIMIENTO ↓ 🛡️ DILIGENCIA ↓ 📄 RESULTADO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🔥 MEMOTECNIA DEFINITIVA ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🌐 CHROME = "VER Y HACER" 🧩 SKILL = "SABER CÓMO" ⏰ PROGRAMACIÓN = "SABER CUÁNDO" 🤖 COWORK = "COORDINAR EL TRABAJO" FÓRMULA: CHROME + SKILL + COWORK + PROGRAMACIÓN = 🚀 AUTOMATIZACIÓN WEB ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 📌 RESUMEN ULTRA RÁPIDO ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🌐 CLAUDE IN CHROME = Claude puede interactuar directamente con páginas web. 👀 LEER = analizar contenido. 🖱️ HACER CLIC = interactuar con elementos. ⌨️ ESCRIBIR = completar campos. 🔎 NAVEGAR = desplazarse entre páginas. 📋 RECOPILAR = extraer información. 🧩 SKILL = metodología especializada. ⏰ PROGRAMACIÓN = ejecución automática. 🤖 COWORK = coordina tareas complejas. ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ 🎯 FRASE PARA RECORDAR ━━━━━━━━━━━━━━━━━━━━━━━━━━━━ "ANTES YO USABA EL NAVEGADOR. AHORA PUEDO ENSEÑARLE A CLAUDE A USAR EL NAVEGADOR CONMIGO." 🔥 CONCEPTO FINAL: CLAUDE IN CHROME NO ES SOLAMENTE UN CHAT DENTRO DEL NAVEGADOR. ES UNA CAPACIDAD PARA DELEGAR TRABAJO REAL SOBRE LA WEB: LEER → NAVEGAR → HACER CLIC → ESCRIBIR → RECOPILAR → PROCESAR → ENTREGAR. 🧠 Y LA GRAN FÓRMULA DE CLAUDE COWORK: SKILL = CÓMO CHROME = DÓNDE PROGRAMACIÓN = CUÁNDO COWORK = COORDINACIÓN HUMANO = SUPERVISIÓN Y RESPONSABILIDAD
waos, si alguien es tan flojo como para no ver a donde va... ignora lo anterior, te cuento, una vez una pareja le apareció un lugar inventado con IA en facebook y así no más decidieron que esas serían sus nuevas vacaciones... que extraño que fue haber llegado a un sitio que no tiene nada... literalmente nada era un cerro cualquiera de Grecia... si eres así no hay curso ni app que te pueda ayudar :L
