Full Width [alt+shift+f] Shortcuts [alt+shift+k]
Sign Up [alt+shift+s] Log In [alt+shift+l]
22
My last post was on how ‘smart devices’ create overly complex designs by throwing in too many features and misusing their hardware. It showed how great design doesn’t need to be fancy. Design, in fact, can be free. This post wants to push those assumptions a bit, redesigning a product two ways: a modest improvement […]
over a year ago

Improve your reading experience

Logged in users get linked directly to articles resulting in a better reading experience. Please login for free, it takes less than 1 minute.

More from Scott Jenson

Design for a Small Planet

Back in 1971, “Diet for a Small Planet” by Frances Moore Lappé made it clear the costs of eating meat were far greater than we had assumed. If we wanted the planet to thrive, we needed to shift to a more resource-efficient way to eat. UX Design is going through its own “you cost too […]

2 weeks ago 14 votes
Reactive Haptics

When people think of haptics, they usually think of typing on mobile keyboards or tapping on trackpads. While impressive, these are fairly limited uses of haptics, both attempting to recreate a simple “click.” These are one-shot user events that don’t respond dynamically to the user. On the Android team, I explored a range of interactive […]

a month ago 23 votes
Tactile Controls In A Digital World

This article was written by Scott Jenson and Michael DiTullo and published at Core77 in April 2024 A few recent tech writers have leaked that the new AirPods case will likely have a touch screen. Other earbud makers have tried this as well but it’s Apple, so people will naturally have strong opinions, and we’re no […]

10 months ago 103 votes
Sotto Voce

“AI” and “The Cloud” are both hot topics, but couldn’t be more different. AI is new, unproven, and surrounded by hyperbole, whereas “The Cloud” is older, established, and broadly accepted. But online, criticism is mounting against both, not so much for the technology itself but for its misuse. Instead of waiting for big tech to […]

a year ago 99 votes
The invisible problem

Whenever I explain my research at Google into mobile text editing, I’m usually met with blank stares or a slightly hostile “Everyone can edit text on their phones, right? What’s the problem?” Text editing on mobile isn’t ok. It’s actually much worse than you think, an invisible problem no one appreciates. I wrote this post […]

a year ago 83 votes

More in design

Flow State and Surfing

Jack Johnson is on Rick Rubin’s podcast Tetragrammaton talking about music, film making, creativity, and surfing. At one point (~24:30) Johnson talks about his love for surfing and the beautiful flow state it puts him in: Sometimes I’ll see a friend riding a wave while I’m paddling out, and the thing I’ll see them do just seems like magic...I’ll think, “How in the world did they just do that?” And then on your next ride you’re doing the exact same thing without thinking but it’s all muscle memory and it’s all in this flow that you get into. That’s a really beautiful state to get into, to do something that feels like a magic trick, like something you shouldn’t be able to do, but all of the sudden you’re doing it. I’m not a surfer, and I can’t do effortlessly cool. But I know what a flow state feels like. Johnson’s description reminds me of that feeling when you get a little time on a personal project — riding the wave of working on your personal website. You open your laptop. You start paddling out. Maybe you see an internet friend who was doing something cool and you want to try it but you have no idea if you’ll be able to do it as well as they did. And before you know it, you’re in that flow state where muscle memory takes over and you’re doing stuff without even consciously thinking about it — stuff that others might look at and perceive as magic (cough anything on the command line cough) but it’s not magic to you. Intuition and experience just take over while you ride the wave. Ok, I’m a nerd. But I don’t care. It’s a great feeling, regardless of whether it’s playing an instrument, or surfing, or programming. That feeling of sinking into a craft you’ve worked at your whole life that you don’t have to think about anymore. Email · Mastodon · Bluesky

an hour ago 1 votes
Bidfood Pizza Academy by mode:lina

Bidfood Pizza Academy in Wrocław, designed by mode:lina™ studio, is a space dedicated to training and culinary workshops, where Italian...

7 hours ago 1 votes
UX or PX? Why naming matters

Weekly curated resources for designers — thinkers and makers.

2 days ago 5 votes
House of Olives by ARHINGinženjering

House of Olives is a building intended for the Association of Olive Growers of Montenegro as an administrative and educational...

2 days ago 3 votes
Don’t Forget the Meta Theme-Color Tag

Ever used a website where you toggle from light mode to dark mode and the web site changes but the chrome around the browser doesn’t? To illustrate, take a look at this capture of my blog on an iPhone. When you toggle the theme from light to dark, note how the website turns white but status bar stays black. Only once I refresh the page or navigate does the status bar then turn white. When the user changes the theme on my site, I want it to propagate all the way to the surrounding context of the browser. In this case, to the status bar on the iPhone. Like this: There we go! That’s what I want. So what was wrong? A popular way to indicate the active theme is to put a class on the root of the document, e.g. <html class="dark"> <style> html { background: white } html.dark { background: black } </style> </html> Then we simply add/remove the dark class when the user toggles the theme. But that will only change the in-page styles. It won’t tell the browser to update the color of whatever ambient user interface elements its drawing. For that, you’ll need the meta theme-color tag: The theme-color value for the name attribute of the <meta> element indicates a suggested color that user agents should use to customize the display of the page or of the surrounding user interface. So when you respond to the user changing their theme, don’t forget to update the <meta name='theme-color'> tag in addition to whatever you do to modify the in-page styles. That’ll give you the effect you want in the surrounding browser UI (for browsers that support it). Oh, and it’s worth pointing out: don’t forget the color-scheme property either. That’s what will tell the browser to update other in-page UI elements it draws. So, when responding to a user preference to update a website’s theme: Toggle some global attribute that triggers style changes for all your custom, in-page elements. Set the color-scheme property so the browser draws the things its responsible for correctly (form controls, scroll bars, etc.). Set the <meta name='theme-color'> value appropriately so contextual browser UI can adapt to your site’s styles. I wrote this post as a friendly reminder, because friends don’t let friends forget the meta theme-color tag. Email · Mastodon · Bluesky

3 days ago 5 votes