80 HORAS
Domina el diseño web y la implementación sin necesidad de tener conocimientos de programación. Domina el uso de Figma, Elementor y WordPress para aprender a diseñar e implementar todo tipo de páginas web funcionales.
De unos años a esta parte, Figma se ha establecido como la herramienta de prototipado web más utilizada gracias a su interfaz intuitiva, a sus herramientas de colaboración y a los avances más actuales en relación a la Inteligencia Artificial. Al mismo tiempo, Elementor con WordPress han ganado mucho terreno también en el ámbito de la implementación web NoCode, Elementor es un plugin de WordPress para crear sitios web de forma sencilla mediante el sistema drag and drop.
El objetivo del Máster Diseño Web & IA es unir estas herramientas, WordPress, Figma y Elementor con la Inteligencia Artificial para crear nuestras páginas web funcionales. Con Figma podemos diseñar de forma completa todo tipo de sitios web que podremos llevar a cabo con Elementor en WordPress con una gran variedad de funcionalidades para enfocar cada una a nuestras necesidades.
La unión de estas tres herramientas junto con la IA nos dará, por un lado, grandes conocimientos y habilidad para diseñar y crear páginas web. Por otro lado, conseguiremos que, al utilizar también la IA, optimicemos nuestros tiempos de trabajo, mejoremos nuestra productividad, generemos contenido de forma sencilla o nos ayude en las diferentes tareas de diseño. Unir estas herramientas con el poder que nos aporta la IA nos ayudará a crear un trabajo mucho más avanzado e interesante, consiguiendo que creemos sitios web más seguros y enfocados a las nuevas tendencias que surgen.
Módulo 1: WordPress + IA
Tema 1. Introducción
- org vs wordpress.com
- Características principales de wordpress
- Cómo funciona wordpress
- Creación y gestión de contenido
- Personalización
- Tipos de sitios de wordpress
- Ventajas de wordpress
- Desventajas de wordpress
- Recursos útiles para aprender wordpress
Tema 2. Instalación y configuración
- Instalación en local
- Configuración inicial de wordpress
- Ajustes generales
- Ajustes de escritura
- Ajustes de lectura
- Comentarios
- Medios
- Usuarios y roles
- Importar y exportar contenido
- Herramientas
- Enlaces permanentes
- Instalación de plugins
- Optimización del rendimiento en wordpress
Tema 3. La inteligencia artificial
- Introducción a la inteligencia artificial
- Qué es chatgpt
- Funcionalidades de chatgpt que deben conocer
- Cómo escribir en chatgpt para sacarle el máximo partido
- Generar textos de calidad con chatgpt
- Plugins de wordpress para generar contenido con ia
Tema 4. Widgets
- Ubicación de los widgets
- Gestión de widgets en wordpress
- Widgets personalizados y plugins
Tema 5. Los temas
- ¿qué es un tema de wordpress?
- Temas clásicos vs. Temas de bloques (fse)
- Comprar e instalar temas profesionales
- Archivos que componen un tema
- Temas clásicos vs temas de bloques
- Personalizar tema clásico
Tema 6. Full site editing
- Ventajas del editor de wordpress
- La interfaz del editor de sitio
- Navegación
- Plantillas
- Estilos globales y configuración del sitio
- Los patrones
- Añadiendo bloques
- El menú flotante de bloque
- Vista de lista
- El panel de opciones o ajustes de bloque
- Crear y maquetar contenido con bloques
Tema 7. Crear un tema hijo
- Crear un tema hijo
Tema 8. Creación de contenido
- Entradas o post
- Cómo aprovechar la inteligencia artificial
- Etiquetas en wordpress
- Crear categorías y etiquetas con ia
- El extracto o excerpt
- Las revisiones:
- La edición por lotes
- Las páginas en wordpress
Tema 9. Plugins
- Importancia de los plugins en wordpress
Tema 10. Multimedia
- Tipos de archivos multimedia
- Formatos de imagen
- Cómo añadir imágenes
- Qué pasa cuando subimos una imagen a wordpress
- Añadir video
- Añadir audio
Tema 11. Seo
- Qué es el seo
- Glosario de seo
- Diferencia entre seo on-page y off-page
- Cómo funcionan los motores de búsqueda
- Fundamentos del seo para wordpress
- Configuración inicial de nuestro sitio
- Temas y plugins amigables con el seo
- Seo on-page en wordpress
- Optimización de imágenes
- Linkbuilding
- Seo técnico en wordpress
- Seo móvil
- Herramientas de seo imprescindibles
- Generar contenido con ia
Tema 12. Backup
- Tipos de backups
- Almacenamiento de backups
- Restauración de un sitio desde un backup
Tema 13. Migrar un sitio wordpress
- Resolución de problemas comunes
Tema 14. Seguridad en wordpress
- Medidas preventivas clave
- Seguridad en el entorno de hosting
- Implementación de ssl/https
- Escaneo y eliminación de malware
- Limpieza de la base de datos
- Monitoreo de la salud del sitio
Tema 15. Contratar un hosting
- Glosario de términos de hosting
- Cómo contratar un servicio de hosting web
- Ejemplos de hosting en españa
Módulo 2: Figma
TEMA 1. PRESENTACIÓN
- ¿Qué es Figma?
TEMA 2. INTRODUCCIÓN A FIGMA
- Introducción
- Registro, creación de un grupo y un proyecto
- La interfaz de Figma
TEMA 3. HERRAMIENTAS BÁSICAS
- Frame
- Section & Slice
- Move & Scale
- Herramienta de forma
- Herramienta de texto
- Paint Bucket Tool
- Alineación y cambios de tamaño
TEMA 4. DISTRIBUIR Y ORDENAR
- Alineación
- Ordenar
TEMA 5.BOOLEANAS
- Trabajo en equipo: Colaboración en tiempo real y comentarios.
- Versiones e historial: Gestión de versiones y control de cambios.
- Compartir y exportar: Opciones de exportación y métodos para compartir diseños.
TEMA 6. PLUGINS Y RECURSOS ADICIONALES
- ¿Qué son las operaciones booleanas?
- Radio de esquina
- Creación de formas avanzadas
- Modos de fusión de capa
- Efectos
- Creando iconos
TEMA 7. IMÁGENES EN FIGMA
- Formatos de la web recomendados
- Opciones
- Importar imágenes a Figma
- Colocar imágenes en una forma
- Colocar imagen de fondo
- Modificar propiedades de las imágenes
- Tipos de relleno
- Plugin recomendados y galerías de imágenes libres
- Recursos de imágenes con IA
TEMA 8. COLOR EN FIGMA
- Introducción
- Color Picker Tool
- Modos de fusión
- Estilos de color
- Tipos de relleno
- Aplicación de degradados
- Recursos»
TEMA 9. AUTOLAYOUT EN FIGMA
- Introducción
- Autolayout en Figma
- Características principales de Autolayout
- Anidar Autolayouts
- Beneficios de usar Autolayout
TEMA 10. COMPONENTES EN FIGMA
- Componentes en Figma
- Visión general de los componentes
- Pasos para crear un componente
TEMA 11. PROTOTIPADO
- Introducción
- Prototipado
- Cómo prototipo en Figma
- Crear conexiones
- Para visualizar y testar el prototipo
- Smart Animate
- Transformaciones
- Operaciones y trucos
- Conclusión
Módulo 3: Elementor
TEMA 1. INTRODUCCIÓN A ELEMENTOR
- Introducción
- Requisitos previos: Instalación y configuración inicial
TEMA 2. PRIMEROS PASOS CON ELEMENTOR
- Introducción
- Creación de una página básica
- Ajustes
- Plantillas
TEMA 3. ELEMENTOS BÁSICOS DE DISEÑO
- Herramientas
TEMA 4. WIDGETS
- Introducción
- Widgets
TEMA 5. ESTRUCTURACIÓN DEL CONTENIDO
- Introducción
- Contenedores
- Gestión de plantillas y reutilización de elementos
TEMA 6. DISEÑO AVANZADO DE ELEMENTOR PRO
- Introducción
- Creando partes específicas
TEMA 7. ELEMENTOR CON IA
- Introducción
- Visión general
- Funcionalidades
TEMA 8. DISEÑO RESPONSIVE
- Introducción
- Diseñando páginas con Elementor
- Aspectos a tener en cuenta
TEMA 9. OPTIMIZACIÓN Y RENDIMIENTO
- Introducción
- Técnicas de optimización para mejorar la velocidad de carga
- Buenas prácticas para la creación del contenido
- Herramientas adicionales para mejorar el rendimiento
FORMACIÓN BONIFICADA
Acompañamiento experto, seguimiento personalizado y apoyo continuoBonificable para Empleados
Ejercicios prácticos
Título propio Digital Credential
Inicio Tutorizado: convocatorias mensuales
Inicio Autoestudio: Inmediato
Dirigido a diseñadores gráficos, diseñadores UI/UX, desarrolladores web, product managers, marketers digitales y freelancers que desean adquirir habilidades avanzadas en diseño web y la integración de inteligencia artificial. También es ideal para estudiantes y profesionales que buscan mejorar sus competencias en herramientas como WordPress, Figma y Elementor, así como en la implementación de soluciones innovadoras en el diseño de interfaces y la experiencia del usuario.
Tener conocimientos básicos de diseño gráfico y desarrollo web, incluyendo el uso de CMS como WordPress y fundamentos de HTML y CSS. También es útil tener experiencia con herramientas de diseño digital como Figma, así como un interés en la integración de la inteligencia artificial en proyectos web. Además, es necesario contar con habilidades informáticas generales para manejar el software y gestionar archivos de manera eficiente.
PRESENTACIÓN
De unos años a esta parte, Figma se ha establecido como la herramienta de prototipado web más utilizada gracias a su interfaz intuitiva, a sus herramientas de colaboración y a los avances más actuales en relación a la Inteligencia Artificial. Al mismo tiempo, Elementor con WordPress han ganado mucho terreno también en el ámbito de la implementación web NoCode, Elementor es un plugin de WordPress para crear sitios web de forma sencilla mediante el sistema drag and drop.
El objetivo del Máster Diseño Web & IA es unir estas herramientas, WordPress, Figma y Elementor con la Inteligencia Artificial para crear nuestras páginas web funcionales. Con Figma podemos diseñar de forma completa todo tipo de sitios web que podremos llevar a cabo con Elementor en WordPress con una gran variedad de funcionalidades para enfocar cada una a nuestras necesidades.
La unión de estas tres herramientas junto con la IA nos dará, por un lado, grandes conocimientos y habilidad para diseñar y crear páginas web. Por otro lado, conseguiremos que, al utilizar también la IA, optimicemos nuestros tiempos de trabajo, mejoremos nuestra productividad, generemos contenido de forma sencilla o nos ayude en las diferentes tareas de diseño. Unir estas herramientas con el poder que nos aporta la IA nos ayudará a crear un trabajo mucho más avanzado e interesante, consiguiendo que creemos sitios web más seguros y enfocados a las nuevas tendencias que surgen.
CONTENIDO
Módulo 1: WordPress + IA
Tema 1. Introducción
- org vs wordpress.com
- Características principales de wordpress
- Cómo funciona wordpress
- Creación y gestión de contenido
- Personalización
- Tipos de sitios de wordpress
- Ventajas de wordpress
- Desventajas de wordpress
- Recursos útiles para aprender wordpress
Tema 2. Instalación y configuración
- Instalación en local
- Configuración inicial de wordpress
- Ajustes generales
- Ajustes de escritura
- Ajustes de lectura
- Comentarios
- Medios
- Usuarios y roles
- Importar y exportar contenido
- Herramientas
- Enlaces permanentes
- Instalación de plugins
- Optimización del rendimiento en wordpress
Tema 3. La inteligencia artificial
- Introducción a la inteligencia artificial
- Qué es chatgpt
- Funcionalidades de chatgpt que deben conocer
- Cómo escribir en chatgpt para sacarle el máximo partido
- Generar textos de calidad con chatgpt
- Plugins de wordpress para generar contenido con ia
Tema 4. Widgets
- Ubicación de los widgets
- Gestión de widgets en wordpress
- Widgets personalizados y plugins
Tema 5. Los temas
- ¿qué es un tema de wordpress?
- Temas clásicos vs. Temas de bloques (fse)
- Comprar e instalar temas profesionales
- Archivos que componen un tema
- Temas clásicos vs temas de bloques
- Personalizar tema clásico
Tema 6. Full site editing
- Ventajas del editor de wordpress
- La interfaz del editor de sitio
- Navegación
- Plantillas
- Estilos globales y configuración del sitio
- Los patrones
- Añadiendo bloques
- El menú flotante de bloque
- Vista de lista
- El panel de opciones o ajustes de bloque
- Crear y maquetar contenido con bloques
Tema 7. Crear un tema hijo
- Crear un tema hijo
Tema 8. Creación de contenido
- Entradas o post
- Cómo aprovechar la inteligencia artificial
- Etiquetas en wordpress
- Crear categorías y etiquetas con ia
- El extracto o excerpt
- Las revisiones:
- La edición por lotes
- Las páginas en wordpress
Tema 9. Plugins
- Importancia de los plugins en wordpress
Tema 10. Multimedia
- Tipos de archivos multimedia
- Formatos de imagen
- Cómo añadir imágenes
- Qué pasa cuando subimos una imagen a wordpress
- Añadir video
- Añadir audio
Tema 11. Seo
- Qué es el seo
- Glosario de seo
- Diferencia entre seo on-page y off-page
- Cómo funcionan los motores de búsqueda
- Fundamentos del seo para wordpress
- Configuración inicial de nuestro sitio
- Temas y plugins amigables con el seo
- Seo on-page en wordpress
- Optimización de imágenes
- Linkbuilding
- Seo técnico en wordpress
- Seo móvil
- Herramientas de seo imprescindibles
- Generar contenido con ia
Tema 12. Backup
- Tipos de backups
- Almacenamiento de backups
- Restauración de un sitio desde un backup
Tema 13. Migrar un sitio wordpress
- Resolución de problemas comunes
Tema 14. Seguridad en wordpress
- Medidas preventivas clave
- Seguridad en el entorno de hosting
- Implementación de ssl/https
- Escaneo y eliminación de malware
- Limpieza de la base de datos
- Monitoreo de la salud del sitio
Tema 15. Contratar un hosting
- Glosario de términos de hosting
- Cómo contratar un servicio de hosting web
- Ejemplos de hosting en españa
Módulo 2: Figma
TEMA 1. PRESENTACIÓN
- ¿Qué es Figma?
TEMA 2. INTRODUCCIÓN A FIGMA
- Introducción
- Registro, creación de un grupo y un proyecto
- La interfaz de Figma
TEMA 3. HERRAMIENTAS BÁSICAS
- Frame
- Section & Slice
- Move & Scale
- Herramienta de forma
- Herramienta de texto
- Paint Bucket Tool
- Alineación y cambios de tamaño
TEMA 4. DISTRIBUIR Y ORDENAR
- Alineación
- Ordenar
TEMA 5.BOOLEANAS
- Trabajo en equipo: Colaboración en tiempo real y comentarios.
- Versiones e historial: Gestión de versiones y control de cambios.
- Compartir y exportar: Opciones de exportación y métodos para compartir diseños.
TEMA 6. PLUGINS Y RECURSOS ADICIONALES
- ¿Qué son las operaciones booleanas?
- Radio de esquina
- Creación de formas avanzadas
- Modos de fusión de capa
- Efectos
- Creando iconos
TEMA 7. IMÁGENES EN FIGMA
- Formatos de la web recomendados
- Opciones
- Importar imágenes a Figma
- Colocar imágenes en una forma
- Colocar imagen de fondo
- Modificar propiedades de las imágenes
- Tipos de relleno
- Plugin recomendados y galerías de imágenes libres
- Recursos de imágenes con IA
TEMA 8. COLOR EN FIGMA
- Introducción
- Color Picker Tool
- Modos de fusión
- Estilos de color
- Tipos de relleno
- Aplicación de degradados
- Recursos»
TEMA 9. AUTOLAYOUT EN FIGMA
- Introducción
- Autolayout en Figma
- Características principales de Autolayout
- Anidar Autolayouts
- Beneficios de usar Autolayout
TEMA 10. COMPONENTES EN FIGMA
- Componentes en Figma
- Visión general de los componentes
- Pasos para crear un componente
TEMA 11. PROTOTIPADO
- Introducción
- Prototipado
- Cómo prototipo en Figma
- Crear conexiones
- Para visualizar y testar el prototipo
- Smart Animate
- Transformaciones
- Operaciones y trucos
- Conclusión
Módulo 3: Elementor
TEMA 1. INTRODUCCIÓN A ELEMENTOR
- Introducción
- Requisitos previos: Instalación y configuración inicial
TEMA 2. PRIMEROS PASOS CON ELEMENTOR
- Introducción
- Creación de una página básica
- Ajustes
- Plantillas
TEMA 3. ELEMENTOS BÁSICOS DE DISEÑO
- Herramientas
TEMA 4. WIDGETS
- Introducción
- Widgets
TEMA 5. ESTRUCTURACIÓN DEL CONTENIDO
- Introducción
- Contenedores
- Gestión de plantillas y reutilización de elementos
TEMA 6. DISEÑO AVANZADO DE ELEMENTOR PRO
- Introducción
- Creando partes específicas
TEMA 7. ELEMENTOR CON IA
- Introducción
- Visión general
- Funcionalidades
TEMA 8. DISEÑO RESPONSIVE
- Introducción
- Diseñando páginas con Elementor
- Aspectos a tener en cuenta
TEMA 9. OPTIMIZACIÓN Y RENDIMIENTO
- Introducción
- Técnicas de optimización para mejorar la velocidad de carga
- Buenas prácticas para la creación del contenido
- Herramientas adicionales para mejorar el rendimiento
PÚBLICO
Dirigido a diseñadores gráficos, diseñadores UI/UX, desarrolladores web, product managers, marketers digitales y freelancers que desean adquirir habilidades avanzadas en diseño web y la integración de inteligencia artificial. También es ideal para estudiantes y profesionales que buscan mejorar sus competencias en herramientas como WordPress, Figma y Elementor, así como en la implementación de soluciones innovadoras en el diseño de interfaces y la experiencia del usuario.
Tener conocimientos básicos de diseño gráfico y desarrollo web, incluyendo el uso de CMS como WordPress y fundamentos de HTML y CSS. También es útil tener experiencia con herramientas de diseño digital como Figma, así como un interés en la integración de la inteligencia artificial en proyectos web. Además, es necesario contar con habilidades informáticas generales para manejar el software y gestionar archivos de manera eficiente.
PRECIOS
FORMACIÓN CON TUTORIA
Acompañamiento experto, seguimiento personalizado y apoyo continuoBonificable para Empleados
Ejercicios prácticos
Título propio Digital Credential
Inicio Tutorizado: convocatorias mensuales Inicio Autoestudio: Inmediato

