Responsive Web Design: The Real Web 2.0 (Presented at UXPA Boston 2013)
- 29,107 views
Not unlike most human twenty-two year olds, the Internet has been going through some changes over the past couple of years. It has continued to grow exponentially in size, scope, and responsibility. …
Not unlike most human twenty-two year olds, the Internet has been going through some changes over the past couple of years. It has continued to grow exponentially in size, scope, and responsibility. Designers and developers used to create for a single “device” (the desktop monitor) with only one contextual setting (sitting in-front of said monitor). Now, every professional device and most toys come with the ability to access the Internet via a browser. This takes a once simple process and throws several new variables at once: · What are the capabilities of the device? · What size is the device? · What are the capabilities of the browser on the device? · What’s the contextual setting of the user?
The answers to these questions lie in a collaborative effort between experience designers, visual designers, and developers. The waterfall processes of “you do your thing and I’ll do mine” are being rendered obsolete; falling to a more cyclical and iterative approach. Designers (both experience and visual) are more hard-pressed than ever to learn code; developers to learn contextual design and basic design principles, all while keeping projects on-time and on-budget. With our presentation, we aim to exhibit our best practices—using a design studio approach—for creating a responsive web design with a multi-disciplinary group. We’ll run through the initial sketching exercises used to get all parties thinking responsively—making sure to frame not only visual elements, but also the contextual experience for each breakpoint. We’ll transition into pain-free methods to get designers and developers coding together for faster prototyping. Throughout it all, we’ll highlight the success of these methods, which were used to teach a team at a major financial institution how to work more succinctly and effectively, from sketching to critiques to coding.