Journal tags: notes

9

UX London 2024 closing keynotes

Alright, so last week I gave you the low-down on each day of this year’s UX London:

  1. Tuesday, June 18th focuses on UX research,
  2. Wednesday, June 19th focuses on product design, and
  3. Thursday, June 20th focuses on design ops and design systems

But the line-up for each day wasn’t quite complete. There was a mystery slot at the end of each day for a closing keynote.

Well, I’m very happy to unveil the trio of fantastic speakers who will be closing out each day…

A suave dapper man with brown eyes, a close-cropped dark beard and punky hair in a stylish light blue suit against a white background. A middle-aged white man on stage with a microphone gesticulating as he stares into the future. A young white woman with dark hair smiling in front of a grey backdrop.

Rama Gheerawo is the closing speaker on day one. Rama will show you how to frame inclusive design in the context of UX.

I’ve been trying to get Rama for UX London for the past few years but the timings never worked out. I’m absolutely delighted that I’ve finally managed to nab him! His talk is guaranteed to be the perfect inspirational ending for day one.

Matt Webb is giving the closing keynote on day two. Matt will show what it’s like to live and work with AI. You know my scepticism on this topic but even I have to hand it to Matt; he’s finding ways to use these tools to create true delight.

Honestly it feels like a bit of a cheat getting Matt to wrap up the day—his talks are always incredibly entertaining so I feel like I’m taking the easy route. If you’ve seen his appearances at dConstruct you’ll know what I mean.

Maggie Appleton is the final speaker on the final day of UX London. Maggie will show you how to explore designing with large language models. Again, even a sceptic like me has a lot to learn from Maggie’s level-headed humanistic approach to AI.

I’m so happy to have Maggie speaking at UX London. Not only am I a huge fan of her website, but I also love her presentation style. She’s going to entertain and educate in equal measure, and she’s certain to leave us with some fascinating questions to ponder.

With that, the line-up for UX London 2024 is complete …and what a stellar line-up it is!

Grab your ticket if you haven’t already, either for the full full three days or if you can’t manage that, day tickets are available too.

Use this discount code to 20% of the ticket price: JOINJEREMY. I’d love to see you there!

This week

It’s been another busy week of evening activities that ended up covering a range of musical styles.

Monday

On Monday night I went to the session at The Fiddler’s Elbow. It’s on every fortnight. The musicians are always great but the crowd can be more variable. Sometimes it’s too rowdy for comfort. But this week was perfect, probably because not many people are going out in late (dry) January.

The session, led by fiddler Ben Paley was exceptionally enjoyable. Nice and laid back, with a good groove.

Tuesday

On Tuesday night I stayed in and watched a film. Killers Of The Flower Moon. Two thumbs up from me.

Wednesday

On Wednesday evening it was the regular session at The Jolly Brewer. Jolly good it was too.

Thursday

On Thursday night I was back in The Jolly Brewer. My friend Rob roped me into doing a Burns Night thing. “It’s not a session, but it’s not a gig” was how he described it. I wasn’t sure what to expect.

We had been brushing up on our Scottish tunes, but we were mostly faking it. In the end it didn’t matter. I don’t think there was a single Scottish person there. But there was a good crowd enjoying their tatties and neeps with suitably-addressed haggis while we played our tunes in the background.

Some more musicians showed up: a fiddler and two banjo players. “Isn’t there old-time music here tonight?” they asked. We told them that no, it was Burns Night, but why not play some old-time tunes anyway?

So I passed the night jamming along to lots of tunes I didn’t know. I hope I wasn’t too offputting for them. It was good fun.

Friday

Finally on Friday evening it was my turn to leave my mandolin at home and listen to some music instead. The brilliant DakhaBrakha were playing out at Sussex Uni in the Attenborough Centre.

Imagine if Tom Waits and Cocteau Twins came from Eastern Europe and joined forces. Well, DakhaBrakha are even better than that.

I think I first heard them years ago on YouTube when I came across a video of them playing at KEXP. The first song caught my attention, then proceeded to mercilessly hold my attention captive until I was completely at their mercy—the way it builds and builds is just astonishing! I’ve been a fan ever since.

The gig was brilliant. I was absolutely blown away. I highly recommend seeing them if you can. Not only will you hear some brilliant music, you’ll be supporting Ukraine.

Слава Україні!

This week

Socialising in England usually follows a set pattern. You work during the week. You go out on the weekend.

This week I’ve been doing the exact opposite. I’ve been out every weeknight and I plan to stay in all weekend.

Monday

On Monday Jessica and I took a trip up to London. Dinner in Chinatown followed by a film in the Curzon cinema in Soho.

Usually dinner and a movie would be a fun outing, but this was a more sombre affair. The film we saw was The Zone Of Interest followed by an interview with the director, Jonathan Glazer.

The film is officially released in February. This was an advance screening organised by The Wiener Holocaust Library. Jessica is a member, which is how we got our invitations.

I was unsure whether the framing device of The Zone Of Interest would work. The hidden camera set-up could’ve come across as gimicky. But it worked all too well. The experience was disturbingly immersive, thanks in no small part to the naturalistic performances. Not showing the other side of the wall was the right decision—hearing the other side of the wall was incredibly effective. The depth of research that went into this project was palpable. It not only succeeded in its core task of showing the banality of evil, it also worked on a meta level, displaying the banality of the remembrance of evil.

See this film. And see it projected if you can.

Tuesday

With the heaviness of Monday evening still rightly staying with me, I was glad to have an opportunity to lose myself in music for a while. There was an impromptu Irish music session at the lovely Hand In Hand brewpub in Kemptown. It’s usually more of a jazz venue, but my friend Robb who works there convinced them to try a more folky evening.

The session was nice and intimate—just five of us playing. The pub was busy and everyone seemed to really appreciate the music. Me, I just really got into playing jigs and reels with my talented friends.

Wednesday

Whereas the session in the Hand in Hand was an impromptu affair, the session in the Jolly Brewer is regular as clockwork. Every Wednesday evening at 8 o’clock, rain, hail, or shine.

It was particularly good this week. Sometimes you just lock into a groove and everything clicks.

Thursday

Enough with the culture—time for some good hard science!

I hadn’t been to a Brighton Astro meetup in ages. Their monthly lectures are usually on the first Thursday of the month, which clashes with the session in the Ancient Mariner in Hove. But this month’s gathering was an exception, which meant I could finally make it.

Professor Malcolm Longair from the University of Cambridge was ostensibly speaking about the James Webb Space Telescope, but the talk ended up being larger in scope. The over-riding message was that we get the full picture of the universe by looking at all the frequencies of the electromagnetic spectrum—not just visible light, but not just infrared either.

It was so great to see how Brighton Astro has grown. It started life years ago as a meetup in the Clearleft building. Now it gets over a hundred people attending every month.

Friday

The weekend starts now. Apart from Salter Cane band practice tomorrow morning, I plan to stay in and stay cosy.

Image previews with the FileReader API

I added a “notes” section to this website eight years ago. I set it up so that notes could be syndicated to Twitter. Ever since then, that’s the only way I post to Twitter.

A few months later I added photos to my notes. Again, this would get syndicated to Twitter.

Something’s bothered me for a long time though. I initially thought that if I posted a photo, then the accompanying text would serve as a decription of the image. It could effectively act as the alt text for the image, I thought. But in practice it didn’t work out that way. The text was often a commentary on the image, which isn’t the same as a description of the contents.

I needed a way to store alt text for images. To make it more complicated, it was possible for one note to have multiple images. So even though a note was one line in my database, I somehow needed a separate string of text with the description of each image in a single note.

I eventually settled on using the file system instead of the database. The images themselves are stored in separate folders, so I figured I could have an accompanying alt.txt file in each folder.

Take this note from yesterday as an example. Different sizes of the image are stored in the folder /images/uploaded/19077. Here’s a small version of the image and here’s the original. In that same folder is the alt text.

This means I’m reading a file every time I need the alt text instead of reading from a database, which probably isn’t the most performant way of doing it, but it seems to be working okay.

Here’s another example:

In order to add the alt text to the image, I needed to update my posting interface. By default it’s a little textarea, followed by a file upload input, followed by a toggle (a checkbox under the hood) to choose whether or not to syndicate the note to Twitter.

The interface now updates automatically as soon as I use that input type="file" to choose any images for the note. Using the FileReader API, I show a preview of the selected images right after the file input.

Here’s the code if you ever need to do something similar. I’ve abstracted it somewhat in that gist—you should be able to drop it into any page that includes input type="file" accept="image/*" and it will automatically generate the previews.

I was pleasantly surprised at how easy this was. The FileReader API worked just as expected without any gotchas. I think I always assumed that this would be quite complex to do because once upon a time, it was quite complex (or impossible) to do. But now it’s wonderfully straightforward. Story of the web.

My own version of the script does a little bit more; it also generates another little textarea right after each image preview, which is where I write the accompanying alt text.

I’ve also updated my server-side script that handles the syndication to Twitter. I’m using the /media/metadata/create method to provide the alt text. But for some reason it’s not working. I can’t figure out why. I’ll keep working on it.

In the meantime, if you’re looking at an image I’ve posted on Twitter and you’re judging me for its lack of alt text, my apologies. But each tweet of mine includes a link back to the original note on this site and you will most definitely find the alt text for the image there.

Associative trails

Matt wrote recently about how different writers keep notes:

I’m also reminded of how writers I love and respect maintain their own reservoirs of knowledge, complete with migratory paths down from the mountains.

I have a section of my site called “notes” but the truth is that every single thing I post on here—whether it’s a link, a blog post, or anything else—is really a “note to self.”

When it comes to retrieving information from this online memex of mine, I use tags. I’ve got search forms on my site, but usually I’ll go to the address bar in my browser instead and think “now, what would past me have tagged that with…” as I type adactio.com/tags/... (or, if I want to be more specific, adactio.com/links/tags/... or adactio.com/journal/tags/...).

It’s very satisfying to use my website as a back-up brain like this. I can get stuff out of my head and squirreled away, but still have it available for quick recall when I want it. It’s especially satisfying when I’m talking to someone else and something they say reminds me of something relevant, and I can go “Oh, let me send you this link…” as I retrieve the tagged item in question.

But I don’t think about other people when I’m adding something to my website. My audience is myself.

I know there’s lots of advice out there about considering your audience when you write, but when it comes to my personal site, I’d find that crippling. It would be one more admonishment from the inner critic whispering “no one’s interested in that”, “you have nothing new to add to this topic”, and “you’re not quailified to write about this.” If I’m writing for myself, then it’s easier to have fewer inhibitions. By treating everything as a scrappy note-to-self, I can avoid agonising about quality control …although I still spend far too long trying to come up with titles for posts.

I’ve noticed—and other bloggers have corroborated this—there’s no correlation whatsover between the amount of time you put into something and how much it’s going to resonate with people. You might spend days putting together a thoroughly-researched article only to have it met with tumbleweeds when you finally publish it. Or you might bash something out late at night after a few beers only to find it on the front page of various aggregators the next morning.

If someone else gets some value from a quick blog post that I dash off here, that’s always a pleasant surprise. It’s a bonus. But it’s not my reason for writing. My website is primarily a tool and a library for myself. It just happens to also be public.

I’m pretty sure that nobody but me uses the tags I add to my links and blog posts, and that’s fine with me. It’s very much a folksonomy.

Likewise, there’s a feature I added to my blog posts recently that is probably only of interest to me. Under each blog post, there’s a heading saying “Previously on this day” followed by links to any blog posts published on the same date in previous years. I find it absolutely fascinating to spelunk down those hyperlink potholes, but I’m sure for anyone else it’s about as interesting as a slideshow of holiday photos.

Matt took this further by adding an “on this day” URL to his site. What a great idea! I’ve now done the same here:

adactio.com/archive/onthisday

That URL is almost certainly only of interest to me. And that’s fine.

Other people’s weeknotes

Paul is writing weeknotes. Here’s his latest.

Amy is writing weeknotes. Here’s her latest.

Aegir is writing weeknotes. Here’s his latest.

Nat is writing weeknotes. Here’s their latest.

Alice is writing weeknotes. Here’s her latest.

Mark is writing weeknotes. Here’s his latest.

I enjoy them all.

Posting to my site

I was idly thinking about the different ways I can post to adactio.com. I decided to count the ways.

Admin interface

This is the classic CMS approach. In my case the CMS is a crufty hand-rolled affair using PHP and MySQL that I wrote years ago. I log in to an admin interface and fill in a form, putting the text of my posts into a textarea. In truth, I usually write in a desktop text editor first, and then paste that into the textarea. That’s what I’m doing now—copying and pasting Markdown from the Typed app.

Directly from my site

If I’m logged in, I get a stripped down posting interface in the notes section of my site.

Notes posting interface

Bookmarklet

This is how I post links. When I’m at a URL I want to bookmark, I hit the “Bookmark it” bookmarklet in my browser’s bookmarks bar. That pops open a version of the admin interface tailored specifically for links. I really, really like bookmarklets. The one big downside is that they don’t work on mobile.

Text message

This is something I knocked together at Indie Web Camp Brighton 2015 using the Twilio API. It’s handy for posting notes if I’m travelling somewhere and data is at a premium. But I don’t use it that often.

Instagram

Thanks to Aaron’s OwnYourGram service—and the fact that my site has a micropub endpoint—I can post images from Instagram to my site. This used to happen instantaneously but Instagram changed their API rules for the worse. Between that and their shitty “algorithmic” timeline, I find myself using the service less and less. At this point I’m only on their for the doggos.

Swarm

Like OwnYourGram, Aaron’s OwnYourSwarm allows me to post check-ins and photos from the Swarm app to my site. Again, micropub makes it all possible.

OwnYourGram and OwnYourSwarm are very similar and could probably be abstracted into a generic service for posting from third-party apps to micropub endpoints. I’d quite like to post my check-ins on Untappd to my site.

Other people’s admin interfaces

Thanks to rel="me" and IndieAuth, I can log into other people’s posting interfaces using my own website as the log-in, and post to my micropub endpoint, like this. Quill is a good example of this. I don’t use it that much, but I really should—the editor interface is quite Medium-like in its design.

Anyway, those are the different ways I can update my website that I can think of right now.

Syndication

In terms of output, I’ve got a few different ways of syndicating what I post here:

Just so you know, if you comment on one of my posts on Facebook, I probably won’t see it. But if you reply to a copy of one of posts on Twitter or Instagram, it will show up over here on adactio.com thanks to the magic of Brid.gy and webmention.

A little progress

I’ve got a fairly simple posting interface for my notes. A small textarea, an optional file upload, some checkboxes for syndicating to Twitter and Flickr, and a submit button.

Notes posting interface

It works fine although sometimes the experience of uploading a file isn’t great, especially if I’m on a slow connection out and about. I’ve been meaning to add some kind of Ajax-y progress type thingy for the file upload, but never quite got around to it. To be honest, I thought it would be a pain.

But then, in his excellent State Of The Gap hit parade of web technologies, Remy included a simple file upload demo. Turns out that all the goodies that have been added to XMLHttpRequest have made this kind of thing pretty easy (and I’m guessing it’ll be easier still once we have fetch).

I’ve made a little script that adds a progress bar to any forms that are POSTing data.

Feel free to use it, adapt it, and improve it. It isn’t using any ES6iness so there are some obvious candidates for improvement there.

It’s working a treat on my little posting interface. Now I can stare at a slowly-growing progress bar when I’m out and about on a slow connection.

Notes from a small website

A week ago, I tweeted:

After a long weekend of coding, I’ve got a brand new section on my website.

http://adactio.com/notes/

But that tweet did not originate on Twitter. That tweet is a copy. The original is here.

To be honest, I’ve never been that pushed about having my own bite-sized updates hosted on my own site and syndicated out to Twitter. I’m much more concerned about my photos. Still, I thought it was pretty cool the way that Chloe, Aaron, Amber, and Barnaby have a “notes” section on their sites hosting the canonical URLs of their updates, so I thought I’d give it a shot too.

Michael Bester has written about his online homesteading process. You can also read—or listen toChloe’s process.

Creating a new section on my own site is pretty straightforward. My home-rolled CMS is really creaky and ropey but it gets the job done. The notes section is just another kind of post, same as journal, links, and articles. The tricky bit (for me) was figuring out how to post a copy to Twitter.

It was pretty clear which API method I needed to use. The hard part was all the OAuth stuff. I’ve never meddled with that kind of voodoo before.

I signed into dev.twitter.com and created an application called adactio.com. I’m given an API key and an API secret. This application will only never need to post as me, so I was able to take advantage of single-user OAuth to generate my access token and access token secret:

By using a single access token, you don’t need to implement the entire OAuth token acquisition dance.

Now I had the four pieces I needed to send with a status update:

  1. my consumer key,
  2. my consumer secret,
  3. my access token, and
  4. my access token secret.

I found a small PHP library that uses Andy’s OAuth code. Looking at the source code, I was able to figure out what I needed to send to Twitter. The OAuth class is doing all the hard work—my PHP code is fairly basic.

Imagine my surprise when it actually worked.

I fiddled around with my site’s crude templating system so that if I’m logged into my little CMS, I’m presented with a simple update form on the front page of adactio.com.

Speak your brains on Dribbble

When I type a note into that form and hit “post”, here’s what happens:

  1. I store the note in my own database.
  2. I send a copy to Twitter as a status update.
  3. Twitter returns a JSON object with info about the tweet I just created.
  4. I take the ID of that tweet and store it in my database along with the original note.

Having the ID of the copy on Twitter allows me to provide some Twitter-specific actions from my own site: reply, retweet, fave, etc.

Note on Dribbble

Okay, so now I’m posting to Twitter from my own site. Nifty! But what about receiving notifications from Twitter? If someone replies to, or likes, or favourites the copy of my note on Twitter, it would be nice to get notified about it on adactio.com.

This would be a really complex problem to attempt to solve for myself, but fortunately I don’t have to. Brid.gy is a magical tool written by Ryan Barrett that you can authorise to watch your Twitter profile. It will send a webmention back to the canonical URL on your own site whenever anyone replies to, or retweets or favourites a post.

Because I’ve already got webmentions on my site, Brid.gy worked straight out of the gate—a lovely demonstration of some small pieces, loosely joined.

Responses on Dribbble

Like I said, I wasn’t all that pushed about hosting my own short updates but now that I’m doing it, I’m really, really enjoying it. It feels good.

It feels good to be using my own website for “microblogging”. I know that’s a distasteful phrase but it’s a fairly accurate way of describing how I tend to use Twitter. My earliest tweets definitely feel like short blog posts.

Conversely, looking back on how I was blogging very early on, a lot of those short posts feel like tweets. So it feels good to bring those notes back to adactio.com.