True & False. Cats & Dogs. Designer & Entwickler?

Die Kommunikation zwischen Designern und Entwicklern ist nicht immer einfach. Sie produktiv und effizient zusammenarbeiten zu lassen, ist noch schwieriger. In unserem Talk zeigen wir, warum es in unserem Team funktioniert und wie uns auf diese Weise die besten Produkte gelingen.

Tim Schneider
https://twitter.com/tmschndr
https://speakerdeck.com/tmschndr

Liane Thönnes
https://twitter.com/liane_thoennes

https://ruby.froscon.org/talks/true-false-cats-dogs-designer-entwickler/

Transcript

1. True & False. Cats & Dogs. Designer & Entwickler?
2. @tmschndr Entwickler @liane_thoennes Designerin
3. True & False. Cats & Dogs. Designer & Entwickler?
4. ?
5. Designer sind keine Entwickler sind keine Designer
6. DESIGNER ENTWICKLER 8 Buchstaben 10 Buchstaben Schnittmenge = 4 verschiedene Buchstaben 22,2 % Gemeinsamkeiten 77,8 % Unterschiede q.e.d. DESIGNER ENTWICKLER E N i R
8. Ja! Wir sind verschieden!
9. Liane Tim
10. Liane Tim Erstes Praktikum in einem Designbüro 1994 Werkstudent in den Sommerferien 1999 in der Halbleiter-Industrie
11. Liane Tim Gestaltung von Infografiken für Freunde der Geschwister Homepages für Vereine, Friseure, Kurierdienste
12. Liane Tim Fotoassistentin, Ausbildung zur Mediengestalterin, Diplom in Kommunikations- design Informatik im Abitur, dann Studium der Medieninformatik
13. Liane Tim Seit 2003 Als Freelance- oder feste Designerin tätig erst freier Web- Entwickler, dann Mit-Gründer eines Entwicklerteams
14. Liane Tim ABC ABC
15. Was treibt dich an?
16. Liane Tim
17. Ich bin keine Entwicklerin, weil …
18. Ich bin kein Designer, weil …
19. Ja! Wir sind verschieden!
20. Und so verschieden arbeiten Designer und Entwickler zusammen …
21. Idee / Konzept MockUps / Prototyping technisches Design Entwicklungsplanung Screendesign Entwicklung Feedback-Zyklen Produktmanagement Allgemeine Aufgaben u.a.
22. Idee, Produktmanagement Sprintplanung Technisches Konzept für die Feature Entwicklung </> </> Entwicklung </> 2., 3., n. Iteration </> MockUps, Prototyping Finales Screendesign, Vorlagen für Entwickler Review / Feedback, QA, Abnahme
23. Vorurteile
24. Liane kennt solche Entwickler … Tim kennt solche Designer …
25. Tim kennt solche Designer … die in Blockabsätzen Wortabstände bemängeln!
26. Liane kennt a Entwickler … die offensichtlich der „No-UI Bewegung“ frönen! ;)
27. Wir alle kennen diese Beispiele!
29. ( unterschiedliche Denkweisen können allerdings auch von Vorteil sein )
30. Lost in Translation
31. Ego Desinteresse bis Arroganz wenig Kompromissbereitschaft ME MYSELF I I
32. Gelernte Feindschaft
33. Hug it out!
34. Form follows function. Functionality affects form.
35. Grundlagen von Ästhetik
37. Schön ist, was einfach und effektiv ist.
38. Fibonacci-Zahlen
39. Der goldene Schnitt
40. Code? Beautiful? Sure!
42. Design Pattern Design Typographie / Schrift Einfachheit Klarheit Entwicklung Principle of least surprise Don‘t repeat yourself No code is better than no code
43. Ähnliche Arbeitsweisen
44. einfach und effektiv
45. vom Modell zum Detail (iterativ)
46. Tiefes Problemverständnis erforderlich
47. Oft gesucht: Designerentwickler / Entwicklerdesigner (m/w)
48. "The difference between a designer and developer, when it comes to design skills, is the difference between shooting a bullet and throwing it." Scott Hanselmann
49. So funktioniert‘s bei uns
50. Gemischtes, gleichberechtigtes Team
51. Idee Konzept MockUps Prototyping Sprint Planning Screendesign Iterative Implementierung Produktmanagement Unser Prozess
52. Idee Konzept MockUps Prototyping Sprint Planning Screendesign Iterative Implementierung Produktmanagement Unser Prozess Liane ✓ ✓ ✓ ✓ ✓ ✓ ✓
53. Idee Konzept MockUps Prototyping Sprint Planning Screendesign Iterative Implementierung Produktmanagement Unser Prozess Liane Tim ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓ ✓
54. Gemeinsame Tools Entwicklung Git & GitHub (statt CSS per Mail) Photoshop CSS (Stephan kotzt zwar) Frameworks (Foundation, Bootstrap)
55. Gemeinsame Tools Entwicklung Git & GitHub (statt CSS per Mail) Photoshop CSS (Stephan kotzt zwar) Frameworks (Foundation, Bootstrap) Konzept, Design Typecast (typecast.com) MockUp / Wireframing / Prototyping Tools (z.B. Balsamiq) redpen.io Whiteboard
57. Gemeinsame Tools Entwicklung Git & GitHub (statt CSS per Mail) Photoshop CSS (Stephan kotzt zwar) Frameworks (Foundation, Bootstrap) Konzept, Design Typecast MockUp / Wireframing / Prototyping Tools (z.B. Balsamiq) redpen.io Whiteboard Organisation Tracker (oder Github Issues) gemeinsame Sprint-Planung gemeinsamer Chat, kein Dev-Chat
60. Geschmacksmuster statt PSD
62. Gemeinsame (Weiter-) Entwicklung eines Styleguides
63. Living Styleguides bieten Designern die Möglichkeit, Design zu optimieren
64. Gemischtes Team Gemeinsame Konzeptarbeit und Planung „Schnittstellenoptimierung“ durch gute Tools lebendige Designs, die weiterentwickelt werden können + + +
65. Good habits
66. Lieber Entwickler, Erkläre einfach Setz dich mit Design auseinander Sei ehrlich was umgesetzt werden kann & was nicht Setze auch mal Design-Details um = Designer:
67. Lieber Designer, Erkläre einfach Setz dich mit der Entwicklung auseinander Gestalte gründlich, bedenke Ausnahmen Sei auch mal pragmatisch = Entwickler:
68. Entwickler & Designer: Be nice Behaltet Euer gemeinsames Ziel im Auge Lasst euch vielfältig inspirieren und seid offen Lernt voneinander = Und alle:
69. True & False. Cats & Dogs. Designer & Entwickler. Es ist wichtig das wir genug voneinander wissen, um die richtigen Fragen stellen zu können. Wenn jeder von uns einen eigenen Schwerpunkt und eine eigene Spezialität hat und zusätzlich über gemeinsames Wissen / shared knowledge verfügt wird es leichter elementare Entscheidungen zu fällen und innovative Produkte zu entwickeln.
70. Leidenschaft
71. Routine
72. Kämpft!
73. Love & Hate. Vielen Dank!
74. Credits jess3.com flickr.com/photos/wilhei/ atari-computermuseum.de stephenengert.com code-poems.com/book.html dribbble.com/Sebastiano_Guerriero