Your SlideShare is downloading. ×
 Responsive Design Techniques, Tools and Design Strategies with Paul Trani
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Responsive Design Techniques, Tools and Design Strategies with Paul Trani

412
views

Published on

Responsive design is all the rage right now, which has lead to some interesting approaches, frameworks, and tools. In this session Adobe Evangelist Paul Trani will review these approaches as well as …

Responsive design is all the rage right now, which has lead to some interesting approaches, frameworks, and tools. In this session Adobe Evangelist Paul Trani will review these approaches as well as showcase Edge Reflow—Adobe’s solution to responsive web design.

Published in: Business, Technology

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
412
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
16
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Responsive Design Techniques,Tools and Design StrategiesPiotr Walczyszyn | outof.me | @outof_me
  • 2. @outof_meFacts0,511,522009 2010 2011 2012 2013 2014 2015BilionsofusersMobile DesktopSource: ComScore survey 2012
  • 3. @outof_meFakty3.5 BILIONINTERNET CONNECTED DEVICES
  • 4. @outof_meResponsive Web Design
  • 5. @outof_meResponsive Web DesignEthanMarcotte
  • 6. @outof_meMay 2010 June 2011Responsive Web Design
  • 7. @outof_meResponsive Web DesignFlexible & FluidGridFlexibleImages &MediaMedia Queries
  • 8. @outof_meExamples
  • 9. @outof_meTechniques
  • 10. @outof_meTechniquesDesktop Down vs. Mobile First
  • 11. @outof_meTechniquesDesign First vs. Common Breakpoints
  • 12. @outof_meTechniquesPX Media Queries vs. EM Media Queries
  • 13. @outof_meTechniquesHorizontal & Vertical Media Queries
  • 14. @outof_meTools
  • 15. @outof_meEdge ReflowAdobe Edge Reflow
  • 16. @outof_meResources‣Tools‣Reflow - http://html.adobe.com/edge/reflow/‣Responsive Inspector - http://outof.me/responsive-inspector/‣RWD Frameworks:‣Bootstrap http://twitter.github.io/bootstrap/‣Frameless http://framelessgrid.com/‣Responsive Grid System http://responsive.gs/‣Responsive Grid System http://www.responsivegridsystem.com/‣Skeleton http://www.getskeleton.com/‣Unsemantic http://unsemantic.com/‣Image libraries:‣hisrc https://github.com/teleject/hisrc‣Responsive Enhance https://github.com/joshje/Responsive-Enhance‣Spriteme http://spriteme.org