UX/UI y Desarrollo Front-endNoviembre 2026 - Junio 2027

• Estructura básica web: HTML5 semántico, sintaxis y configuración de entorno de desarrollo.
• Fundamentos CSS y modelo de cajat: Selectores, propiedades básicas, box model (padding, bordes, márgenes), posicionamiento.
• Estilos visuales avanzados: Tipografía web, fondos/gradientes, listas, multimedia y formularios.
• Layouts modernoss: Flexbox y CSS Grid para diseños complejos y responsivos.
• Diseño responsivo y accesibilidad: Media queries, mobile-first, WCAG, ARIA y pruebas básicas.
• Buenas prácticas y optimización: Convenciones de código, rendimiento, tablas y herramientas de depuración

• Introducción a UX/UI: Definiciones, relación entre UX y UI, principios fundamentales y su impacto en productos digitales.
• Evaluación de interfaces: Análisis heurístico (Nielsen), usabilidad, accesibilidad (WCAG 2.2) y patrones comunes en web/mobile.
• Diseño visual para UI: Teoría del color, tipografía en pantallas, composición, grids (sistema 8pt) y whitespace.
• Proceso UX: Research y estructura: Investigación de usuarios, personas, journeys, arquitectura de información y wireframes low-fi
• Prototipado y validación: Creación de prototipos interactivos (Figma u equivalente), pruebas de usabilidad e iteración.
• Introducción a design systems: Conceptos de componentes reutilizables, atomic design y documentación básica.

• Fundamentos de JavaScript: Variables, tipos de datos (primitivos, arrays, objetos), condicionales, funciones, bucles y timers.
• Introducción a React: Componentes, JSX, ciclo de vida, eventos y componentes reutilizables.
• Gestión de estado básic: Hooks useState, useEffect y manejo de eventos en React.
• Navegación y datos asíncronos: Routing (react-router), llamadas HTTP, promesas y normalización de datos.
• Estado avanzado y optimización: Context API, useReducer, useMemo/useCallback, custom hooks y TypeScript para tipado.
• Formularios, testing e internacionalización: Formularios controlados, testing de componentes y basics de i18n.

• Introducción a WordPress: Instalación local/remota, panel de control y ajustes esenciales (usuarios, enlaces permanentes).
• Gestión de contenido: Gutenberg editor, Full Site Editing, creación de páginas/posts y taxonomías personalizadas.
• Diseño visual con page builders: Elementor (o equivalente): importación de diseños Figma, customización de secciones y responsive.
• Plugins y funcionalidades: Selección/integración de plugins esenciales (SEO, formularios, optimización), child themes.
• Optimización y SEO: Mejores prácticas on-page, rendimiento (caché, lazy loading), accesibilidad y pruebas cross-browser.
• Despliegue y mantenimiento: Migración a servidor, backups, seguridad y documentación para clientes/equipos.

• Introducción a la Automatización No-Code: Conceptos básicos, beneficios en UX/dev (ahorro tiempo en testing/deploy), overview n8n/Make.com vs Zapier.
• Herramientas Core: n8n y Make: Instalación local/cloud, nodos básicos (triggers, HTTP, webhooks), workflows simples (e.g., Figma a Slack)
• Automatizaciones UX/UI: Integraciones Figma/GitHub (export assets, feedback loops), Google Sheets para user research, notificaciones Jira/Trello.
• Flujos DevOps Front-end: CI/CD con GitHub/Netlify (auto-deploy React), testing API (Postman/Make), monitoring errores (Sentry/Slack).
• Integraciones Avanzadas: APIs custom (e.g., WordPress headless), data processing (CSV/JSON para analytics), multi-tool chains (Figma → n8n → Vercel).
• Seguridad, Escalabilidad y Mantenimiento: Best practices (secrets, error handling), debugging workflows, escalado para equipos.

• Qué es el emprendimiento en productos y servicios digitales (startups, freelancing, intraemprendimiento)
• Características intrínsecas de una persona emprendedora en entornos UX/UI y desarrollo front-end.
• Intraemprendimiento y emprendimiento: oportunidades en producto digital dentro de empresas y como estudio/freelance.
• Emprendimiento social y de impacto aplicado al diseño de experiencias digitales.
• Creación de un modelo de negocio para un producto digital: Business Model Canvas y Lean Canvas.
• Presentación comercial: cómo lanzar un proyecto digital (pitch, propuesta de valor, storytelling centrado en el usuario).

En este módulo el estudiante trabajará en agencias digitales, estudios de diseño, empresas de producto o desarrollo web, por ejemplo:

• Agencia digital especializada en diseño de producto y UX/UI (apps, webs corporativas).
• Estudio freelance o equipo pequeño de desarrollo front-end (proyectos indie/SaaS).
• Empresa de producto digital con foco mid-market (e-commerce, plataformas SaaS).
• Agencia de transformación digital o consultoría tech (proyectos enterprise).
• Startup o scale-up enfocada en innovación digital (apps móviles, herramientas no-code/low-code).

El estudiante también podrá participar en eventos de la industria como hackathons de UX, game jams digitales o meetups de front-end de manera voluntaria.

(Asignatura cursada sólo para alumnado que cumplan los requisitos para la titulación realizada a través de Cualificam)

El proyecto final consiste en el desarrollo de una página web profesional
Se realiza colaborando en equipo simulando el trabajo en una empresa real.
El proyecto es, además, presentado a una audiencia compuesta de profesorado y otros profesionales del sector.