Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Responsive Web Design


Published on

Responsive Web Design ist mehr als nur der Einsatz flexibler Raster und Break Points. Wir zeigen die Elemente von Responsive Web Design und erklären den Unterschied zum Adaptive Design. Wir zeigen den Responsive Design Prozess, der sich vom klassischen Designprozesses zum Beispiel durch "mobile first" und den iterativen und agilen Ablauf.

Published in: Design, Technology, Business
  • Be the first to comment

Responsive Web Design

  1. 1. Mobile First Responsive Design think moto Sommercamp am Wannsee Jordi Tost Val Berlin, 29. August 2013
  2. 2. Was ist für euch Responsive Design?
  3. 3. Die 3 Grundlagen: 1. Fluid Grids 2. Flexible Media 3. Media Queries
  4. 4. Responsive Design ist viel mehr!
  5. 5. KONTEXT Was können wir über das “Web des Users” sagen?
  9. 9. der Benutzer erwarten, dass Mobile-Webseiten so schnell (oder schneller) wie Desktop-Webseiten laden
  10. 10. Wir haben nur
  11. 11. of responsive sites weigh the same in both their small screen view and large screen view
  12. 12. Mobile First is a philosophy that highlights the need to prioritize the mobile context when creating UX.
  13. 13. 1. Allows websites to reach more people.
  14. 14. 1. Allows websites to reach more people. 2. Forces designers to focus on core content and functionality (einfach bleiben!).
  15. 15. 1. Allows websites to reach more people. 2. Forces designers to focus on core content and functionality (einfach bleiben!). 3. Lets designers innovate and take advantage of new technologies (geolocation, touch events, etc).
  16. 16. Wie machen wir ein Mobile-First-Responsive-Design?
  17. 17. 1. Content First - Content Strategy - Information Architecture - Hierarchie / Prioritäten - 2-3 Ebenen
  18. 18. 2. Mit Mobile anfangen
  19. 19. 2. Mit Mobile anfangen
  20. 20. DER PROZESS
  21. 21. Der übliche Prozess
  22. 22. “It's impossible to predict all the complications of a responsive design up front. We need a more fluid workflow!” Andy Clarke (@Marlarkey)
  23. 23. Warum sollen wir überhaupt unseren Prozess ändern? - Bessere Leistung - Bessere Webseiten gestalten
  24. 24. “RWD comes under criticism for not being commercially viable. It’s because it’s trying to be shoe-horned into an existing, fixed-canvas, inflexible process.” Mark Boulton, on responsive worklflow
  25. 25. Der Responsive Prozess
  26. 26. VIELEN DANK!