Krystal’s excellent annotated collection of onboarding examples.
Interviews with the designers who make on-screen interfaces for sci-fi films.
Choosing the right input type for your form field.
Some interesting interface ideas here for informing users when a service worker is doing its magic.
In the future users may expect a site to work offline after visiting again, but until this happens, I think it is a good idea to let the users know about this feature.
This is witchcraft. I’ve been deconstructing the CSS to figure out how this works and it’s really clever.
(Hint: try commenting out some of the CSS and see what happens.)
An entertaining presentation from South By Southwest on the UI element of last resort.
It’s funny because it’s true.
The trouble with overflow menus is that you didn’t actually take anything away, you just obnoxiously obfuscated it.
Words of warning and advice from Daniel.
Instead of prioritizing, we just sweep complexity under the rug and pretend that it doesn’t exist.
Jason breaks down the myths of inputs being tied to device form factors. Instead, given the inherent uncertainty around input, the only sensible approach is progressive enhancement.
Now is the time to experiment with new forms of web input. The key is to build a baseline input experience that works everywhere and then progressively enhance to take advantage of new capabilities of devices if they are available.
Accessibility Matters: Meet Our New Book, “Inclusive Design Patterns” (Pre-Release) – Smashing Magazine
I think it’s a safe bet that this new book by Heydon will be absolutely brilliant.
It’s a handbook with valuable, time-saving techniques that will help you avoid hacky workarounds and solve common issues effectively.
Striking that balance between the reusability of modular components and maintaining a big-picture vision of the overall design:
We should always strive to use patterns in an application. For example, consistent use of colors and font sizes can quickly indicate to the user elements in the UI that can be interacted with. However, avoid using a pattern just because it has been implemented before; rather, use it because it really solves the problem at hand.
A catalogue of objects and observations from cities around the world.
You’re supposed to be able to create two-handled sliders with
input type="range" but the browser support isn’t there yet. In the meantime, Lea has created a nice lightweight polyfill.
Here’s a nice little pattern from Dave—showing data tables one column at a time on smaller screens.
Our Harry’s in the New York Times! Well, an article on dark patterns is in the New York Times, and Harry is Mr. Dark Patterns.
Here’s a well put-together collection of common patterns that are now much easier thanks to flexbox.