diseño de producto digital con wordpress
Post on 23-Jan-2017
233 Views
Preview:
TRANSCRIPT
¿Producto Digital?
Multiples contextos
Diseño de Producto Digital con WordPress
Multiples formatos
/Introducción
Desktop, Tablet, Mobile WebApp, Ecommerce, Red Social, etc…
Diseño de Producto Digital con WordPress /Introducción
Estadísticas
$1,000 es lo que paga un cliente de media por un site con WordPress
(2014)
http://www.codeinwp.com/blog/wordpress-statistics/
$40 es el coste medio de un tema de pago
Avada es el tema más vendido, superando las 225.000 descargas
Diseño de Producto Digital con WordPress /Introducción
Estadísticas …España(2014)
https://ayudawp.com/como-usamos-wordpress-en-espana/
Diseño de Producto Digital con WordPress /Introducción
Riesgo del no diseño
Diseño propio (tema de WordPress a medida)
Diseño ajeno (tema de WordPress adquirido)
Objetivos mal definidos (UX)
Asumir la dedicación de correctivos
Desviación de la previsión original
Beneficio ínfimo o con pérdidas
Objetivos definidos
Fácil identificar “Bug” VS “feature”
Tareas en convergencia = mejores plazos
Gestión de riesgos
Diseño de Producto Digital con WordPress /Metodología
Espectro profesionaldel Diseño de Producto Digital
Diseño de la eXperiencia de Usuario
Diseño de Producto Digital con WordPress /Metodología
Seamos prácticosLa ejecución de la creatividad persigue el objetivo de
conceptualizar las ideas previas para alinear todas las visiones del producto (cliente, desarrollador, etc)
Diseño de la Interfaz de Usuario
Definición + Tiempo
Diseño de Producto Digital con WordPress /Metodología
Diseño UX
Wireframe PrototipoMockup
Seleccionamos el modelo estos dos parámetros:
Modelo de conceptualización gráfica:
Diseño de Producto Digital con WordPress /Metodología
Wireframe
Pros
Rápida ejecución
Bajo coste
Cons
Menor definición
Sin animación
Diseño de Producto Digital con WordPress /Metodología
Mockup
Pros
Alta definición
Reutilizable
Cons
Tiempo de ejecución
Sin animación
Diseño de Producto Digital con WordPress /Metodología
Prototipo
Pros
Alta definición
Con animación
Cons
Tiempo de ejecución
¿Reutilizable?
Diseño de Producto Digital con WordPress /Metodología
Herramientas
http://www.cooper.com/prototyping-tools
Diseño de Producto Digital con WordPress /Metodología
¿Y usar un “builder”?
Algunos de ellos:
Fusion (Avada)
Divi (Elegant Themes)
Upfront (WPMUDev)
Layers
Diseño de Producto Digital con WordPress /Metodología
¿Y usar un “builder”?
Cons
Orientado a objetos en lugar de flujos/tareas
Dependencias del tema
Solucionan herramientas, NO procesos
Perdida de control en la calidad del código
Diseño de Producto Digital con WordPress /Metodología
Ventajas del Diseño UX
Definir objetivos y arquitectura de información
Llegados a este punto hemos conseguido:
Identificar funcionalidades (widgets, regiones de menú, plugins, CPT, ACF, etc)
Unificar la visión del producto
Preparar el producto para escalar
Diseño de Producto Digital con WordPress /Metodología
Trabajando la convergencia
Una vez validado el diseño UX, las tareas de diseño UI y desarrollo front-end transcurren en paralelo
Optimización de los tiempos de entrega
Gestionar los riesgos de los procesos creativos: Creatividad + Eficiencia
Diseño de Producto Digital con WordPress /Metodología
Diseño UI
Mockup
Objetivo que perseguimos
Modelo de conceptualización gráfica:
Diseño de Producto Digital con WordPress /Metodología
Diseño de interfaz orientado a objetos
We’re not design pages, we’re designing systems of components
—Stephen Hay
Diseño de Producto Digital con WordPress /Metodología
“Atomic design”
Objetos
Atomos
Moléculas
Organismos
Templates (UX)
Páginas
Diseño de Producto Digital con WordPress /Metodología
Aplicando la convergencia
CSS
Trasladamos el diseño UI al desarrollo front-end
Diseño de Producto Digital con WordPress /Metodología
Ventajas del Diseño UI
Validar el look and feel con el mínimo esfuerzo y coste
Llegados a este punto hemos conseguido:
Dotar al desarrollo front una idea precisa para representar (CSS)
Ganar tiempo con la convergencia de tareas
Liberar de las dependencias de tareas creativas a corto/medio plazo
Diseño de Producto Digital con WordPress /Metodología
¡Recuerda!
Diseño propio (tema de WordPress a medida)
Diseño ajeno (tema de WordPress adquirido)
Objetivos mal definidos (UX)
Asumir la dedicación de correctivos
Desviación de la previsión original
Beneficio ínfimo o con pérdidas
Objetivos definidos
Fácil identificar “Bug” VS “feature”
Tareas en convergencia = mejores plazos
Gestión de riesgos
¿Preguntas?
http://abelsutilo.com
Abel Sutilo
@abelsutilo
http://agenciaroot.es
top related