Great trick by Brad Frost, in which he combines prefers-reduced-motion? with the <picture> element <picture> <source srcset="no-motion.jpg" media="(prefers-reduced-motion: reduce)"></source> <img src="animated.gif alt="brick wall" /> </picture> Yes, that actually works! Reducing motion with the <picture> element → 💫 When taking prefers-reduced-motion into account in your CSS code, it becomes really powerful when combined with CSS Variables
Tag Archives: ux
Reducing motion with the
Beyond the interface – The Sameness of Apps and Websites
Friend Thomas Byttebier – Digital Director at Base Design – has written a very insightful post on the sameness of apps, websites, subway maps, and coffee shops. Why do all apps look the same nowadays? Why do all websites look the same? What can brands do to create more memorable digital experiences? And also: how […]
Building Better Forms™ by not taking away affordances
Don’t fiddle too much with your forms‘ look and feel. A small innocent-looking piece of CSS, even when combined with semantically correct HTML, could leave you with a degraded User Experience and make your forms less Accessible. Yesterday I went to see Girl at Kinepolis. Whilst ordering tickets I ran into an issue though: after […]
Mozilla Hacks: Designing the Flexbox Inspector
With the upcoming release of Firefox 65 (due January 29tgh), its DevTools will sport a new shiny Flexbox Inspector. The new Flexbox Inspector, created by Firefox DevTools, helps developers understand the sizing, positioning, and nesting of Flexbox elements. Victoria Wang details how they UX challenges that came with this tool were tackled. Built on the […]
How Apple can fix 3D Touch
Eliz Kılıç writes down something that’s been bothering me too: Apple introduced 3D Touch and its new related interactions Peek and Pop in 2014. It’s been almost 4 years since its first introduction, yet people don’t know/use 3D Touch. Why would they? Even tech-savvy users don’t know which buttons offer 3D touch. Let alone regular […]
How to reposition multiple iOS apps at the same time
TIL: You can move multiple iOS apps at the same time. Tap and hold to start wiggling one, move it a little, then tap other apps to add ‘m to the stack you’re moving. Did this help you out? Like what you see?Consider donating. I don’t run ads on my blog nor do I do […]
Dribble Inspired Todo Empty State Transition implemented in React Native
Ooh this is nice. Uses a simple Animated.Value which is animated from 0 to 1. Said value is only defined once – in a wrapping component – and is passed on to the various children as a prop. react-native-todo-empty-state-transition →
Easily share Wifi Passwords with friends on iOS 11
When a nearby contact with an iOS device wants to connect to a hotspot you are familiar with (e.g. your device knows the password), you can easily share the password with their device: It’s small additions like this that put a smile on my face 🙂
“Username or Password Incorrect” is Bullshit
There’s a security best practice where sign ins aren’t supposed to say “password is incorrect”. Instead they’re supposed to say the “username or password is incorrect”. This “best practice” is bullshit. […] You gain no security, yet your customers lose clarity. At first I raised my eyebrow when reading this, yet it became clear rather […]
Removing that ugly :focus ring (and keeping it too)
David Gilbertson: You click a button and see a blue border telling you that you’ve clicked on something that you know perfectly well you’ve just clicked on — because you just clicked on it. So it’s clear: the outline must go. But hold on a minute, what about those users that don’t/can’t use a pointing device? They […]