Wir brauchen einen neuen Workflow

Vortrag am Webmontag in Kassel - Kurzform ohne große Erklärungen

Transcript

1. Wir brauchen einen
   neuen Workflow
   Jens Grochtdreis
   

   View Slide

2. ‣Kasselaner - seit 1988 in Mainz
   ‣Frontendentwickler
   ‣seit 1999 Arbeit im und fürs Web
   ‣seit 2009 selbständig
   ‣Frontendentwicklung
   ‣Schulung
   ‣Beratung
   ‣@Flocke
   

   View Slide

3. http://bradfrostweb.com/wp-content/uploads/2012/03/01-650x487.png
   

   View Slide

4. http://bradfrostweb.com/wp-content/uploads/2012/03/02-650x487.png
   

   View Slide

5. http://bradfrostweb.com/wp-content/uploads/2012/03/03-650x487.png
   

   View Slide

6. http://upload.wikimedia.org/wikipedia/commons/thumb/9/9c/PapierformateA0bisA8.jpg/1280px-PapierformateA0bisA8.jpg
   

   View Slide

7. http://www.flickr.com/photos/danm_cool/3163625498/
   

   View Slide

8. Frontendentwicklung ist
   nicht einfach!
   http://failblog.files.wordpress.com/2009/07/128932678618285916.jpg
   

   View Slide

9. http://bradfrostweb.com/blog/mobile/beyond-media-queries-anatomy-of-an-adaptive-web-design/
   

   View Slide

10. Kunde
    Beratung
    Konzept
    Design
    Frontend
    Backend
    Unser Workflow ist falsch!
    

    View Slide

11. Nicht einfach Befehle empfangen.
    http://www.flickr.com/photos/soldiersmediacenter/3521607551/
    Frontend
    Projektmanagement
    

    View Slide

12. http://www.flickr.com/photos/artrock2006/4177475479/
    Alle Beteiligten sollten frühzeitig
    offen kommunizieren.
    http://www.flickr.com/photos/artrock2006/4177475479/
    

    View Slide

13. Das passt nicht zu einem
    flexiblen Umfeld
    

    View Slide

14. http://icant.co.uk/talks/h5/pictures/jqueryeu/nokia-zombie-hammer.jpg
    Photoshop ist nicht für Webdesign geeignet.
    

    View Slide

15. Es heißt http:// nicht psd:// !
    

    View Slide

16. http://www.quadriform.biz/wp-content/uploads/2010/09/designer_developer.jpg
    Designer und Entwickler: ein Team!
    

    View Slide

17. http://styletil.es/
    

    View Slide

18. http://styletil.es/
    

    View Slide

19. http://styletil.es/
    

    View Slide

20. http://styletil.es/
    

    View Slide

21. http://styletil.es/
    

    View Slide

22. http://jsfiddle.net/Flocke/azvGv/
    CSS3-fähiger Browser IE8
    

    View Slide

23. Ein möglicher Workflow
    http://viljamis.com/img/blog/2012/workflow.png http://viljamis.com/blog/2012/responsive-workflow/
    

    View Slide

24. Photoshop sinnvoll nutzen
    

    View Slide

25. ‣ Photoshop soll nicht abgeschafft werden.
    ‣ Aber die aktuelle Bedeutung muss korrigiert
    werden.
    ‣ Photoshop Designs sind Idealbilder, keine
    Realitäten.
    ‣ Webseiten sind NIEMALS so wie ein
    Photoshop-Layout.
    

    View Slide

26. ‣ Früher direkt im Code arbeiten und echte
    Webseiten als Entwürfe zeigen.
    ‣ Mit Photoshop mehr Style Tiles erarbeiten.
    ‣ Screenshots an Stelle von Photoshop-
    Konstrukten
    ‣ Abgesegnet wird nicht das Photoshop-
    Bildchen, sondern die reale Umsetzung.
    ‣ Man kann die Realität testen, nicht
    schönmalen.
    

    View Slide

27. Komplexität nach aussen
    und innen kommunizieren
    und einplanen.
    

    View Slide

28. Testen!
    http://goo.gl/0q9rZ
    

    View Slide

29. Emulatoren sind nett, aber nichts gegen echte Endgeräte.
    http://idw-online.de/pages/de/image46078
    

    View Slide

30. Der Browser
    steht im Zentrum,
    nicht Photoshop!
    http://sharpsuits.net/photoshopit
    

    View Slide

31. Jens Grochtdreis
    http://grochtdreis.de
    http://twitter.com/Flocke
    http://webkrauts.de
    http://slideshare.net/Flocke669
    Diese Präsentation steht unter
    der Creative Commons Lizenz
    „Attribution-ShareAlike 2.0“
    http://creativecommons.org/licenses/by-sa/2.0/de/
    

    View Slide