Red light, green light: the do's and don'ts of a successful dev-design workflow (Luz roja, luz verde: qué hacer y qué no hacer para un flujo de trabajo exitoso entre programadores y diseñadores

Imagine this: a highly-rotational developer team and an small-and-overworked design team working together for the first time with a tight schedule and several deliveries in a month: what could go wrong?

This talk is about a war story and my learnings on how, even when chaos seems to reign, you have sometimes to stop everything (turn the red light on) in order to continue and success (turn the green light on).

Talk given at DrupalCamp GDL.

Event page: www.drupalcampgdl.com

Talk info: www.drupalcampgdl.com/es/charlas/luz-roja-luz-verde-que-hacer-y-que-no-hacer-para-un-flujo-de-trabajo-exitoso-entre

Transcript

1. #DrupalCampMX @FerPeralesM QUÉ HACER Y QUÉ NO HACER PARA UN FLUJO DE TRABAJO EXITOSO ENTRE PROGRAMADORES Y DISEÑADORES LUZ ROJA, LUZ VERDE:
2. #DrupalCampMX @FerPeralesM <me>
3. #DrupalCampMX @FerPeralesM Ingeniero de Software MagmaLabs
4. #DrupalCampMX @FerPeralesM Ingeniero de Software MagmaLabs ¡Psst! Estamos contratando careers.magmalabs.io
5. #DrupalCampMX @FerPeralesM Promotor del FLOSS Apasionado del desarrollo web Conferencista en formación Estudiante de Bajo Eléctrico Fan: Heavy metal, cerveza, Twitter, Gregory Sallust, Ruby
6. #DrupalCampMX @FerPeralesM </me>
7. #DrupalCampMX @FerPeralesM Programadores vs. Diseñadores
8. #DrupalCampMX @FerPeralesM Programadores vs. Diseñadores http://sixrevisions.com/infographics/web-designers-vs-web-developers-infographic/
9. #DrupalCampMX @FerPeralesM “NADIE NOS ENSEÑA A TRABAJAR JUNTOS”
10. #DrupalCampMX @FerPeralesM Fer Perales “NADIE NOS ENSEÑA A TRABAJAR JUNTOS”
11. #DrupalCampMX @FerPeralesM El proyecto
12. #DrupalCampMX @FerPeralesM EL PROYECTO ▸ 6 temas para una plataforma de e-commerce ▸ Cada tema con 6 páginas: About Us, Cart, Categories, Contact Us, Home y PDP ▸ Sólo proporcionar el HTML y CSS necesario: un sitio estático ▸ Un mes ▸ 4 programadores y 4 diseñadores
13. GOPRO.COM
14. ABOUT US
15. CART
16. CATEGORIES
17. CONTACT US
18. HOME
19. PDP
20. #DrupalCampMX @FerPeralesM
21. #DrupalCampMX @FerPeralesM Los problemas
22. #DrupalCampMX @FerPeralesM REPARTICIÓN DEL TRABAJO
23. #DrupalCampMX @FerPeralesM
24. #DrupalCampMX @FerPeralesM POR VISTA
25. #DrupalCampMX @FerPeralesM POR RESOLUCIÓN
26. #DrupalCampMX @FerPeralesM POR COMPONENTE
27. #DrupalCampMX @FerPeralesM
28. #DrupalCampMX @FerPeralesM RESOLUCIONES A CONSIDERAR
29. #DrupalCampMX @FerPeralesM
30. #DrupalCampMX @FerPeralesM
31. #DrupalCampMX @FerPeralesM ELECCIÓN DE LAS HERRAMIENTAS
32. #DrupalCampMX @FerPeralesM ROTACIÓN DE DESARROLLADORES
33. #DrupalCampMX @FerPeralesM FACTOR AUTOBÚS
34. #DrupalCampMX @FerPeralesM https://adamprescott.files.wordpress.com/2012/12/busfactor1.png
35. #DrupalCampMX @FerPeralesM ¿ORDEN DEL TRABAJO?
36. #DrupalCampMX @FerPeralesM PRIMERO ERA NECESARIO EL DISEÑO ANTES DE LA IMPLEMENTACIÓN
37. #DrupalCampMX @FerPeralesM NO PODEMOS HACER QUE LOS DISEÑADORES TRABAJEN MÁS RÁPIDO
38. #DrupalCampMX @FerPeralesM PERO…
39. #DrupalCampMX @FerPeralesM PODEMOS HACER QUE PIERDAN MENOS TIEMPO
40. #DrupalCampMX @FerPeralesM GUIDELINES
41. #DrupalCampMX @FerPeralesM
42. #DrupalCampMX @FerPeralesM ¿SCRUM/AGILE NECESARIO?
43. #DrupalCampMX @FerPeralesM ¿SCRUM/AGILE NECESARIO? R: NO
44. #DrupalCampMX @FerPeralesM COMPONENTES COMUNES PARA TODOS LOS TEMAS
45. #DrupalCampMX @FerPeralesM ¡REUTILIZAR!
46. #DrupalCampMX @FerPeralesM PARCIALES + SMACCS
47. #DrupalCampMX @FerPeralesM
48. #DrupalCampMX @FerPeralesM “SCALABLE AND MODULAR ARCHITECTURE FOR CSS (SMACSS) ES EL LIBRO QUE LE DA SENTIDO A HACER CSS”
49. #DrupalCampMX @FerPeralesM “SCALABLE AND MODULAR ARCHITECTURE FOR CSS (SMACSS) ES EL LIBRO QUE LE DA SENTIDO A HACER CSS” Fer Perales
50. #DrupalCampMX @FerPeralesM ASUNCIONES
51. #DrupalCampMX @FerPeralesM SISTEMA DE GRID VS. PIXEL PERFECT
52. #DrupalCampMX @FerPeralesM DISEÑADORES HACIAN PIXEL PERFECT
53. #DrupalCampMX @FerPeralesM PROGRAMADORES USABAN SISTEMA DE GRID
54. #DrupalCampMX @FerPeralesM
55. #DrupalCampMX @FerPeralesM ¡TODOS USAMOS SISTEMA DE GRID!
56. #DrupalCampMX @FerPeralesM
57. #DrupalCampMX @FerPeralesM ¿O NO?
58. #DrupalCampMX @FerPeralesM GUTTER
59. #DrupalCampMX @FerPeralesM ¿GUTTER?
60. #DrupalCampMX @FerPeralesM
61. #DrupalCampMX @FerPeralesM BEFORE, AFTER, SPLIT, INSIDE, INSIDE-STATIC
62. #DrupalCampMX @FerPeralesM DISEÑADORES USABAN BEFORE
63. #DrupalCampMX @FerPeralesM PROGRAMADORES USABAN AFTER
64. #DrupalCampMX @FerPeralesM
65. #DrupalCampMX @FerPeralesM …
66. #DrupalCampMX @FerPeralesM TODOS USAMOS BEFORE
67. #DrupalCampMX @FerPeralesM ENTREGAS
68. #DrupalCampMX @FerPeralesM
69. #DrupalCampMX @FerPeralesM FACTOR AUTOBUS ATACA DE NUEVO
70. #DrupalCampMX @FerPeralesM http://img07.deviantart.net/15bb/i/2009/102/f/5/killer_bus_by_wendieee.jpg
71. #DrupalCampMX @FerPeralesM
72. #DrupalCampMX @FerPeralesM
73. #DrupalCampMX @FerPeralesM Las lecciones aprendidas
74. #DrupalCampMX @FerPeralesM DETENERTE PARA PONER ORDEN ESTÁ BIEN
75. #DrupalCampMX @FerPeralesM TOMARTE EL TIEMPO NECESARIO PARA ELEGIR TUS HERRAMIENTAS
76. #DrupalCampMX @FerPeralesM EN PROCESOS REPETITIVOS, ELABORA UNA METODOLOGÍA Y DOCUMÉNTALA
77. #DrupalCampMX @FerPeralesM REUTILIZA TODO LO QUE PUEDAS
78. #DrupalCampMX @FerPeralesM COMUNICACIÓN
79. #DrupalCampMX @FerPeralesM EMPATÍA Y RESPETO
80. #DrupalCampMX @FerPeralesM CONFIANZA
81. #DrupalCampMX @FerPeralesM PRÓXIMIDAD
82. #DrupalCampMX @FerPeralesM DESASTE DE TODO LO INNECESARIO
83. #DrupalCampMX @FerPeralesM EDUQUEN A SUS PROGRAMADORES DISEÑADORES:
84. #DrupalCampMX @FerPeralesM http://cdn.skilledup.com/wp-content/uploads/2014/10/Web-Design-Vs-Web-Development-Feature_1290x688_KL-940x501.jpg
85. #DrupalCampMX @FerPeralesM EDUQUEN A SUS DISEÑADORES PROGRAMADORES:
86. #DrupalCampMX @FerPeralesM http://cdn.skilledup.com/wp-content/uploads/2014/10/Web-Design-Vs-Web-Development-Feature_1290x688_KL-940x501.jpg
87. #DrupalCampMX @FerPeralesM AMBOS QUEREMOS HACER DE LA WEB UN LUGAR MEJOR http://designmodo.com/wp-content/uploads/2013/10/designervdeveloper.jpg
88. #DrupalCampMX @FerPeralesM ¿PREGUNTAS?
89. #DrupalCampMX @FerPeralesM ¡GRACIAS! hola@ferperales.net