Stephen Hay – Responsive Web Design Workflow

[ Transcript Available ] The web is no longer fixed width. Designs are more malleable than ever because of fluid grids, media queries, and everything else that comes with responsive web design. This makes using static photoshop comps as a deliverable unmanageable. Design workflows inevitably have to change and adapt as the way we design for the web evolves. In his virtual seminar, Responsive Web Design Workflow, Stephen Hay outlines how his workflow has changed in the face of new design processes. He believes that taking a content first approach is instrumental to working with fluid designs. This allows you to mold the design around the content instead of trying to fit the content into a fixed design. The audience had a bunch of great questions during the live seminar. Stephen joins Adam Churchill for this podcast to answer some of those questions. How do you represent graphic elements like images when designing in text? How do you translate content into semantic markup that isn’t in the vocabulary of markdown? What application do you use when designing in text? Is there any good use of lorem ipsum? Do you plan out how to display content, whether in tabs or accordions for example? What is typically the first thing presented to a client? What happens to the workflow with a increase of complexity? Do you show linear design in-browser or use a screenshot? Why should designers know how to code? Stephen also references this article by Karen McGrane in his podcast. Recorded: January, 2014 [ Subscribe to our podcast via ?This link will launch the iTunes application.] [ Subscribe with...

Jason Grigsby – Responsive Web Design with Mobile in Mind

[ Transcript Available ] Jason is joining us to teach one of the daylong workshops in Denver, CO April 7-9 as part of the UX Immersion Mobile Conference. For more information about Jason’s and 5 other workshops, visit uxim.co. With the mobile web, specifically m dot sites increasingly becoming a thing of the past, responsive web design has become common practice. The ability for your site to display across screen sizes and devices, reduces development time and allows for one design to work anywhere. However, this shouldn’t signal a shift away from mobile-first thinking. Jason Grigsby, of Cloud Four, believes that there are considerations that responsive design alone doesn’t address. The total experience of your site is more than just what it looks like. Simply using media queries to optimize your site’s design for different page widths is not a viable solution. Page weights, image sizes, and network speeds all need to be factored into the equation. In Jason’s mind, performance is a key differentiator. He says that you can have a beautiful design or the perfect user experience, but if your performance is bad, people won’t use it. Sites that look good and work well on the desktop may feel slow and bloated on a mobile device. Starting with performance in mind and considering mobile-first avoids these problems early in the process. Recorded: December, 2013 [ Subscribe to our podcast via ?This link will launch the iTunes application.] [ Subscribe with other podcast applications.] Full Transcript. Jared Spool: Hello there. Welcome, everybody, to another episode of the SpoolCast. Today’s a great day, because I’ve got the fabulous Jason...

Aaron Gustafson – Designing Across Devices with Progressive Enhancement

[ Transcript Available ] Responsive web design seems to come up in every other discussion or article about UX these days. And rightfully so as it’s an elegant way to make sure your design adapts to the multitude of devices on the market. But with the Internet of Things looming, it’s becoming more than just the visuals of your site that are of major concern. How your content displays on a car dashboard, “can a watch handle this page weight?”, or “is this refrigerator JavaScript enabled?” are not unrealistic issues moving forward. Aaron Gustafson believes that progressive enhancement can go a long way to addressing these questions. In his virtual seminar, Designing Across Devices with Progressive Enhancement, Aaron discusses strategies for layering the experience. By thinking of the interface as a continuum, it can not only adapt to devices, but can become more robust with browser capabilities. The audience had a lot of questions for Aaron during the live seminar and he joins Adam Churchill to address some of those in this podcast. How can you approach pages where JavaScript is required to complete a task? How do you prioritize design considerations? Are semantic ID classes useful? Are there performance issues with lazy-loading? When can we stop supporting older browsers? Recorded: December, 2013 [ Subscribe to our podcast via ?This link will launch the iTunes application.] [ Subscribe with other podcast applications.] Full Transcript. Adam: Welcome to another edition of the SpoolCast. Earlier this fall, Aaron Gustafson presented his virtual seminar, “Designing Across Devices with Progressive Enhancement.” The recording of this seminar has been added to our library of...

UIEtips: Progressive Enhancement and the Content-out Approach

Today, there exists a sea of design considerations like browsers, accessibility, device compatibility, and responsive or adaptive design. And with new techniques and devices coming out daily, it’s easy to feel overwhelmed. Fortunately, Aaron Gustafson knows how to wrangle all of these elements using progressive enhancement. With his practical approach, he designs for humans on any spectrum – with and without javascript enabled. In 2011, he published Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement. In today’s UIEtips, we’re pleased to publish an excerpt from Aaron’s book which discusses how progressive enhancement can serve your users by giving them access to content without technological restrictions. On November 21, Aaron will present our next virtual seminar, Designing Across Devices with Progressive Enhancement. If you’re trying to create a better web – and are open to rethinking how you approach designing for any interface, then you need to join us for Aaron’s seminar. Here’s an excerpt from the article: Fundamentally, progressive enhancement is about accessibility, but not in the limited sense the term is most often used. The term “accessibility” is traditionally used to denote making content available to individuals with “special needs” (people with limited motility, cognitive disabilities, or visual impairments); progressive enhancement takes this one step further by recognizing that we all have special needs. Our special needs may also change over time and within different contexts. When I load up a website on my phone, for example, I am visually limited by my screen resolution (especially if I am using a browser that encourages zooming) and I am limited in my ability to interact with buttons and...

Designing Across Devices with Progressive Enhancement

On November 21, we’re presenting the next UIE Virtual Seminar—Designing Across Devices with Progressive Enhancement, with Aaron Gustafson. Today, there exist sea of design considerations like browsers, accessibility, device compatibility, and responsive or adaptive design. And with new techniques and devices coming out daily, it’s easy to feel overwhelmed. Fortunately, Aaron Gustafson knows how to wrangle all of these elements using progressive enhancement. With his practical approach, he designs for humans on any spectrum ­­ with and without javascript enabled—and soon enough, you will, too. You’ll learn how to: Create experiences without technological constraints Stop assuming users are just like you Make a content­-first approach work Establish a solid strategy for planning Aaron was a top speaker at our UI17 conference in Boston.  If you’re trying to create a better web and are open to rethinking how you approach designing for any interface, then you need to join us for Aaron’s seminar....