SlideShare une entreprise Scribd logo
1  sur  52
Télécharger pour lire hors ligne
Why, what, who, when.
Hola!Soy Alfonso Morcuende
@NOAMMORRISSEY
Demanda
Escala
Tecnología
Diseño
Demanda
Escala
Tecnología
Diseño
“Never before has anything been created
that was more elegant or better in its
conception, more exact in its execution,
or fit for its use.”
Le Corbusier
Demanda
Escala
Tecnología
Diseño
THONET.REALIZED.ES
Why
What
Who
When
Why¿Por qué estamos construyendo un Sistema de diseño?
1.El motivo para crear un DSL no es diseñar
menos, es diseñar mejores productos.
“Less is more work.”
– Patric McCue
2.Equipos enfocados en problemas importantes,
no en tareas repetitivas.
“Get rid of everything that is not
essential to making a point”
– Christoph Niemann
3.Definir comportamientos estándar crea
conocimiento y elimina subjetividad.
“Ordo Ab Chao”
- Lema del grado 33 en la Scottish
Rite Freemasonry.
The
Challenge
Statement¿Qué resolverá este sistema?
¿Quiénes podrían ser parte de la solución/equipo?
¿A qué productos servirá inicialmente?
¿Quiénes, de momento, están fuera de la solución?
Equipos Consumidores
Individuos Productores
Dueños del Sistema
Aliados y Defensores
Otros Equipos
1. Consistencia
Lo más importante es la coherencia en las
soluciones que aportamos a nuestros usuarios.
(Coherencia en el diseño)
2. Eficiencia
Lo que más valoramos es la velocidad en la que
somos capaces de implementar una solución.
(Rapidez en el desarrollo)
3. Calidad
Lo sustancial en nuestros productos es “La
perfección en la experiencia digital" respecto a la
tarea o problema de nuestros usuarios.
4. Escala
Lo valioso es lo reusable. En cada nuevo desarrollo
valoramos muy positivamente la reutilización de
soluciones anteriores.
5. Comunicación
La alineación en el vocabulario que usamos entre
equipos (diseño / desarrollo / mkt / BM) es lo más
importante en este proyecto.
Lenguaje visual
Componentes UI
Cultura y valores
Racional de marca
Nuestro Sistema contempla…
Voz y tono
Patrones de diseño
Accesibilidad
Librerías de diseño
Design Tokens
HTML & CSS
JavaScript (React, Vue)
Consumibles de nuestro Sistema…
Código de plataforma (iOs, Android, WMP)
Racionales de diseño
Componentes
Lenguaje visual
Guía de marca
Documentamos nuestros…
Principios de diseño
Un equipo dedicado ¿candidatos?
Colaboradores especialistas internos ¿nombres?
Un Product Owner ¿nombre?
Aliados y defensores ¿nombres?
El equipo debería de esta compuesto por…
Consultores expertos externos ¿candidatos?
CONSISTENCIA (COHERENCIA EN EL DISEÑO)
Trabajaremos en resolver nuestros problemas de
UN LENGUAJE VISUAL, COMPONENTES UI, NUESTRA CULTURA Y VALORES Y UNA DEFINICIÓN DE NUESTRA VOZ Y TONO.
Creando un Sistema de Diseño que contendrá
LIBRERÍAS EN SKETCH PARA DISEÑO, DESIGN TOKENS Y HTML & CSS DE LOS COMPONENTES INCLUIDOS
Los consumibles de este Sistema serán
UN RACIONAL DE DISEÑO, COMPONENTES REALES DE CÓDIGO Y UNOS PRINCIPIOS DE DISEÑO QUE NOS AYUDE EN SU CONSTRUCCIÓN
La documentación detallará
UN PRODUCT OWNER (NOMBRE) Y UN EQUIPO DEDICADO (CANDIDATO 1, CANDIDATO 2)
Será ejecutado por un equipo formado por
NOMBRE EQUIPO 1, NOMBRE EQUIPO 2
El/los primeros equipos interesados en usar el Sistema son
What¿Qué componentes vamos a construir?
¿Qué Roadmap tiene sentido?
Small
Actions
Big Impact
¿Cuál es la forma más efectiva de enfrentarse a la deuda de diseño?
¿Qué automatizamos que nos permita ahorrar MUCHO tiempo?
Calculadora de deuda de diseño
Calculadora de deuda de diseño
Generador de Primitives. Librerías, documentación y tokens
Who¿Quién va a construir el sistema?
From Two
To Many
Uno no es un equipo.
Algo hecho en ratos libres no es un proyecto.
¿Cómo creamos y documentamos para un equipo?
EQUIPO MÍNIMO DE DOS
DISEÑADOR + DESARROLLADOR DE FRONT
EQUIPO MÍNIMO DE DOS
DISEÑADOR + DESARROLLADOR DE FRONT
EL EQUIPO DSL
DETERMINA LAS FORMA Y PERSONAS QUE APORTAN
When¿Cuándo y cómo va a ser consumido el sistema?
I love It
When a plan
Comes
Together
¿Cuál es el plan para que otros equipos consuman el Sistema?
“You can show how adoption works by
depicting how to go from an initial
commitment to full adoption via
incremental achievements based on
specific criteria.”
Nathan Curtis
IncrementalBig Bang
IncrementalBig Bang
4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race0Out of
System
4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race
Color
Fuentes
Iconos
0Out of
System
4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race
Color
Fuentes
Iconos
V. Tipográficos
Spacing
Grid
Botones
Formularios
0Out of
System
4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race
Color
Fuentes
Iconos
V. Tipográficos
Spacing
Grid
Botones
Formularios
Tokens
Modales
G. Errores
0Out of
System
4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race
Color
Fuentes
Iconos
V. Tipográficos
Spacing
Grid
Botones
Formularios
Tokens
Modales
G. Errores
Componentes
Tablas de datos
Markup
Voz y tono
Patrones
0Out of
System
Why
What
Who
When
Ada Lovelace Ray Eames
Patricia Moore Erika Hall
Gracias!
@NOAMMORRISSEY

Contenu connexe

Similaire à Why what who when

EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...
EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...
EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...FromDoppler
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteDaneziita Laulate Flores
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteDaneziita Laulate Flores
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteDaneziita Laulate Flores
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteDaneziita Laulate Flores
 
Diferencia entre Viable y Factible
Diferencia entre Viable y FactibleDiferencia entre Viable y Factible
Diferencia entre Viable y Factiblebettyrondon123
 
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...Alysson Franklin Martins Moreira, UXMC
 
RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas
 RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas
RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntasGAVIOTAZAVALLOS
 
DiseñO De Interacciones
DiseñO De InteraccionesDiseñO De Interacciones
DiseñO De Interaccionesfjellul
 
Construyendo software de clase mundia
Construyendo software de clase mundiaConstruyendo software de clase mundia
Construyendo software de clase mundiaGabriel Oliva
 
Resumen de los capitulos i, ii, iii del libro kendall & kendall
Resumen de los capitulos i, ii, iii del libro kendall & kendallResumen de los capitulos i, ii, iii del libro kendall & kendall
Resumen de los capitulos i, ii, iii del libro kendall & kendallErika Susan Villcas
 
Diseño de interacción, Prototipado y Testing
Diseño de interacción, Prototipado y TestingDiseño de interacción, Prototipado y Testing
Diseño de interacción, Prototipado y TestingJuan Paulo Madriaza
 
Crosscorp Comercial Presentation Ver 1.9
Crosscorp   Comercial Presentation Ver 1.9Crosscorp   Comercial Presentation Ver 1.9
Crosscorp Comercial Presentation Ver 1.9CrossCorp
 

Similaire à Why what who when (20)

EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...
EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...
EMMS 2017 - Diseños de modelos de negocio centrado en customer experience - N...
 
DevOps, automatización y... ¿cultura?
DevOps, automatización y... ¿cultura?DevOps, automatización y... ¿cultura?
DevOps, automatización y... ¿cultura?
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulte
 
Resumen del libro kendall daneziita
Resumen del libro kendall daneziitaResumen del libro kendall daneziita
Resumen del libro kendall daneziita
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulte
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulte
 
Resumen del libro kendall
Resumen del libro kendall Resumen del libro kendall
Resumen del libro kendall
 
Resumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulteResumen del libro kendall daneziita laulte
Resumen del libro kendall daneziita laulte
 
DesingOps -2019
DesingOps -2019 DesingOps -2019
DesingOps -2019
 
Diferencia entre Viable y Factible
Diferencia entre Viable y FactibleDiferencia entre Viable y Factible
Diferencia entre Viable y Factible
 
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
OK UX #1 - Entendiendo y creando una estrategia de user experience para su em...
 
RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas
 RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas
RESUMEN DEL LIBRO KENDALL && KENDALL CAPITULO 1,2 Y 3.y las preguntas
 
DiseñO De Interacciones
DiseñO De InteraccionesDiseñO De Interacciones
DiseñO De Interacciones
 
Construyendo software de clase mundia
Construyendo software de clase mundiaConstruyendo software de clase mundia
Construyendo software de clase mundia
 
Resumen de los capitulos i, ii, iii del libro kendall & kendall
Resumen de los capitulos i, ii, iii del libro kendall & kendallResumen de los capitulos i, ii, iii del libro kendall & kendall
Resumen de los capitulos i, ii, iii del libro kendall & kendall
 
Trabajo de resumen de kendal
Trabajo de resumen de kendalTrabajo de resumen de kendal
Trabajo de resumen de kendal
 
Diseño de interacción, Prototipado y Testing
Diseño de interacción, Prototipado y TestingDiseño de interacción, Prototipado y Testing
Diseño de interacción, Prototipado y Testing
 
Crosscorp Comercial Presentation Ver 1.9
Crosscorp   Comercial Presentation Ver 1.9Crosscorp   Comercial Presentation Ver 1.9
Crosscorp Comercial Presentation Ver 1.9
 
Crystal clear exposicion
Crystal clear exposicionCrystal clear exposicion
Crystal clear exposicion
 
Scrum y craftsmanship
Scrum y craftsmanshipScrum y craftsmanship
Scrum y craftsmanship
 

Dernier

Topografía cuadro de construcción ing.civil
Topografía cuadro de construcción ing.civilTopografía cuadro de construcción ing.civil
Topografía cuadro de construcción ing.civilmeloamerica93
 
Arquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdfArquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdfLeonardoDantasRivas
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfcucciolosfabrica
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddabuitragoi
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfAdrianaCarolinaMoral2
 
Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroJuan Carlos Fonseca Mata
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfasnsdt
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio2021ArqROLDANBERNALD
 
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdfINICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdfBrbara57940
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialAndreaMlaga1
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturajesusgrosales12
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxbarbaracantuflr
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOManuelBustamante49
 
Afiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola PerezAfiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola PerezPaola575380
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfslaimenbarakat
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesespejosflorida
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoJorge Fernandez
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasRiegosVeracruz
 

Dernier (20)

Topografía cuadro de construcción ing.civil
Topografía cuadro de construcción ing.civilTopografía cuadro de construcción ing.civil
Topografía cuadro de construcción ing.civil
 
Arquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdfArquitectos del Movimiento Moderno Pt. 2.pdf
Arquitectos del Movimiento Moderno Pt. 2.pdf
 
guia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdfguia de talles de camitas cucciolos 2024.pdf
guia de talles de camitas cucciolos 2024.pdf
 
Arte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusaArte textil: Tejidos artesanos en la frontera hispano-lusa
Arte textil: Tejidos artesanos en la frontera hispano-lusa
 
diseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidaddiseño de plantas agroindustriales unidad
diseño de plantas agroindustriales unidad
 
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdfPresentación Proyecto Vintage Scrapbook Marrón (1).pdf
Presentación Proyecto Vintage Scrapbook Marrón (1).pdf
 
Geometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de QuerétaroGeometrías de la imaginación: Diseño e iconografía de Querétaro
Geometrías de la imaginación: Diseño e iconografía de Querétaro
 
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdfCERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
CERTIFICACIÓN DE CAPACITACIÓN PARA EL CENSO - tfdxwBRz6f3AP7QU.pdf
 
Torre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificioTorre 222 sobre instalaciones de este mismo edificio
Torre 222 sobre instalaciones de este mismo edificio
 
1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño1.La locomoción de los seres vivos diseño
1.La locomoción de los seres vivos diseño
 
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdfINICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
INICIOS DEL MOVIMIENTO MODERNO 1900-1930.pdf
 
plantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especialplantilla-de-messi-1.pdf es muy especial
plantilla-de-messi-1.pdf es muy especial
 
Jesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitecturaJesus Diaz afiche Manierismo .pdf arquitectura
Jesus Diaz afiche Manierismo .pdf arquitectura
 
Presentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptxPresentacion de 100 psicologos dijeron.pptx
Presentacion de 100 psicologos dijeron.pptx
 
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYOPDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
PDU - PLAN DE DESARROLLO URBANO DE LA CIUDAD DE CHICLAYO
 
Afiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola PerezAfiche de arquitectura manierista Paola Perez
Afiche de arquitectura manierista Paola Perez
 
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdfSlaimen Barakat - SLIDESHARE TAREA 2.pdf
Slaimen Barakat - SLIDESHARE TAREA 2.pdf
 
Espacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientesEspacios únicos creados por nuestros clientes
Espacios únicos creados por nuestros clientes
 
Proceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimientoProceso de percepción visual y de reconocimiento
Proceso de percepción visual y de reconocimiento
 
Diseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicasDiseño de sifones y alcantarillas para obras hidraulicas
Diseño de sifones y alcantarillas para obras hidraulicas
 

Why what who when