Download as PDF, PPTX
Uploaded byCristiano Rastelli
Adaptive, Responsive, Mobile. A liquid web.
The document discusses responsive, adaptive, and mobile web design. It provides an overview of the differences between responsive and adaptive approaches. It notes that context is changing as mobile usage increases and discusses tools and techniques for liquid, responsive design including visual frameworks, prototyping tools, and testing on real devices. The document recommends embracing this changing context by measuring user behavior across devices and taking a different approach to data analysis and content delivery.
More Related Content
Similar to Adaptive, Responsive, Mobile. A liquid web.
![Responsive Design Studio [Mountain View 2013]](https://cdn.slidesharecdn.com/ss_thumbnails/responsivedesignstudiomountainview-131018101452-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
![Responsive Design & Beyond [Code & Creativity Workshop]](https://cdn.slidesharecdn.com/ss_thumbnails/codecreativityworkshop1-140506164731-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
Adaptive, Responsive, Mobile. A liquid web.
- 1. Cristiano Rastelli -Consumer Team Adaptive, Responsive, Mobile. A liquid web.
- 2. Index • Premises • Responsive.Adaptive. Mobile. • Liquid web. Numbers. • Tools & Techs. • VisualDNA.
- 3. WEB We are talkingabout + + * but not only *
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20. markboulton.co.uk/journal/gridset-and-the-red-pill Responsive design istime-consuming. Not just writing the code, but all the way back to content requirements, typography, layout, managing client needs and expectations, Q.A and bug testing. Making websites this way adds time. In some cases, too much. Or rather, we’re spending time on the wrong things. Mark Boulton
- 21. If you’re makingwebsites, chances are you’ve given some thought to what constitutes a responsive-friendly design process — and you’ve probably found that adding a mockup for every breakpoint isn’t a sustainable approach. www.alistapart.com/articles/responsive-comping-obtaining-signoff-with-mockups/
- 22. Using a predefinedgrid seems to make as much sense as using a predefined colour scheme. www.alistapart.com/articles/the-infinite-grid/
- 23.
- 24. one design fitsall sizes
- 25. www.zeldman.com/2011/12/29/state-of-the-web-of-apps-devices-and-breakpoints/ Zeldman Responsive design isnot dead; it has only begun. It is not a panacea but was never intended to be. It is simply the beginnings of an approach.
- 26.
- 27.
- 33.
- 34.
- 35. PC vs. SmartphoneShipments Source: Canalys 2011
- 36. Global Mobile vs.Desktop Internet Users Source: Morgan Stanley 2011 overtaking this year?
- 37.
- 38. Where are peopleusing mobile devices? Source: Compete's Quarterly Smartphone Report 84% 80% 76% 69% 64% 62% 47% at home during miscellaneous downtime throughout the day waiting in lines of waiting for appointments while shopping at work while watching TV during commute in to work
- 39. twitter.com/gluca/status/312849923466985472 Gianluca Diegoli I realizedthat it's the mobile experience that determines what then I use in my desktop. For example, Pinterest for iOS is lousy, and then…
- 40.
- 41.
- 42.
- 43.
- 44.
- 45.
- 46.
- 47. Money. Not onlyuser-experience!
- 48. CONTEXT A shift inthe of web usage
- 49.
- 50.
- 51. Test with realdevices!
- 54.
- 55.
- 56.
- 57.
- 58.
- 59.
- 60.
- 61.
- 62.
- 63.
- 64.
- 65.
- 66.
- 67.
- 68.
- 69.
- 70.
- 71.
- 72.
- 73.
- 74.
- 75.
- 76. Testing Tools LiveView For Mac,iPhone & iPad zambetti.com/projects/liveview/
- 77.
- 78.
- 79. • Context ischanging. We must embrace it. • Measure/track users in specific devices. • Different approach to quiz & data analysis.
- 80.
- 81. Cristiano Rastelli -Consumer Team THANK YOU
- 82.
- 83.
- 84.