Responsible Design – Wie wir nachhaltig und verantwortungsvoll Websites entwickeln

A presentation at Drupalcamp Schwerin in October 2017 in Schwerin, Germany by Niklas Jordan

Slide 1

Slide 1

Responsible Design Wie wir nachhaltig und verantwortungsvoll Websites entwickeln

Slide 2

Slide 2

Hello! I am Niklas. Infinitely curious about everything. You can find me at @niklas_jordan.

Slide 3

Slide 3

Slide 4

Slide 4

Artiom Dashinsky (Product Design for Sustainability)

Slide 5

Slide 5

Unser Beitrag als Designer/Entwickler - Alle Produkte und Services haben Einfluss auf die Umwelt und die Gesellschaft - Design ist Teil des Product Lifecycle

Slide 6

Slide 6

  1. Wir haben einen Einfluss 2. Wir haben eine Verantwortung

Slide 7

Slide 7

Sozial Ökologisch Ökonomisch

Slide 8

Slide 8

Sozial Ökologisch Ökonomisch

Slide 9

Slide 9

Sozial Ökologisch Ökonomisch

Slide 10

Slide 10

Im „echten“ Leben spielt Nachhaltigkeit eine zunehmende Rolle…

Slide 11

Slide 11

70kg Naturvernutzung pro Smartphone Beispiel: Smartphone (Quelle: Verbraucherzentrale NRW)

Slide 12

Slide 12

Beispiel: Smartphone

Slide 13

Slide 13

Internet CO2 Emissionen pro Jahr (Quelle: A List Apart) 680 Mio. t

Slide 14

Slide 14

Internet Wir 680 Mio. t 332 Mio. t CO2 Emissionen pro Jahr (Quelle: A List Apart)

Slide 15

Slide 15

332 Mio Tonnen CO2 entsprechen… - Dem CO2 das ca. 320 Mio. Bäume binden - Der CO2 – Jahresemission der weltweiten Flugindustrie - Dem C02 – Jahresausstoß von ca. 142 Mio. Kleinwagen Quelle: www.co2-emissionen-vergleichen.de

Slide 16

Slide 16

Was können wir tun?

Slide 17

Slide 17

  • Reduce - Reuse - Recycle Zero Waste in Design

Slide 18

Slide 18

Nützlichkeit & Usability - Wenig nützliche Produkte verschwenden Ressourcen Reduce

Slide 19

Slide 19

Dematerialisierung - Weniger Material (z.B. durch kleinere, leichtere Produkte) Reduce

Slide 20

Slide 20

Transmaterialisierung - Produkt in Service umwandeln (z.B. Bücherei, Downloads etc.) Reduce

Slide 21

Slide 21

Langlebigkeit (Design for Durability) - Wartbarkeit/Reparierbarkeit statt „planned Obsolescence“ - Zukünftige Nutzerbedürfnisse berücksichtigen - Zeitloses Design statt (ausgefallene) Trends Reuse

Slide 22

Slide 22

Wiederverwendbarkeit - Geplante Wiederverwendung - Upcycling Recycle

Slide 23

Slide 23

C02-arme Websites

Slide 24

Slide 24

Neue Nutzer gewinnen Business Case Verbesserte User Experience Geld sparen Umwelt schonen

Slide 25

Slide 25

Quelle: https://www.soasta.com/blog/page-bloat-average-web-page-2-mb/

Slide 26

Slide 26

Quelle: https://www.cnet.com/news/web-sites-are-getting-faster-but-not-enough/

Slide 27

Slide 27

Wenn der Seitenaufruf sich um eine Sekunde verlangsamt sinken die Umsätze jährlich um 1,6 Milliarden Euro. Amazon

Slide 28

Slide 28

Beispiel: Spiegel Online

Slide 29

Slide 29

Original: 23 kb

Slide 30

Slide 30

ImageOptim Optimiert: 11,5 kb (50%)

Slide 31

Slide 31

17,65 Mio (p.M.) Rechenbeispiel

Slide 32

Slide 32

17,65 Mio (p.M.) * 11,5 kb Rechenbeispiel

Slide 33

Slide 33

202,975 GB = 1,58 Tonnen CO2 = 7,81 Tonnen CO2 (mobile Nutzung) Rechenbeispiel

Slide 34

Slide 34

Was kannst Du privat tun?

Slide 35

Slide 35

https://www.ecograder.com

Slide 36

Slide 36

Sozial Ökologisch Ökonomisch

Slide 37

Slide 37

Guten Tag! Ich würde gerne eine Wanze in Ihrem Telefon und eine Kamera in Ihrem Wohnzimmer installieren. Jemand klingelt an der Tür. Würdest Du ihn reinlassen?

Slide 38

Slide 38

Allgemeine Erklärung der Menschenrechte

Slide 39

Slide 39

Slide 40

Slide 40

Patent von Google

Slide 41

Slide 41

Hello Barbie

Slide 42

Slide 42

Slide 43

Slide 43

Slide 44

Slide 44

Ich möchte ein Spiel mit Euch spielen!

Slide 45

Slide 45

  1. Meinen Vor- und Nachnamen

Slide 46

Slide 46

  1. Meinen Vor- und Nachnamen 2. Mein Geburtsdatum

Slide 47

Slide 47

  1. Meinen Vor- und Nachnamen 2. Mein Geburtsdatum 3. Meine aktuelle Adresse

Slide 48

Slide 48

Meinen Vor- und Nachnamen Mein Geburtsdatum Meine aktuelle Adresse Meine Bankverbindungsdaten

Slide 49

Slide 49

Meinen Vor- und Nachnamen Mein Geburtsdatum Meine aktuelle Adresse Meine Bankverbindungsdaten Alle meine online Suchanfragen

Slide 50

Slide 50

Meinen Vor- und Nachnamen Mein Geburtsdatum Meine aktuelle Adresse Meine Bankverbindungsdaten Alle meine online Suchanfragen Namen, Telefonnummern und Fotos von jedem meiner gespeicherten Kontakte

Slide 51

Slide 51

Meinen Vor- und Nachnamen Mein Geburtsdatum Meine aktuelle Adresse Meine Bankverbindungsdaten Alle meine online Suchanfragen Namen, Telefonnummern und Fotos von jedem meiner gespeicherten Kontakte 7. Meine sexuellen Präferenzen

Slide 52

Slide 52

170 X “Gefällt mir” gedrückt

Slide 53

Slide 53

Ressources

Slide 54

Slide 54

Sustainable Webdesign Sustainable UX BilRess Netzwerk Ind.ie

Slide 55

Slide 55

Ethical Design Manifesto

Slide 56

Slide 56

Takeaways

Slide 57

Slide 57

  • Performance Budget (z.B. 3 sek. bei mobiler Nutzung) - Performance ist User Experience - Privacy ist Teil des Designprozesses - Die wichtigste Designentscheidung ist oft ein einfaches „NEIN“

Slide 58

Slide 58

Challenge Reduziere dein Projekt um den Faktor 10.

Slide 59

Slide 59

Thanks dogoodux.com/nachhaltig-dcsn17