Note #19021

I made a graph to show how the number of large hand tools stored in our garage has changed this last year…

Graph showing, over time, the number of large tools increasing as a rake, midi-spade, post holer, rake and others are acquired. Each acquired tool is labelled with what it is. However: a hatchet, a pickaxe and two log splitting axes are not labelled.

…but I forgot to label the axes.

×

Higher/Lower Datepicker

I’ve written before about the trend in web development to take what the web gives you for free, throw it away, and then rebuild it in Javascript. The rebuilt version is invariably worse in many ways – less-accessible, higher-bandwidth, reduced features, more fragile, etc. – but it’s more convenient for developers. Personally, I try not to value developer convenience at the expense of user experience, but that’s an unpopular opinion lately.

Screenshot showing a hovered hyperlink to "Digital Forest" on a list of green hosting providers in France.
Here’s a perfect example I bumped into earlier this week, courtesy of The Green Web Foundation. This looks like a hyperlink… but if you open it in a new tab/window, you see a page (not even a 404 page!) with the text “It looks like nothing was found at this location.”

In the site shown in the screenshot above, the developer took something the web gave them for free (a hyperlink), threw it away (by making it a link-to-nowhere), and rebuilt its functionality with Javascript (without thinking about the fact that you can do more with hyperlinks than click them: you can click-and-drag them, you can bookmark them, you can share them, you can open them in new tabs etc.). Ugh.

Date pickers

Particularly egregious are the date pickers. Entering your date of birth on a web form ought to be pretty simple: gov.uk pretty much solved it based on user testing they did in 2013.

Here’s the short of it:

  • Something you can clearly type a numeric day, month and year into is best.
  • Three dropdowns are slightly worse, but at least if you use native HTML <select> elements keyboard users can still “type” to filter.
  • Everything else – including things that look like <select>s but are really funky React <div>s, is pretty terrible.
Calendar datepicker with slider-based timepicker and no text-based fallback.
Calendars can be great for choosing your holiday date range. But pressing “Prev” ~480 times to get to my month of birth isn’t good. Also: what’s with the time “sliders”? (Yes, I know I’ve implemented these myself, in the past, and I’m sorry.)

My fellow Automattician Enfys recently tweeted:

People designing webforms that require me to enter my birthdate:

I am begging you: just let me type it in.

Typing it in is 6-8 quick keystrokes. Trying to navigate a little calendar or spinny wheels back to the 1970s is time-consuming, frustrating and unnecessary.

They’re right. Those little spinny wheels are a pain in the arse if you’ve got to use one to go back 40+ years.

Date "spinner" currently showing 20 December 2012.
These things are okay (I guess) on mobile/touchscreen devices, though I’d still prefer the option to type in my date of birth. But send one to my desktop and I will curse your name.

Can we do worse?

If there’s one thing we learned from making the worst volume control in the world, the other year, it’s that you can always find a worse UI metaphor. So here’s my attempt at making a date of birth field that’s somehow even worse than “date spinners”:

My datepicker implements a game of “higher/lower”. Starting from bounds specified in the HTML code and a random guess, it narrows-down its guess as to what your date of birth is as you click the up or down buttons. If you make a mistake you can start over with the restart button.

Amazingly, this isn’t actually the worst datepicker into which I’ve entered my date of birth! It’s cognitively challenging compared to most, but it’s relatively fast at narrowing down the options from any starting point. Plus, I accidentally implemented some good features that make it better than plenty of the datepickers out there:

  • It’s progressively enhanced – if the Javascript doesn’t load, you can still enter your date of birth in a sensible way.
  • Because it leans on a <input type="date"> control, your browser takes responsibility for localising, so if you’re from one of those weird countries that prefers mm-dd-yyyy then that’s what you should see.
  • It’s moderately accessible, all things considered, and it could easily be improved further.

It turns out that even when you try to make something terrible, so long as you’re building on top of the solid principles the web gives you for free, you can accidentally end up with something not-so-bad. Who knew?

× × ×

Using every car parking space in a supermarket car park

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

For the last six years I’ve kept a spreadsheet listing every parking spot I’ve used at the local supermarket in a bid to park in them all. This week I completed my Magnum Opus! A thread.

I live in Bromley and almost always shop at the same Sainsbury’s in the centre of town, here’s a satellite view of their car park. It’s a great car park because you can always get a space and it is laid out really well. Comfortably in my top 5 Bromley car parks.

After quite a few years of going each week I started thinking about how many of the different spots I’d parked in and how long it would take to park in them all. My life is one long roller coaster.

A glorious story from a man with the kind of dedication that would have gotten him far in CNPS back in the day (I wonder if Claire ever got past 13 points…).

This is the kind of thing that I occasionally consider adding to the list of mundane shit I track about my life. But then I start thinking about the tracking infrastructure and I end up adding far more future-proofing than I intend: I start thinking about tracking how often my hayfever causes me problems so I can correlate it to the time and the location data I already record to work out which tree species’ pollen affects me the most. Or tracking a variety of mood metrics so I can see if, as I’ve long suspected, the number of unread emails in my inboxen negatively correlates to my general happiness.

Measure all the things!

Big List of Naughty Strings

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

# Reserved Strings
#
# Strings which may be used elsewhere in code
undefined
undef
null
NULL

then
constructor
\
\\

# Numeric Strings
#
# Strings which can be interpreted as numeric
0
1
1.00
$1.00
1/2
1E2

Max Woolf

Max has produced a list of “naughty strings”: things you might try injecting into your systems along with any fuzz testing you’re doing to check for common errors in escaping, processing, casting, interpreting, parsing, etc. The copy above is heavily truncated: the list is long!

It’s got a lot of the things in it that you’d expect to find: reserved keywords and filenames, unusual or invalid unicode codepoints, tests for the Scunthorpe Problem, and so on. But perhaps my favourite entry is this one, a test for “human injection”:

# Human injection
#
# Strings which may cause human to reinterpret worldview
If you're reading this, you've been in a coma for almost 20 years now. We're trying a new technique. We don't know where this message will end up in your dream, but we hope it works. Please wake up, we miss you.

Beautiful.

The Cursed Computer Iceberg Meme

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

More awesome from Blackle Mori, whose praises I sung recently over The Basilisk Collection. This time we’re treated to a curated list of 182 articles demonstrating the “peculiarities and weirdness” of computers. Starting from relatively well-known memes like little Bobby Tables, the year 2038 problem, and how all web browsers pretend to be each other, we descend through the fast inverse square root (made famous by Quake III), falsehoods programmers believe about time (personally I’m more of a fan of …names, but then you might expect that), the EICAR test file, the “thank you for playing Wing Commander” EMM386 in-memory hack, The Basilisk Collection itself, and the GIF MD5 hashquine (which I’ve shared previously) before eventually reaching the esoteric depths of posuto and the nightmare that is Japanese postcodes

Plus many, many things that were new to me and that I’ve loved learning about these last few days.

It’s definitely not a competition; it’s a learning opportunity wrapped up in the weirdest bits of the field. Have an explore and feed your inner computer science geek.

How to beat Skyrim without walking

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

I don’t normally watch videos of other people playing video games. I’m even less inclined to watch “walkthroughs”.

This, though, isn’t a walkthrough. It’s basically the opposite of a walkthrough: this is somebody (slowly, painstakingly) playing through Skyrim: Special Edition without using any of the movement controls (WASD/left stick) whatsoever. Wait, what? How is such a thing possible?

That’s what makes the video so compelling. The creator used so many bizarre quirks and exploits to even make this crazy stupid idea work at all. Like (among many, many more):

  • Dragging a bucket towards yourself to “push” yourself backwards (although not upstairs unless you do some very careful pushing “under” your feet).
  • Doing an unarmed heavy attack to “stumble” forward a little at a time, avoiding the stamina loss by eating vegetable soup or by cancelling the attack (e.g. by switching quickselected arrows), which apparently works better if you’re overencumbered.
  • Mid-stumble, consuming a reagent that paralyses yourself to glitch through thin doors. Exploit a bug in dropping gear for your companion near an area-change doorway to get all of the reagent you’ll ever need.
  • Rush-grinding your way to the Whirlwind Sprint shout and Vampire Lord “Bats” ability so you’ve got a way to move forward quickly, then pairing them with paralysis to catapult yourself across the map.
  • When things get desperate, exploiting the fact that you can glitch-teleport yourself places by commanding your companion to go somewhere, quicksaving before they get there, then quickloading to appear there yourself.

This video’s just beautiful: the cumulation of what must be hundreds or thousands of person-hours of probing the “edges” of Skyrim‘s engine to discover all of the potentially exploitable bugs that make it possible.

I’m On Fire

P2 user badge for me, showing my job title and team as "Code Magician on Fire"

In 2020 at @automattic my team, Alpha, forked into teams Fuel and Fire (I’ll tell you the story another time). But it took ’til now for me to notice that our internal systems use something like the string ${jobTitle} on ${teamName}. Which leads to this excellent title.

×

Best Before

Thanks, supermarket bagels, for expressing exactly how I was feeing when I reached the kitchen this morning:

Label: Best Before 8 Jan 2021.

COVID Ipsum

So I made a COVID conspiracy theory-themed lorem ipsum generator:

I blame my friend Bryn, who put the idea into my head while he was coming up with fake COVID conspiracy theories (I realise this sentence makes it sound like there are real COVID conspiracy theories) on a WhatsApp group we’re both in:

WhatsApp conversation: Bryn says that it's easy to come up with COVID conspiracy theories, Dan says somebody should make a Lorem Ipsum generator based on them.
This is about the minimum level of encouragement I need to do just about anything in tech.

It’s implemented using perchance, a platform for creating random text generators that I’ve been playing with – sometimes with the kids – lately. It’s really easy to use and provides a kind of instant-satisfaction that I think is important if you want to inspire the next generation of software engineers. This means, among other things, that you can clone, edit, and mashup my tool: perhaps you can make it better! Or perhaps you’ll use perchance to write some fiction, or poetry, or something else entirely. But regardless, I’d encourage you to have a play.

Mostly my generator comes up with meaningless gibberish, nonsense, and laughable claims. So it’s marginally more-trustworthy than your typical COVID conspiracy theorist.

×

Endpoint Encabulator

(This video is also available on YouTube.)

I’ve been working as part of the team working on the new application framework called the Endpoint Encabulator and wanted to share with you what I think makes our project so exciting: I promise it’ll make for two minutes of your time you won’t seen forget!

Naturally, this project wouldn’t have been possible without the pioneering work that preceded it by John Hellins Quick, Bud Haggart, and others. Nothing’s invented in a vacuum. However, my fellow developers and I think that our work is the first viable encabulator implementation to provide inverse reactive data binding suitable for deployment in front of a blockchain-driven backend cache. I’m not saying that all digital content will one day be delivered through Endpoint Encabulator, but… well; maybe it will.

If the technical aspects go over your head, pass it on to a geeky friend who might be able to make use of my work. Sharing is caring!

To the future occupants of my office at the MIT Media Lab

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Hi. My name is Ethan Zuckerman. From 2011-2020, I enjoyed working in this office. I led a research group at the Media Lab called the Center for Civic Media, and I taught here and in Comparative Media Studies and Writing. I resigned in the summer of 2019, but stayed at the lab to help my students graduate and find jobs and to wind down our grants. When COVID-19 hit in March 2020, I left campus and came back on August 14 to clean out my office and to leave you this note.

I’m leaving the note because the previous occupant left me a note of sorts. I was working here late one night. I looked up above my desk and saw a visegrip pliers attached to part of the HVAC system. I climbed up to investigate and found a brief note telling the MIT facilities department that the air conditioning had been disabled (using the vice grips, I presume) as part of a research project and that one should contact him with any questions.

That helped explain one of the peculiarities of the office. When I moved in, attached to the window was a contraption that swallowed the window handle and could be operated with red or green buttons attached to a small circuitboard. Press the green button and the window would open very, very slowly. Red would close it equally slowly. I wondered whether the mysterious researcher might be able to remove it and reattach the window handle. So I emailed him.

I’m reminded of that time eleven years ago that I looked up the person who’d gotten my (recycled) university username and emailed them. Except Ethan’s note, passed on to the next person to occupy his former office at MIT, is much cooler. And not just because it speaks so eloquently to the quirky and bizarre culture of the place (Aber’s got its own weird culture too, y’know!) but because it passes on a slice of engineering history that its previous owner lived with, but perhaps never truly understood. A fun read.

7 things we know about the nun reading ‘Boys’ Life’ in ‘Airplane!’

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

A nun reading Boy's Life and a boy reading Nun's Life

It’s one of the best visual gags in a movie filled with them.

In the classic 1980 comedy Airplane!, two passengers are seen reading magazines. First, we see a nun reading Boys’ Life. Moments later, there’s a boy reading Nuns’ Life.

The scene is over in seconds, but the memory of this joke lives on. That’s especially true for those of us who have been reading Boys’ Life since we were kids.

Here are seven things you might not know about this bit of visual humor.

Of the many things I love, here are two of them:

  • The Airplane series of movies.
  • People who, like me, get carried away researching something trivial and accidentally become an expert in a miniscule field.

This fantastic piece takes a deep dive into a tiny scene in Airplane. What issue of Boys’ Life was the nun reading? What page was she looking at? What actual magazine was the boy reading within the Nuns’ Life cover? These and more questions you never thought about before are answered!

My 1:1 with the Queen

This is a repost promoting content originally published elsewhere. See more things Dan's reposted.

Americans often ask what our relationship is with the Queen. I thought I’d upload my most recent 1:1 so you could see how the regular yearly 1:1 progress chats go.

As a Brit who does software engineering alongside a team from all over the rest of the world… I wish I’d thought of making this video first.