271: Principles of Design
Design Details
The Importance of Adherences in Pattern Design
People often say affordances when they mean signifiers and vice versa. So for example, like an X on a view is a signifier that the view can be closed. It's not an affordance of the closeability of that view. I think you just need to get away from that in general because it's super confusing. Like, is this saying what I'm doing right now or what I will be doing when I tap on it?
This week, we dive deep on several design principles that will help you make better decisions when creating interfaces and interactions. In Follow-up, we discuss the etiquette of responding to recruiter emails, and in News, we cover Twitter's latest exploration into presence and status. And as always, we share a couple cool things, including an innovative basketball shoe and an updated personal site.
Self-sponsor:
This week's episode was brought to you by the Spec Job Board
If you're a designer or a developer, or if you're looking to hire one, check out the Job Board on Spec.fm. With listings at $100/month, it's super affordable to find your next hire through Spec.
Follow-up:
- Here's Morgan Knutson’s tweetstorm again, for reference
News:
- MG Seigler tweeted: "As redundant as it may sound at first, I love the Twitter “status” idea. A throwback to OG Twitter too! (Still don’t love the idea of presence though.)"
- Article: "Twitter tests new profile features, including presence indicators and ‘ice breakers’"
- Site: Spec.fm now has a "global player" that continues playing as you browse
Listener Question:
- Dmitry Veremchuk (@d_ver on Twitter) asks: "Is there a limit to number of the side projects one takes on? Because personally, I am interested in animation, video editing, illustration, programming, photography, and many more things. Starting projects in all of these fields would be daunting and of a low quality."
Discussion:
- Site: Jon Yablonski collected these Laws of UX
- Fitts' Law: "The time to acquire a target is a function of the distance to and size of the target."
- Article: Luke Wroblewski wrote "Designing for Large Screen Smartphones"
- Material Design: Floating Action Button
- FABs in Material Design 2.0 can be centered for better reachability
- Action sheets in Apple's Human Interface Guidelines
- Jakob's Law: "Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know."
- Loren Brichter introduced pull-to-refresh in Tweetie
- Video: "Loren Brichter on Tweetie"
- Apple uses scroll-jacking on their Mojave site
- Bock's Law: "Most people don't have the newest shit."
- Note: The "grandparent phone" Marshall was thinking of is called Jitterbug
- Wenni's Principle: "Don't move tap targets."
- The Doherty Threshold: "Productivity soars when a computer and its users interact at a pace (<400ms) that ensures that neither has to wait on the other."
- Article: "Improved Perceived Performance with Skeleton Screens"
- Hick's Law: "The time it takes to make a decision increases with the number and complexity of choices."
- Video: "The paradox of choice | Barry Schwartz"
- Book: "Thinking Fast and Slow" by Daniel Kahneman
- "Faster Horses" is a quote by Henry Ford
- Miller's Law: "The average person can only keep 7 (plus or minus 2) items in their working memory."
- Gestalt Grouping
- Law of Common Region: "Elements tend to be perceived into groups if they are sharing an area with a clearly defined boundary."
- Law of Proximity: "Objects that are near, or proximate to each other, tend to be grouped together."
- Law of Similarity: "The human eye tends to perceive similar elements in a design as a complete picture, shape, or group, even if those elements are separated."
- Image: iOS Settings
- GIF: Emergency Alert System
- Image: Don't Dead Open Inside
- r/dontdeadopeninside
- Affordance: "the qualities or properties of an object that define its possible uses or make clear how it can or should be used"
- Book: "The Design of Everyday Things" by Don Norman
- Article: "Norman Doors: Don’t Know Whether to Push or Pull? Blame Design."
- Video: "It's not you. Bad doors are everywhere."
- Article: "Affordances and Signifiers in Mobile Interface Design"
- GIF: Apple Music's Now Playing sheet
- Image: Confusing segmented controller (Which one is selected?)
- Did we miss your favorite law, rule, or principle? Do have one of your own principles? Let us know on Twitter :) or Spectrum
One Cool Thing:
- Marshall shared the new Air Jordan XXXIII
- Note: Marshall mistakenly called it the "Flight System," but it's really called "Fast-Fit". Way off.
- Brian shared his updated personal site
- Design Details Blog
- The Internet Archive Project
Design Details on the Web:
- We are @designdetailsfm
- Brian is @brian_lovin
- Marshall is @marshallbock
- @Sarahberus and @Luperdev make us sound smarter than we are
- Join the conversation on Spectrum or leave us a review on iTunes
Stinger:
BYEEEEEEE!
The AI-powered Podcast Player
