Join James Williamson for an in-depth discussion in this video Building responsive mockups, part of Responsive Design Fundamentals.
- View Offline
Responsive design is so new that many of the tools needed to assist designers simply don't exist yet.…That's especially true for wireframing and prototyping tools.…The existing programs and processes are, for the most part, still tied to fixed-width layouts,…which forces designers to find ways to adapt existing tools to evolving workflows.…As with any emerging process, people are still experimenting with techniques that work best for them.…I'm going to cover a few approaches, including my own, to creating responsive mockups, and…then discuss how designers are currently using existing tools to assist their responsive design workflow.…
Often I see people start by attempting to create pixel-perfect versions of their layouts…for different devices or screen sizes.…This could result in building anywhere between three to six versions of each mockup, covering…smartphones, tablets, desktops, interactive TVs, and portrait and landscape versions for each device type.…As you can imagine, creating mockups for each of these stages and tweaks isn't very efficient.…
- What is responsive design?
- Controlling viewports
- Designing for multiple screen densities
- Working with media queries
- Using fluid grids
- Building responsive forms
- Optimizing site performance
- Building responsive mockups
- Developing a content strategy
- Designing for mobile capabilities
- Creating flexible HTML
- Testing responsive designs