UX/UI Design

NEOLAND
NEOLAND logo

Contenido del bootcamp

UX Research


Principios de usabilidad


• Técnicas integradoras y de gamestorming
• Introducción al UX/UI, Agile, Service y Business Design
• Principios básicos: usabilidad y buenas prácticas
• Heurísticas de Jakob Nielsen
• Introducción a metodologías de diseño y Agiles
• Conceptos generales del Design Thinking


El proceso de UX


• Kick-off, cómo arrancar proyectos
• El brief para el planteamiento de proyectos
• Introducción al UX Research


Metodología Design Thinking


• Modelos de Design Thinking
• El modelo del Doble Diamante
• Fases: Investigación, Análisis, Ideación e Implementación


Diseño de Investigación UX


• Introducción al ux research
• Tipos de investigación
• Investigación cualitativa y cuantitativa
• Design Research Plan
• Planteamiento de las Research Questions
• Benchmark y análisis de competencia. DAFO
• Análisis competitivo, interno y funcional. Fases
• Etnografía y trabajo de campo
• Ténicas: safari, shadowing, entrevistas, etc.
• Conceptos fundamentales en entrevistas y cuestionarios


Análisis en experiencia de usuario


• Análisis, síntesis e identificación de patrones
• Técnicas principales: mapa de afinidad, clusterización, etc.
• Detección o extracción de insights y hallazgos
• Técnicas y herramientas de convergencia
• Elaboración y definición de los User Persona
• Desarrollo del Mapa de Empatía
• Seguimiento del User Journey
• Creación del Canvas POV
• Comportamiento de usuario, Jobs To Be Done


Ideación, encontrando soluciones


• Conceptos de ideación en UX
• Brainstorming y brainwriting
• Método SCAMPER, What if, HMW e hibridaciones
• Técnicas de priorización de ideas: matrices, MoSCoW, etc


Implementación a través del prototipado


• Conociendo los conceptos de prototipado
• Prototipado de baja fidelidad
• Prototipado en co-creación


Testing y validación


• Validación con stakeholders
• Testing con usuarios
• Conociendo la técnica del focus group
• Testing: tareas únicas, múltiples, primer clic y de 5 segundos


Fundamentos del Diseño de Interacción


• El concepto de Diseño de Interacción
• La importancia del Diseño de Interacción en el producto digital
• Principios básicos de interacción
• Leyes y principios de UX: Hick, Fitts, Pareto y otras


Arquitectura de la Información


• Conceptualización del diseño
• Fundamentos de wireframing analógico y digital
• Unidades de información y etiquetas
• Navegación vs búsqueda
• Sistemas de navegación; Básicos y avanzados
• Taxonomías, facetas y filtros
• Herramientas de utilidad
• Entregables en arquitectura de la información: mapa del sitio


Metodología del Diagrama de Flujo


• Introducción a los Diagramas de Flujo
• Ventajas y fases del proceso. Dónde usar flowcharts
• Símbolos básicos de diagramación
• Aprendizaje de herramientas útiles
• Conceptos mixtos de arquitectura: wireflows


UI Design


Fundamentos del Diseño Visual


• Principios, aplicación de modos y perfiles de color
• El color en la web o app. Su uso en Sketch, Figma y Adobe XD
• Principios de la tipografía
• Aplicación de la tipografía en web y app
• Uso de la tipografía en herramientas: Sketch, Figma y Adobe XD
• Fundamentos básicos del UI; Exportación retina, grid 8pt, etc


Diseño de Interfaz, UI


• Fundamentos del diseño visual: uso de imágenes e ilustración
• Fundamentos básicos de UI: exportación retina, grid 8pt, etc
• Generación de guías de estilo y UI kit
• Atomic Design y sistemas de diseño
• Creación de componentes, diseño responsive y libreríasCreación de
componentes, diseño responsive y librerías (II)
• Creación de repositorio Design System con Zero Height y DSM
• Integración de UI con código y handoffs; Zeplin e InVision


Prototipado y testing con usuarios


• Prototipado de pantallas con Invision, Sketch y Marvel
• Prototipado con Figma. Microinteracciones con Smart Animate
• Testing con usuarios
• Testing en remoto con Maze y Useberry
• Prototipado y animación avanzada con Principle y ProtoPie


El ecosistema web y maquetación


• Diferentes tipos de servidores
• Entendiendo los protocolos web; Http, ftp, etc
• Diferencias entre web estática y web dinámica
• Código HTML y su función en una página web
• Etiquetas principales en HTML
• CSS y su función en diseño web
• Editores de texto: Visual Studio Code
• Conceptos básicos de maquetación web
• Conceptos básicos de maquetación responsive
• Enfoques mobile first contra desktop first
• Propiedades Flexbox y CSS Grid


Tipos de apps, APIs y sistemas operativos


• Tipos de apps: nativas, híbridas y webapps
• Ventajas e inconvenientes de los diferentes tipos de apps
• Lenguajes de desarrollo de apps: Android vs iOS
• Concepto de API y su función en el desarrollo web
• Aprendiendo patrones Android e iOS


Introducción a los CMS, WordPress


• Definiendo qué es un CMS
• Ventajas e inconvenientes de WordPress
• Instalación y arranque de un proyecto con WordPress
• Conceptos generales de WordPress
• Uso de WordPress con plantillas premium
• Maquetación landings diseñadas en Figma o Sketch
• La función de los maquetadores visuales
• Conceptos generales del maquetador Elementor


Maquetación responsive con Bootstrap


• Repaso del concepto grids en diseño web
• Maquetación responsive con frameworks. Bootstrap
• Mediaqueries para el diseño multidispositivo con breakpoints
• Maquetación web básica con Bootstrap 5 en Visual Studio Code
• Cómo exportar assets desde Figma o Sketch a una web


Desarrollo de pruebas con usuarios


• Conceptos y herramientas de validación con usuarios
• Realización de pruebas de usuario moderadas
• Testing en formato remoto
• Heurísticas avanzadas y método PURE


Data driven design y webs en producción


• Conociendo los test A/B y test de concepto
• Conceptos fundamentales de analítica web y SEO


Desarrollo del portfolio personal


• Elaboración de portfolio y páginas personales
• Heramientas y plataformas para el perfil personal
• Cómo incluir los proyectos en las plataformas
• Plataformas para compartir proyectos
• Ejercicios de implementación con CMS. WordPress, Uxfolio, etc


Service Design


Fundamentos del Diseño de Servicios


• Conceptos: UX, Service Design y Customer Experience
• Diferencia entre diseñar productos y servicios
• Fundamentos: qué es un servicio
• Fundamentos: qué es un producto
• Modalidades de experiencia de cliente: enfoque digital y presencial
• Entendiendo el diseño estratégico
• Encajando el diseño de servicio con metodologías
• Enfocando el diseño de servicios con Design Thinking
• Enfocando el diseño de servicios con Lean
• Introducción a las metodologías Agile
• Optimizando equipos multidisciplinares y polivalentes
• Equipos transversales frente a equipos dedicados


Técnicas y herramientas del Service Design


• Elaboración de mapas de stakeholders
• Safaris, shadowing y entrevistas
• Customer Journey Map y Blueprint
• Cómo ejecutar un Blueprint
• Proceso de generación de ideas
• Técnicas de escenarios de diseño


Planificación de dinámicas de co-creación


• Consejos de planteamiento con los stakeholder
• Organización de las jornadas para las dinámicas
• Técnicas principales para dinámicas de co-creación


Propuesta de valor en el negocio


• Cómo elaborar una buena propuesta de valor
• Centrando la propuesta de valor en el cliente
• Elementos de valor para el consumidor
• Entregable: el canvas de la propuesta de valor


Elaboración del modelo de negocio


• Gestión estratégica para desarrollar nuevos modelos de negocio
• Principales modelos de negocio digital
• Entregable: el business model canvas. Cómo elaborarlo


Entendiendo el modelo startup


• El nuevo modelo de negocio en las startup
• Entregable: el lean canvas. Cómo elaborarlo


Lean UX en la metodología startup


• Conociendo el Lean UX
• Lean model canvas enfocado a UX
• Diferencias entre Lean Startup y Lean UX
• Diferenciando Lean UX y Design Thinking
• Fases del proceso Lean
• Declaración de suposiciones
• Planteamiento de hipótesis
• Creación del protojourney y protopersonas
• Generación de las historias de usuario
• Introducción a los KPIs y las métricas
• Conceptos de Inbound Marketing
• Métricas y herramientas para establecer KPIs
• Técnicas y herramientas para generar Producto Mínimo Viable


Design Sprint 2.0 enfocado a startup


• Preparación del proyecto de Design Sprint 2.0
• Design Sprint (I) Definir y Bocetar
• Establecimiento de metas a largo plazo
• Elaboración de preguntas para el sprint y planteamiento del mapa
• Planteamiento de las How Might We questions
• Votación de las ideas
• Design Sprint (II) Decidir
• Búsqueda de soluciones
• Bocetando en 4 pasos: notas, ideas, Crazy 8 y sketching definitivo
• Votación de las ideas
• Entendiendo qué son los mapas térmicos
• Evaluación de ideas y votación silenciosa
• Realización de Storyboard y preparación de usuarios para testing
• Design Sprint (III) Prototipar
• Convirtiendo el guion gráfico en un prototipo realista
• Finalización del prototipo y preparación de usuarios para testing
• Design Sprint (IV) Validar
• Preparación de las preguntas para testing y tareas
• Comienzo del testing del prototipo con usuarios
• Análisis y presentación de los descubrimientos y resultados

Ver opiniones de NEOLAND
Comparte este Bootcamp