User Patterns

Class Slides

Conventions Are Your Friend - Don’t Make Me Think

  • Take Advantage of conventions
  • Create effective visual hierarchies
  • Break pages up into clearly defined area
  • Make it obvious what’s clickable
  • Eliminate distractions
  • Format content to support scanning

UX Myth #9 - Design has to be original

Hamburger Icon

Why and How to Avoid Hamburger Menus How to Sove the Hamburger Menu Problem

Hamburger Icon Problems

  • Lower Discoverability
  • Less Efficient
  • Clash with Platform Navigation Patterns
  • Not Glanceable

Dark Patterns

Dark Patterns are User Interfaces that are designed to trick people. Normally when you think of “bad design”, you think of laziness or mistakes. These are known as design anti-patterns. Dark Patterns are different – they are not mistakes, they are carefully crafted with a solid understanding of human psychology, and they do not have the user’s interests in mind.

darkpatterns.org
Dark Patterns: Deception vs. Honesty in UI Design
Dark Patterns: Inside the Interfaces Designed to Trick You

Patterns/Style Guides

Google Material Design Guidelines
Google Design and UI Guidelines
Mailchimp Pattern Library
Pattern Lab - Brad Frost

Pattern Resources

Responsive Patterns
Pattern Tap
UI Patterns
Design Patterns on Codepen
Mastering UI Patterns for Smarter Design
Mobile Patterns
pttrns.com
Hover States

Due on Monday Feb 8

  • Progress updates one on one meetings for Project 1
  • Review Chapters 13, 14, 15 of Duckett.
  • Read Chapters 6-7 of Krug
  • Read all of Shiffman, seminar will be February 10 (See syllabus about seminars)
  • Read How to use an HTML boilerplate