Full day training course

Scaling User Interfaces

Usability for Responsive Web Design and Other Approaches to Designing Websites for Multiple Devices

Your website cannot be designed only for a desktop experience. But designing purely for mobile phones is just as bad. In today’s multi-device world customers access the same site on smartphones, tablets, or desktop computers and expect the user experience to be optimized for them right now, on whatever platform they’re currently using. So how do you make a website that is usable, no matter what device your customer has in front of them?

Whether you’re using responsive design (RWD) or creating variations of your site for different devices, you need to know what’s important when adapting designs for different device sizes, screen sizes, input styles, output styles, and context of use. What content makes sense? How should navigation change across different screens? What should be the same and what should be different?

In this day-long seminar we discuss design similarities and differences across platforms and analyze the usability of many popular responsive-design patterns.

What We Don't Cover

The seminar is presented from a user-experience angle: that is, how to design what users see and do. We do not discuss implementation, such as the coding techniques that may be used to make a computer run these designs.

Topics

  • Behavioral differences between devices: desktop, tablets, and phones
  • Principles of good design
    • Cross-platform principles
    • Platform-specific principles
    • Calculating opportunity and interaction costs: how they vary across devices
  • Get answers for your strategy
    • Is responsive design right for you?
    • Responsive vs. adaptive design
    • Mobile first or desktop first?
  • Determine what  content and features to include and remove in your designs
  • Designing for a continuous experience across multiple devices
    • How to scale a UI up when there’s more screen space
    • How to scale a UI down for a smaller screen
  • How to scale interaction techniques for different  devices, while maximizing consistency in the user experience
    • Mouse vs. touch screen
    • How to deal with desktop features that don’t work well on other devices
      • Lightboxes, popups, modal dialogs
      • Inline scrolling
      • Fixed layouts and positioning
      • Hover text
  • Prioritize content on the page:
    • What information goes first
    • What information should be grouped together
    • What images are necessary or helpful
    • What navigation needs to be visible
    • What calls to action are appropriate across devices
  • Responsive-design patterns and their usability
    • Page layout and scrolling: grids and fluid layout patterns
    • Navigation and search: Accordion, hamburger menu, sliding menu, multiple navigation tiers 
    • Form design
    • Maps
  • Adaptive, reusable content:
    • How to write text so that it works across devices
    • Responsive images

Format

The basis of the course is a lecture format with a few group exercises to reinforce the learned principles and guidelines.

The course also includes:

  • Findings from our own usability studies
  • Videos from usability testing of people's behavior in response to a mobile design
  • Screenshots of mobile designs that work and don’t work, and why
  • Opportunities to ask questions and get answers

Companion Course

Mobile User Experience is a companion course to Scaling User Interfaces. Each course can be taken independently. Mobile User Experience covers:

  • Best practices for creating user-friendly mobile interfaces for phones and tablets
  • Apps versus websites
  • Considerations for touchscreen designs

Instructors

Raluca Budiu

Raluca Budiu is a Senior Researcher with Nielsen Norman Group. At NN/g she consults for clients from a variety of industries and presents tutorials on mobile and tablet usability, cognitive psychology for designers, and principles of human computer interaction. She coauthored the NN/g reports on tablet usability, mobile usability, iPad usability, and the usability of children's websites, and the book "Mobile Usability". Raluca also served as a judge for GSMA Global Mobile Awards 2012-2014 and Tabby Awards 2013. She holds a Ph.D. from Carnegie Mellon University. Read more about Raluca

Amy Schade

Amy Schade works with clients large and small in a variety of industries such as telecommunications, e-commerce, government, travel, automotive, music, publishing, banking, non-profit and education, including extensive work on corporate intranets. She has conducted worldwide user research, including longitudinal studies, remote studies and eyetracking research, running studies in the United States, Canada, Europe, Asia and Australia. Read more about Amy

Offered In:

Apply this course toward UX Certification

Experiencing Usability Week

At Usability Week, you get a full day of in-depth training with expert instructors. Learn more about why you should attend.