Attending this course and passing the exam earns 1 UX Certification credit, which also counts towards the optional Interaction Design Specialty.
Learn more about NN/g's UX Certification Program.
UX for Responsive Sites
Usable Designs on Many Screen Sizes
What We Cover
What We Cover
- What is the same and what differs among devices: desktop, tablet, and phone
- Input
- Screen size
- Portability
- Context of use
- User behaviors and usage patterns
- Why it matters to the user experience
- Responsive, adaptive and device-specific design
- Advantages of each approach
- Desktop-first or mobile-first approaches
- Unified usability guidelines that hold on any device
- Cross-platform principles
- Platform-specific principles and constraints:
- How to apply cross-platform principles to specific devices
- Opportunity and interaction costs: how they vary across devices
- Content strategy: What content to include, add, or remove
- Importance of content prioritization
- Should content priorities vary by device or not?
- Using data, analytics, and business goals to prioritize content
- Layout and page priorities
- Information foraging: The importance of what’s at the top of the page
- Why the fold is still relevant
- How layout changes impact content prioritization
- Use of templates and their effect on content priorities
- Tools for dealing with layout change while preserving content priorities across devices
- Accordions, menus, links
- Presenting content across devices
- Tools for helping readers find information on a long page
- Adaptive content
- Scaling comparison tables and large data across devices
- Images and graphics
- Maintaining context on large and small screens
- Designing for different input types: mouse vs. touch
- Designs that work for touch and mouse
- Hover states and translating them to touchscreen
- Horizontal navigation and swiping
- Supporting scrolling on touchscreen devices
- Advantages and pitfalls of lightboxes, modals, and overlays across devices
- Navigation across devices
- Content-to-chrome ratio
- Should the navigation structures and the information architecture be the same across devices?
- Primary navigation
- Hidden navigation: hamburger and other menus
- Strengths and weaknesses
- Secondary navigation:
- Submenus, category landing pages, in-page navigation
- Footers and breadcrumbs
- Interaction flows across devices
- Form design
- Search
- Search placement and presentation
- The search icon
Format
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
UX Certification Credit
UX Certification Credit
Participant Comments
Participant Comments
"Extensive, clear, concise and insightful. The course reinforced approaches we should take, alerted us to consequences of other design solution as well helped build confidence by confirming decisions we've made on the fly when technology throws us a curve ball."
Michelle Narayan, Greenstone Financial Services
"I love that Amy shows the real-deal UX testing studies. That’s gold...and memorable!"
Justin Brylski, E- Learning Developer
"This was the perfect course to help me with responsive design/adaptive design concerns when I return to work. Thank you!"
Sarah Davies, Lexmark International
"This course gave language to the design principles we practice daily. It not only reinforced the known best practices but opened my eyes to use or customer behaviors I might not have expected. The comparison of desktop and handheld examples was very illuminating."
Bernadette Inzary, Velvet Hammer
More Participant Comments
"As a designer, this course has helped me tremendously in carefully selecting interactions and designing experiences in a world of rapidly changing and evolving devices. I greatly appreciate the insights from user research that will help me both in design and communicating these decisions to my team."
Becky Sroufe, Healthways, Inc.
"Raluca is a great speaker. She explains complicated topics very well and used plenty of real-world examples. I also appreciated that she took the time to answer everyone's questions."
Kelly King, Sounds True
"Great discussion of issues to take into account when designing for multiple devices — navigation discussion was especially helpful."
Lynne Venart, US Holocaust Memorial Museum
"I feel like responsive solutions vary so much from one project to the next. I appreciated the breadth of topics visited. It's a great foundation for any project w/o getting too specific."
"As with the Mobile UX course, this one day course on scaling UI gives you more than expected — in a compact and very close to the topic way. Speaker delivers it very clearly, always engaging audience in discussion. Absolute must-to-attend!!"
David Birman, Bank of Georgia
"Very engaging. Liked the amount of interaction. Liked the amount of video examples of real life scenarios. Definitely has given me a lot to apply to my job!"
"Amazing amount of insight and content, expertly presented in a day. Opened up the mind to more possibilities and solutions."
"I actually really liked it…..great material and good presentation — presenter allowed too many crowd interruptions and opinions which snowballed a bit — I would recommend telling them to hold their questions more."
Jim Bull, Phoenix Contact
"A must-take coure if you are designing websites for both desktop and mobile devices."
Hugh Quach, Alberta Gaming and Liquor Commission
"Great content on the subject matter — and thorough examples were fun to watch and useful for reference."
Saffron Davis, The Regional Municipality of York
"I took two of Amy's courses here at NN/g Conference and I'm so glad I did. I learned more than I had even hoped. Can't wait to take my learnings back and apply them to my work. Thank you Amy!"
Emily Brannon, Washington, DC
"She is great at answering off the cuff questions!!"
"Amazing class, very useful and practical info. A lot of content but very well organized."
Arnold Porras, NuSkin
"Great content, love the real world examples. Very knowledgeable presenter."
"Content was perfect. I learned so much from this course. I was able to take the course content and apply it directly to a design task that I have at work."
Tiffany Bennett, Quicken Loans
"High quality content. Great examples are shown to help us understand better. And great discussions in class."
Ellie Xu, Intel
What This Seminar Is About
In this day-long seminar we discuss unifying usability guidelines that apply regardless of device (smartphone, tablet, or desktop), as well as how to enhance and tailor user experiences by device. We also analyze the usability of popular responsive, adaptive, and mobile design patterns.
Why You Should Care About the Topic
In today’s multidevice world, customers access sites on smartphones, tablets, and desktop computers. Whether using responsive design, adaptive design, or creating separate site experiences, organizations need to support user tasks and create usable designs regardless of device. So how do you make a website that is usable, no matter what device your customers have in front of them?
What’s important when adapting designs for different devices, screen sizes, input styles, output styles, and contexts of use? What content makes sense? How should navigation change across screens? What should be the same and what should be different?
Andrew Morris
Hope Media
What We Don't Cover
This seminar focuses on the user experience of sites that work across devices: 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 create these designs.