Responsive Webdesign ist aus den Trendcharts auch 2014 nicht vom Thron gestoßen worden. Und so wird sicherlich auch 2015 von dem Hype profitieren. Die technischen Möglichkeiten scheinen nahezu komplett, um dies auch technisch hochwertig umzusetzen. Und trotzdem scheitern eklatant viele RWD-Projekte oder das Ergebnis ist lediglich ein Umsortieren des Contents für verschiedene Geräte.Dies liegt vor allem daran, dass allen Beteiligten der Responsive Webdesign Workflow nicht wirklich bewusst ist. Dieser erfordert ein Umdenken in allen Positionen. Agentur, Freelancer, Kunde, Designer - alle müssen akzeptieren, dass sich der Prozess verändern muss.Und dies ist auch logisch, wenn man sich den RWD-Workflow einmal genauer ansieht. Der Talk geht genau auf diesen Prozess ein, beleuchtet diesen intensiv und zeigt Möglichkeiten für Entscheider, Grafiker aber auch Web-Worker auf, wie man RWD überhaupt vernünftig und ohne Risiko verkauft bekommt, wie man dem Workflow optimal folgt, wie Verträge im RWD-Universum aussehen und wie man seine Abnahme am Ende des Projekts trotzdem optimal hinbekommt.

1. Warum Responsive Webdesign
scheitern muss...
Patrick Lobacher
GF +Pluswerk GmbH
02.09.2014

2. Disclaimer:
Keine Technik!
Patrick Lobacher
GF +Pluswerk GmbH

3. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Patrick Lobacher
Geschäftsführer +Pluswerk GmbH
• 43 Jahre, glücklich verheiratet, wohnhaft in München
• Selbständig im Bereich Webentwicklung seit 1994
• Autor von 10 Fachbüchern und > 50 Fachartikeln zum
Thema TYPO3 und Webentwicklung
• Speaker, Trainer, Consultant, Coach, Nerd
Veröffentlichungen:
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

4. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Agentur für digitale Kommunikation
+[ 10 ] Standorte in Deutschland
+[ 130 ] Mitarbeiter
+[ 999 ] realisierte Projekte mit Magento und TYPO3
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

6. Zuerst dachte ich,
das wäre gutes
RWD, aber dann
habe ich 10
schreckliche Fehler
entdeckt!!
Besonders der 7.
wird Dein Leben für
immer verändern!
http://heftig.co/

7. Bullshit Bingo
© RTL
Die 10 peinlichsten RWD FehlerPlatz 10

8. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Ich habe den Artikel von
Ethan Marotte gelesen -
also bin ich fit in RWD!!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

9. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://alistapart.com/article/responsive-web-design
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

10. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
RWD = Media Queries +
Fluid Grids +
Flexible Images
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

11. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
http://www.slideshare.net/slideshow/embed_code/14528526

12. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

13. Bullshit Bingo
© RTL
Platz 9

14. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Design First - wie immer!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

15. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
• RWD bei einer „führenden“
Kommunikationsagentur für einen
Enterprise Kunden:
• 3 Designvorschläge
• 30 Seitentypen
• 6 Break-Points (7 Darstellungen)
• >> 540 (ausgedruckte) PSD-Dateien <<
• > 150.000 EUR nur für das Design
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

16. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
• Der Design-Prozess muss sich „radikal“
ändern
• Mobile-First! (Content-First)
• Kein Layout mehr
• Iterativ (Agil)
https://www.flickr.com/photos/gernot/134998970/
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

17. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://smm.zoomquiet.io/data/20110511083224/index.html
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

18. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://bradfrostweb.com/blog/post/atomic-web-design/ http://patternlab.io/
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

19. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://styletil.es/
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

20. Bullshit Bingo
© RTL
Platz 8

21. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
RWD ist schön und gut -
aber mit unseren Kunden
geht das nicht!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

22. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
• Killerphrase / Totschlagargument
• „Beharrungs-Killerphrasen“
sollen Veränderungen verhindern
• „Vertagungs-Killerphrasen“ sollen aus
Angst vor Fehlern Entscheidungen
hinauszögern
• Beispiel: „Das haben wir schon immer so
gemacht.“
• Beispiel: „Das ist mit unserem Kunden
nicht möglich.“
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

23. Bullshit Bingo
© RTL
Platz 7

24. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Wieviel kostet RWD mehr
als ohne?
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

25. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

26. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
• Verkaufen von Consulting
• Verkaufen von Workshops
• Agiler Festpreis!
• Preis ca.:
Bis zu 2x Frontend-Anteil
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

27. Bullshit Bingo
© RTL
Platz 6

28. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Unsere Verträge
funktionieren seit Jahren -
daher werden sie auch
mit RWD funktionieren!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

29. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Werkvertrag Time & Material
Agiler Festpreis
Budget-sicherheit
Anforderungs-flexibilität
Verhandlungs-aufwand
Schätz-sicherheit
Qualitäts-risiko
Kalkulations-transparenz
Festpreis
Aufwandspreis
Agiler
Festpreis
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
http://www.oose.de/

30. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
stuffandnonsense.co.uk/blog/about/contract-killer-3
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

31. Bullshit Bingo
© RTL
Platz 5

32. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
RWD? Klar, ich verwende
Bootstrap!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

33. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Bootstrap ≠ RWD
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

34. Bullshit Bingo
© RTL
Platz 4

35. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Wir machen RWD im
Wasserfall (wie immer!)
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

36. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Wasserfall-Vorgehenssmodell
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
1956

37. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
RWD
Planning / Contract F r o n tend
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
Proto-typing
Content
Strategy
Device
Testing
StyleTile
Content Atomic Design
Testing
Create
Content
Content
Wireframe
Linear
Design

38. Bullshit Bingo
© RTL
Platz 3

39. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Bei den paar Geräten
lohnt sich doch der
Aufwand nicht!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

40. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://www.timhordern.com/ http://www.businessinsider.com/android-fragmentation-2014-8
iPhone
iPad
iWatch
CarPlay
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

41. Bullshit Bingo
© RTL
Platz 2

42. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Testen? Kein Problem -
wir haben Simulatoren für
alle Zwecke!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

43. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
http://bradfrostweb.com/blog/post/techcrunch/
Carrier / Device Bugs / Performance
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

44. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

45. Bullshit Bingo
© RTL
Platz 1

46. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Was man nicht versteht,
wird schlecht gemacht!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

47. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Zensur!
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

48. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
2014 - Web Design - Bullshit Bingo
(Schrei: „BULLSHIT BINGO“ wenn eine Reihe oder Spalte komplett ist)
Off-Canvas Flat Design
Single Page
Web Design
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
Neon
Parallax
Scrolling
Responsive Web
Design
CSS3
Animations
Full-width Background
Images
Fullscreen
Typography
QR Codes
Infinite
Scrolling
Decoupled
CMS
Interactive
Infographics
Social Media
Badges
Black & White
Design
Simplified Design

49. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

50. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

51. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

52. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
1. Bad Web Performance
2. Slow Loading Time
3. Longer Checkout Time and Higher
Cart Abandonment Rate
4. Bad for Sales
5. Not an Affordable Web Development
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

53. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

54. Links

55. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Links
• http://www.creativebloq.com/responsive-web-design/
top-responsive-web-design-problems-and-how-
avoid-them-8122790
• http://weblog.404creative.com/2007/02/14/
website-mood-boards-a-successful-precursor-to-visual-
prototyping/
• http://styletil.es/
• http://samanthatoy.com/washington-examiner/
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

56. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Links
• http://responsivedesignworkflow.com/
• http://de.slideshare.net/stephenhay/
mobilism2012
• http://www.smashingmagazine.com/2012/09/28/
better-client-participation-in-responsive-design-
projects/
• http://dmduplessis.com/responsive-design-and-the-
art-of-being-busy/
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

57. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Links
• http://bradfrostweb.com/blog/post/atomic-web-design/
• http://maddesigns.de/responsive-workflow/#1
• http://stuffandnonsense.co.uk/projects/
contract-killer/
• https://gist.github.com/slashadmin/4555492
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

58. Zum Abschluß:
Responsive Web Design
benötigt Euer Umdenken!
Danke!

59. Fragen?
Oder komplett verwirrt?
Slides: www.lobacher.de/mtc14-rwd

60. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Pluswerk
10 Standorte in Deutschland
128 eigene Extensions
130 Mitarbeiter
5 Neos Websites
60 TYPO3 Experten
TYPO3 Association Platinum Member
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

61. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Portfolio - Lösungen
Strategie &
Consulting
- Digital Strategy
- E-Commerce Strategy
- Cross Channel Management
- Agile Consulting / Coaching
- Project Management
Performance
Marketing
- Conversion Optimization
- Search Engine Marketing (SEM)
- Search Engine Optimization (SEO)
- Social Media Marketing (SMM)
- Web Analytics
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
Websites &
Portale
- Corporate Websites
- Brand Sites
- Micro Sites
- Intranets & Extranets
- Mobile Applications
Technologie &
Systementwicklung
- CMS Development
- Enterprise Search
- CRM Development
- Systemintegration
- Software Development
Operations
- Content Management
- Content Localization
- Shop Management
- Support
- Hosting
E-Commerce
- Online Shops
- Mobile Commerce
- B2C / B2B
- Social Commerce
- Commerce Search

62. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Portfolio - Produkte
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

63. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Referenzen (Auszug: +Pluswerk/net-o-graphic/typofaktum/typovision)
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014

64. Responsive Webdesign verkaufen
Warum RWD scheitern muss… ]
Klassisch:
+Pluswerk GmbH
Patrick Lobacher
Solmstr. 6A
60486 Frankfurt am Main
Fon: +49 89 130 145 20
Email: lobacher@plus-werk.com
Web: www.plus-werk.com
!
Twitter:
www.twitter.com/PatrickLobacher
Facebook:
www.facebook.com/patrick.lobacher
Blog:
blog.lobacher.de
Schulungen:
www.lobacher.de
Google+:
plus.google.com/105500420878314068694
(c) 2014 - Patrick Lobacher | Warum Responsive Webdesign scheitern muss… | www.plus-werk.com | 02.09.2014
XING:
www.xing.com/profile/Patrick_Lobacher
LinkedIn
www.linkedin.com/pub/patrick-lobacher/
4/881/171
Slideshare:
www.slideshare.net/plobacher
Amazon:
www.amazon.de/Patrick-Lobacher/e/
B0045AQVEA
Kontakt

65. Besten Dank für Eure
Aufmerksamkeit!