{"id":2570,"date":"2026-09-09T21:50:16","date_gmt":"2026-09-09T21:50:16","guid":{"rendered":"https:\/\/margotduek.com\/?post_type=videos&#038;p=2570"},"modified":"2026-09-09T21:50:17","modified_gmt":"2026-09-09T21:50:17","slug":"crear-presentaciones-con-claude-code-sin-canva-powerpoint","status":"publish","type":"videos","link":"https:\/\/margotduek.com\/en\/videos\/crear-presentaciones-con-claude-code-sin-canva-powerpoint\/","title":{"rendered":"Crea presentaciones incre\u00edbles con Claude Code sin usar Canva ni PowerPoint"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Crear una presentaci\u00f3n visualmente impactante normalmente implica invertir mucho tiempo ajustando dise\u00f1os, animaciones, im\u00e1genes y transiciones.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Aunque herramientas como Canva y PowerPoint facilitan el proceso, muchas veces seguimos limitados por plantillas y elementos predise\u00f1ados.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Con inteligencia artificial es posible cambiar completamente este flujo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">En este tutorial mostramos c\u00f3mo crear una presentaci\u00f3n interactiva utilizando Claude Code, HTML y GitHub Pages.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Crear presentaciones con inteligencia artificial<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">La idea principal es dejar de dise\u00f1ar manualmente cada elemento.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">En lugar de abrir una plantilla y modificarla, podemos describir qu\u00e9 queremos crear y permitir que Claude genere la estructura.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Por ejemplo:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Estilo visual<\/li>\n\n\n\n<li>Narrativa<\/li>\n\n\n\n<li>Animaciones<\/li>\n\n\n\n<li>Elementos interactivos<\/li>\n\n\n\n<li>Transiciones<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Claude convierte esa descripci\u00f3n en una presentaci\u00f3n funcional.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00bfPor qu\u00e9 utilizar HTML para una presentaci\u00f3n?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Aunque normalmente pensamos en HTML como una tecnolog\u00eda para p\u00e1ginas web, tambi\u00e9n puede utilizarse para crear presentaciones.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Una presentaci\u00f3n HTML permite agregar:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>animaciones avanzadas;<\/li>\n\n\n\n<li>transiciones personalizadas;<\/li>\n\n\n\n<li>interactividad;<\/li>\n\n\n\n<li>efectos visuales.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Adem\u00e1s, puede publicarse f\u00e1cilmente en internet.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Crear una presentaci\u00f3n desde una idea<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">El primer paso es tener claro qu\u00e9 queremos comunicar.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Si no tienes una idea definida, puedes pedirle ayuda a Claude para desarrollar el concepto.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Puedes indicarle:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>tema;<\/li>\n\n\n\n<li>audiencia;<\/li>\n\n\n\n<li>objetivo;<\/li>\n\n\n\n<li>estilo deseado.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Despu\u00e9s Claude puede ayudarte a crear la estructura y generar la presentaci\u00f3n.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Crear presentaciones desde celular con notas de voz<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Una ventaja interesante de este flujo es que no necesitas estar frente a una computadora todo el tiempo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Puedes darle instrucciones a Claude desde tu celular utilizando voz.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Esto permite capturar ideas r\u00e1pidamente y convertirlas en proyectos visuales.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conectar Claude con GitHub<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Para publicar la presentaci\u00f3n necesitamos un lugar donde pueda vivir el archivo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">GitHub funciona como un repositorio donde guardamos la presentaci\u00f3n creada.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">El flujo es:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Claude crea la presentaci\u00f3n HTML.<\/li>\n\n\n\n<li>Se guarda en GitHub.<\/li>\n\n\n\n<li>GitHub Pages la convierte en una p\u00e1gina p\u00fablica.<\/li>\n\n\n\n<li>Podemos compartir un enlace.<\/li>\n<\/ol>\n\n\n\n<h2 class=\"wp-block-heading\">Crear animaciones y transiciones avanzadas<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Una de las ventajas de crear presentaciones con HTML es la libertad creativa.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Puedes pedir elementos como:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>objetos entrando a pantalla;<\/li>\n\n\n\n<li>movimientos;<\/li>\n\n\n\n<li>efectos cinematogr\u00e1ficos;<\/li>\n\n\n\n<li>cambios de velocidad;<\/li>\n\n\n\n<li>interacciones con clics.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Esto permite crear experiencias que ser\u00edan mucho m\u00e1s complejas en PowerPoint.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Publicar presentaciones con GitHub Pages<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">GitHub Pages permite convertir un repositorio en una p\u00e1gina web p\u00fablica.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Esto significa que una presentaci\u00f3n puede abrirse desde:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>computadora;<\/li>\n\n\n\n<li>celular;<\/li>\n\n\n\n<li>cualquier navegador.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">No necesitas enviar archivos pesados ni preocuparte por compatibilidad.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Personalizar elementos visuales<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Otra ventaja es que puedes modificar elementos espec\u00edficos mediante instrucciones.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Por ejemplo:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>cambiar el cursor;<\/li>\n\n\n\n<li>agregar una imagen;<\/li>\n\n\n\n<li>modificar una animaci\u00f3n;<\/li>\n\n\n\n<li>cambiar una transici\u00f3n.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">No necesitas editar directamente el c\u00f3digo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Puedes explicarle a Claude qu\u00e9 cambio quieres realizar y ajustar el resultado.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">El futuro de las presentaciones con IA<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">La inteligencia artificial est\u00e1 cambiando la forma en la que creamos materiales visuales.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Antes necesitabas dominar herramientas de dise\u00f1o para crear algo atractivo.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ahora la habilidad principal es saber comunicar una idea, dar contexto y utilizar correctamente las herramientas.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Las presentaciones dejan de ser simples diapositivas y pueden convertirse en experiencias interactivas.<\/p>","protected":false},"excerpt":{"rendered":"<p>Crear una presentaci\u00f3n visualmente impactante normalmente implica invertir mucho tiempo ajustando dise\u00f1os, animaciones, im\u00e1genes y transiciones. Aunque herramientas como Canva y PowerPoint facilitan el proceso, muchas veces seguimos limitados por plantillas y elementos predise\u00f1ados. Con inteligencia artificial es posible cambiar completamente este flujo. En este tutorial mostramos c\u00f3mo crear una presentaci\u00f3n interactiva utilizando Claude Code, [&hellip;]<\/p>\n","protected":false},"featured_media":0,"template":"","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_triage_seo_title":"C\u00f3mo crear presentaciones profesionales con Claude Code y HTML","_triage_seo_description":"Aprende a crear presentaciones estilo Canva o PowerPoint usando Claude Code, HTML y GitHub Pages. Agrega animaciones, transiciones y efectos visuales sin dise\u00f1ar manualmente.","_triage_seo_canonical":"","_triage_seo_noindex":""},"class_list":["post-2570","videos","type-videos","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/videos\/2570","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/videos"}],"about":[{"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/types\/videos"}],"version-history":[{"count":1,"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/videos\/2570\/revisions"}],"predecessor-version":[{"id":2571,"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/videos\/2570\/revisions\/2571"}],"wp:attachment":[{"href":"https:\/\/margotduek.com\/en\/wp-json\/wp\/v2\/media?parent=2570"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}