1. Why, what, who, when.

2. Hola!Soy Alfonso Morcuende
@NOAMMORRISSEY

5. Demanda
Escala
Tecnología
Diseño

6. Demanda
Escala
Tecnología
Diseño

9. “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

12. Demanda
Escala
Tecnología
Diseño

13. THONET.REALIZED.ES

14. Why
What
Who
When

15. Why¿Por qué estamos construyendo un Sistema de diseño?

16. 1.El motivo para crear un DSL no es diseñar
menos, es diseñar mejores productos.
“Less is more work.”
– Patric McCue

17. 2.Equipos enfocados en problemas importantes,
no en tareas repetitivas.
“Get rid of everything that is not
essential to making a point”
– Christoph Niemann

18. 3.Definir comportamientos estándar crea
conocimiento y elimina subjetividad.
“Ordo Ab Chao”
- Lema del grado 33 en la Scottish
Rite Freemasonry.

19. 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?

20. Equipos Consumidores
Individuos Productores
Dueños del Sistema
Aliados y Defensores
Otros Equipos

21. 1. Consistencia
Lo más importante es la coherencia en las
soluciones que aportamos a nuestros usuarios.
(Coherencia en el diseño)

22. 2. Eficiencia
Lo que más valoramos es la velocidad en la que
somos capaces de implementar una solución.
(Rapidez en el desarrollo)

23. 3. Calidad
Lo sustancial en nuestros productos es “La
perfección en la experiencia digital" respecto a la
tarea o problema de nuestros usuarios.

24. 4. Escala
Lo valioso es lo reusable. En cada nuevo desarrollo
valoramos muy positivamente la reutilización de
soluciones anteriores.

25. 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.

26. Lenguaje visual
Componentes UI
Cultura y valores
Racional de marca
Nuestro Sistema contempla…
Voz y tono
Patrones de diseño
Accesibilidad

27. Librerías de diseño
Design Tokens
HTML & CSS
JavaScript (React, Vue)
Consumibles de nuestro Sistema…
Código de plataforma (iOs, Android, WMP)

28. Racionales de diseño
Componentes
Lenguaje visual
Guía de marca
Documentamos nuestros…
Principios de diseño

29. 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?

30. 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

31. What¿Qué componentes vamos a construir?
¿Qué Roadmap tiene sentido?

32. 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?

33. Calculadora de deuda de diseño

34. Calculadora de deuda de diseño

35. Generador de Primitives. Librerías, documentación y tokens

36. Who¿Quién va a construir el sistema?

37. 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?

38. EQUIPO MÍNIMO DE DOS
DISEÑADOR + DESARROLLADOR DE FRONT

39. EQUIPO MÍNIMO DE DOS
DISEÑADOR + DESARROLLADOR DE FRONT
EL EQUIPO DSL
DETERMINA LAS FORMA Y PERSONAS QUE APORTAN

40. When¿Cuándo y cómo va a ser consumido el sistema?

41. I love It
When a plan
Comes
Together
¿Cuál es el plan para que otros equipos consuman el Sistema?

42. “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

43. IncrementalBig Bang

44. IncrementalBig Bang

45. 4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race0Out of
System

46. 4Rock the
Race
3Training
Plan
2Get the
Gear
1Sign up for
the Race
Color
Fuentes
Iconos
0Out of
System

47. 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

48. 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

49. 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

50. Why
What
Who
When

51. Ada Lovelace Ray Eames
Patricia Moore Erika Hall

52. Gracias!
@NOAMMORRISSEY