A Process for Usability
May 14, 2013
Wouldn't you know it—I've been spending a crazy amount of my free time working on freelance projects. One in particular has been a joy to work on and we just launched. I'm speaking about the work I did on the new Polar topic pages. It's been about 8 months since we started the project. Luke, as always, has these awesomely crazy ideas about multi-device layouts and we really didn't hold back with this one. Check out Luke's write-up on the design thinking that went into the template. The design is truly device-agnostic, from featuring keyboard shortcuts for large keyboard-enabled devices to a nicely designed single column layout with off-canvas elements.
Comfortable to Use
One thing that was emphasized throughout the design and build was “comfortable to use" over conventional design. With tablets, you have a much more comfortable time interacting with content close to the sides and bottom of the viewport. It's a bit of a shock to see it at first, especially if you're on a desktop or laptop. But I think it works really well and love to use it. Voting on polls is easy on a tablet and the added keyboard shortcuts for desktop allows you to really focus on the content and interacting with it. Luke explains this well in his post:
Across all these devices from smartphone to desktop, our criteria for the Polar interface was “comfortable to use". That is we emphasized human ergonomics over typical visual design conventions. We wanted a design that was comfortable for phone, phablet, tablet, hybrid, laptop, and desktop users and adapted the interface as needed to align with how people use these distinct devices.
By thinking about the user intent and the wide range of devices that are out there, we were able to build something practical and I'm hoping it goes over well the the users of Polar.
Design Process for a Multi-Device Web
We were a small team of four working on this. What's important to note is that the designers worked closely with the developers and development started right out of the gate. The designers sketched/comped out ideas and the developers went to work coding it up with quick sprints and a bunch of back-and-forth. This was an enormously satisfying workflow because we were able to make decisions based on feedback from what the hell works in the browser. With such a complex layout and the goal being a comfortable experience for the user, we were in the thick of it right from the beginning and fed off of each other exploring different ideas. We'd have a sync-up every week and a lot of email. It worked beautifully. It was fun. It made everyone involved in the project take ownership of their role. The pristine photoshop graphics came in at the very end of the process once we figured out what worked and what didn't. I realize this has been hammered home by others but I imagine it's hard for teams to break out of the waterfall process.