I played a lot Lords of Midnight (and Doomdark’s Revenge) on my Amstrad 464 when I was a kid. Turns out there’s a dedicated labour of love to port the games to modern platforms. I just downloaded the OS X port, so there goes my weekend.
Sunday, April 11th, 2021
Wednesday, December 30th, 2020
Flash, from the very beginning, was a transitional technology. It was a language that compiled into a binary executable. This made it consistent and performant, but was in conflict with how most of the web works. It was designed for a desktop world which wasn’t compatible with the emerging mobile web. Perhaps most importantly, it was developed by a single company. This allowed it to evolve more quickly for awhile, but goes against the very spirit of the entire internet. Long-term, we never want single companies — no matter who they may be — controlling the very building blocks of the web.
Tuesday, September 29th, 2020
I think it holds up pretty well. There’s one interaction pattern in particular that I think has stood the test of time. In the talk, I introduce this pattern as something you can see in action on Huffduffer:
I was thinking about how to tell the user that something’s happened without distracting them from their task, and I thought beyond the web. I thought about places that provide feedback mechanisms on screens, and I thought of video games.
So we all know Super Mario, right? And if you think about when you’re collecting coins in Super Mario, it doesn’t stop the game and pop up an alert dialogue and say, “You have just collected ten points, OK, Cancel”, right? It just does it. It does it in the background, but it does provide you with a feedback mechanism.
The feedback you get in Super Mario is about the number of points you’ve just gained. When you collect an item that gives you more points, the number of points you’ve gained appears where the item was …and then drifts upwards as it disappears. It’s unobtrusive enough that it won’t distract you from the gameplay you’re concentrating on but it gives you the reassurance that, yes, you have just gained points.
I think this a neat little feedback mechanism that we can borrow for subtle Ajax interactions on the web. These are actions that don’t change much of the content. The user needs to be able to potentially do lots of these actions on a single page without waiting for feedback every time.
On Huffduffer, for example, you might be looking at a listing of people that you can choose to follow or unfollow. The mechanism for doing that is a button per person. You might potentially be clicking lots of those buttons in quick succession. You want to know that each action has taken effect but you don’t want to be interrupted from your following/unfollowing spree.
You get some feedback in any case: the button changes. Maybe the text updates from “follow” to “unfollow” accompanied by a change in colour (this is what you’ll see on Twitter). The Super Mario style feedback is in addition to that, rather than instead of.
I’ve made a Codepen so you can see a reduced test case of the Super Mario feedback in action.
Here’s the code available as a gist.
It’s a function that takes two arguments: the element that the feedback originates from (pass in a DOM node reference for this), and the contents of the feedback (this can be a string of text or it can be HTML …or SVG). When you call the function with those two arguments, this is what happens:
spanelement and puts the feedback contents inside it.
- Then it positions that element right over the element that the feedback originates from.
- Then there’s a CSS transform. The feedback gets a
translateYapplied so it drifts upward. At the same time it gets its opacity reduced from 1 to 0 so it’s fading away.
- Finally there’s a
transitionendevent that fires when the animation is over. Once that event fires, the generated
Still, even if the code could benefit from an update, I’m pleased that the underlying pattern still holds true. I used it recently on The Session and it’s working a treat for a new Ajax interaction there (bookmarking or unbookbarking an item).
If you end up using this unobtrusive feedback pattern anyway, please let me know—I’d love to see more examples of it in the wild.
Sunday, July 5th, 2020
Notes on the old internet, its design and frontend.
Thursday, April 23rd, 2020
Well, this is a fun bit of CSS. Instantly transform a web page into a blast from the past (1998, to be precise).
Saturday, February 15th, 2020
- Wrong: web workers will take over the world
- Wrong: Safari is the new IE
- Right: developer experience is trumping user experience
- Right: I’m better off without a Twitter account
- Right: the cost of small modules
- Mixed: progressive enhancement isn’t dead, but it smells funny
Maybe I should do one of these.
Tuesday, April 9th, 2019
Stylish! Retro! Sciency!
Monday, May 28th, 2018
Sunday, March 4th, 2018
Tuesday, October 4th, 2016
Monday, September 26th, 2016
Seb is going to be closing out the Brighton Digital Festival with a bang.
Seb unravels all the geeky details about how your favourite retro gadgets work, including Nintendo light guns, Casio keyboards and the cathode ray tube televisions that once dominated our living rooms.
It’s going to be like Seb: The Musical …with lasers.
Sunday, July 3rd, 2016
Saturday, June 11th, 2016
A lovely little native app:
The world’s most advanced camera for your mini pocket computer.
View source for added nostalgia/flashbacks.
Oh, and RTFM.
Tuesday, July 29th, 2014
Over 700 screenshots of ZX Spectrum games, captured by Jason Scott. Some of these bring back memories.
Tuesday, March 18th, 2014
Yaili is documenting the process of retrofitting ubuntu.com to be responsive. I’ll be avidly reading each post in this series.
Tuesday, August 27th, 2013
I would love to have a ticker-tape machine for my tweets.
Thursday, February 21st, 2013
Dispatches from the disturbing town of Scarfolk, where it is permanently the 1970s:
Scarfolk is more than its famous sewage treatment works, it’s more than its high security mental facilities; it’s more than its world renowned covens; it’s more than its fine reputation which it rebuilt after a spate of grizzly serial killings…
It’s funny and creepy in equal measure. Actually, the creepiness may be the larger measure.
Thursday, August 23rd, 2012
The not-so-new-but-hella-fun aesthetic.
Thursday, July 12th, 2012
The Old Aesthetic. It’s eighties-tastic!
Wednesday, May 2nd, 2012
The Old Aesthetic.