#about unsung

Meta posts talking about this very blog / 8 posts

Newsletter
  • Get a newsletter digest every Friday:
Contact

Send me feedback, tips, bug reports, and anything else:

About me and the blog

My name is Marcin Wichary (he/him). I’ve worked as a UX designer, typographer, front-end person, and manager at Google, Medium, and Figma. I’ve also written a book about keyboards and typing, gave talks, and published essays about design, typography, and technology.

Unsung is my blog about software craft and quality.

More info about Unsung

Send me feedback, tips, bug reports, and anything else:

More info about Unsung

Unsung @ 500: Behind the scenes

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

A few people recently asked about my writing and publication process, so this post is for anyone who’s interested in that.

The process

My present goal is posting every day, and at least eleven posts a week. This is arbitrary and will change; I’m making sure I’m enjoying it, and paying attention to burnout.

I have at this point hundreds of unfinished posts, or snippets of posts, or just two-three-four-word ideas. I try to jot them down whenever they pop into my head. Here’s a lil sample:

How I choose to publish something on a given day is a bit of a mystery even to myself. I generally try to listen to what inspires me. I’m always excited when a blog post or a YouTube video arrives that makes me want to share it on the spot. The original idea for Unsung was to do only this kind of stuff, but that doesn’t happen as often.

Sometimes, it’s your emails or messages that prompt a post (thanks!). Sometimes, I try to be strategic about “if I want to post about Y, it’d be good to first have posted about X” – for example, I needed to write about menu secrets before writing about Move Item Here). But I try not to overthink it; once you start considering all the dependencies, it really becomes an escape room.

I sometimes mark items with [NEXT] or [SHOULD] or [READY] or [EASY] – this is not markup, these are just words to help orient myself – but it’s kind of a mess.

I made a dashboard to help me steer clear of blind alleys over time. Some patterns I’m trying to avoid: writing just from me instead of linking to other things, or relying too much on YouTube videos. Recently I noticed I wrote a lot about keyboards and old things, so I added a few charts to monitor these patterns, too.

I try to do both of these at once:

  • Recognize that something I wrote or explored ended up not that interesting, and stop the presses. But I don’t delete these posts – maybe a better story or a more interesting take will save them in the future:
  • Get something out there even if I don’t feel it’s perfect, just to keep the momentum.

This “pull stuff that’s boring/​push stuff out anyway” seesaw feels hard to navigate, but I think it’s important to practice and pretty universal to creative process.

Lastly, I occasionally look at the stats of the weekly digests to see how I’m doing, but mostly they serve as celebration – yet another week of stuff in the books.

Infrastructure

It’s really hard to say why I find things motivating, or how I know something is interesting, or even how I do my research – these feel personal or come from having thought about this kind of stuff for decades now. It’s really hard to give advice here. (“I’m an immigrant which often comes with a particular work ethic” or “my parents were not as supportive as they should be when I was growing up, so I try harder” are not particularly… actionable.)

But one advice I will give: I invested a lot in infrastructure of the blog, so I can focus on writing, and I don’t get exhausted by menial production tasks (except those I like).

For example, I have my own little markup language in Notes, so for example I can say [device frame:nothing phone] and the dragged image or video get automatically framed without me doing anything else, so I can focus on writing.

Here are some other tags in my markup – I’ll let you figure out what they do. (I have to use different brackets here so they don’t get interpreted!)

{side by side}
{border on dark}
{border on light}
{force retina}
{no height limit}
{thumbnail}
{secret}

I also wrote a little app that’s a wrapper around imagemagick and ffmpeg to allow me to quickly deal with image and video production as this is the least pleasant part of the job:

Having my own blog backend and frontend can be frustrating, but it also allows me to slowly improve things, which is important to me. I have a long to-do list of things that I want to do better, and I slowly chip away when inspiration strikes (or, when people report bugs). I want to try 120fps and P3 videos, more interactive elements, better information architecture, nicer visualization of keyboard and touch events. I have tons of bugs to fix.

I recognize this flipflopping from previous projects – when I work on presentations, I sometimes switch over just to “making slides pretty” and this keeps me excited and still helps me figure out what I want to say, but in a roundabout way – and learned how important it is for me. I love that I get to improve a surface for my writing alongside doing the writing. I think it’s really cool this is even possible.

Speaking of writing

I write in Apple Notes, mostly on my Mac (but occasionally on my iPhone on the go). This is an example of a published post in its natural habitat:

My general writing process is very messy – I start with specific ideas or links or even phrases and drop them in, and then I write around it. It always feels 20% done all the way until it’s 100% done; at this point I’m used to this curve.

Here’s an example of a post I’m not working on actively, but kept adding to over the last weeks:

As I flesh a post out, I use a lot of TKs for future phrases and also to denote assets (images and videos) needed, and occasionally put to-do items in there, too.

Each note can also have a “graveyeard” section where I can keep random thoughts and that section doesn’t make it to the blog. I like keeping it in as a sort of artifact of messiness of the creative process. Here is it in a recently published note:

At some point during writing, I throw it over from Notes to the blog to see how it actually feels. I usually do it too early, intentionally. The writing in Apple Notes looks rough and the assets are always sized strangely; seeing the note how it will actually look gives me momentum. It also engages a different part of my brain, as I can more seriously think of how the images or videos help to tell the story.

What else?

I occasionally revisit my goals and principles, but they’re mostly in my head.

Once I decide to finish writing something, I try not to have more than 2–3 items in that state.

I do not use AI in any way for writing; I am very protective of this thing I worked on for most of my life. If I use AI for research, it’s for simple Google-like questions, the answers to which I never fully trust.

Tools

I write in Apple Notes, which I fell out of love with for actual note-taking. I code in Nova, although I struggle with some of its bugs and design decisions. I record screen with either native recording or CleanShot. I edit photos and videos with my little tool and command line, but I still occasionally reach out for Photoshop, which I’m not happy about.

Anything else you’re curious about? Let me know!

Unsung @ 500: Nine design details

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

1.

Clicking or tapping on Newsletter or About links just above reveals the options in small drawers underneath, hopefully making it easier to engage without having to deal with new page opening, and so on:

2.

You can still ⌘-click on those links to open full pages. And the mouse cursor changes to the hand whenever you hold ⌘ to match the difference in behaviour:

3.

All the random posts are on a loop, so you can keep clicking to read the entire blog without ever encountering anything twice. (Well, at least if you do it in between post publications, as each new publication recomputes the random chain.)

4.

However, if you keep ⌘-clicking on “Random post,” each click will generate a different post, so you can spawn a bunch of tabs to read and then close them all.

5.

Even though Warbler (the body font) has old-style numerals, I turned them off so that the site doesn’t feel too old-fashioned, but also maybe too pretentious.

6.

In the title, I shortened the underline a bit so that it ends just at the base of the Y. (Wrapping that letter in a span also broke the kerning pair, so I had to compensate for that also.)

7.

You can press / or ⌘/ or ⌘K to get to search at any point.

8.

I used to do it by hand, but now every YouTube video link also shows the length of the video automatically. (This below is a static image and not a link.)

9.

The diagonal dividing lines are aligned optically to the left spine on desktop, but slightly more to the center on smaller devices:

I also updated the Cursed knowledge page with some things I learned, and lightly updated Technical details – although with this one I usually wait to hear what people are curious about.

Unsung @ 500: The new design

Unless you’re reading via RSS, welcome to Unsung’s new livery!

I dreaded even attempting the redesign, but as I was adding full-text search to the blog, I realized the previous simple frame couldn’t accommodate it – no matter what I did, the search felt bolted on. I suppressed my PM side, decided to scope creep, and the 500th postiversary provided a good arbitrary deadline. (This is post №492, so hopefully I’m not jinxing it.)

One trick helped me. I decided to start the redesign coworking from a friend’s startup in a cool Chicago building, for the first time ever, hoping that the new surroundings will inspire me. It worked!

Functionality

The main impetus for the redesign was to recognize the blog’s growing body of work and make Unsung more evergreen, and something one could revisit in the future as a resource. Here’s what I did:

  • There is now a “Random post” link – I’m hoping it becomes a delightful little way to poke around.
  • There is also a search that can help you find an older post or navigate the site in a different way.
  • The sitemap shows all the tags, now with light commentary.
  • Posts that are in a series are now connected through navigation:

I also added a way to follow and comment on the blog posts on Mastodon and Bluesky, on top of existing RSS and weekly email digest.

Visuals and interactions

The first edition of Unsung was the default Montaigne styling (just so I could focus on writing and establishing a routine), and the second edition borrowed a lot from the design of my main site, Aresluna:

For this first proper design of Unsung, I wanted something more distinct, something that wouldn’t feel too “computer retro,” and something that steered clear of the preeminent AI aesthetic.

The fonts I chose:

  • The body font is David J. Ross’s Warbler,
  • The sans serif working hard (and occasionally having fun) is David J. Ross’s Bild,
  • The logo font that you will see pop-up occasionally elsewhere is Neonoir by Phospho Type foundry, with some modifications.

The color – well, didn’t you see me yearning for something evergreen above?

Just kidding. I liked this factory green in a few places I spotted it recently, and I thought it felt appropriate, and beautiful in its own pedestrian way.

A lot of the design tenets of Unsung are still the same as before: no rounded corners, no shadows, no blurs, and a general distrust of symmetry. Plus, there are now a few more uneven surfaces.

I could write some bs about how the sharp edges vis-à-vis the flowing neon text (and the neon-inspired icons I designed) represent the tension between craft and manufacture…

…but, I don’t know. A lot of this design stuff is rattling around in different parts of the brain and doesn’t bubble up to the surface where words live. It just felt to me the contrast was fun.

Personal goals

Because yeah, in addition to all the explicit and implicit goals, I also wanted to have a bit of fun and learn new things, and add a bit of delight, which hopefully you will spot here and there.

I hope it makes both reading and navigating the blog more enjoyable.

Thank you to Naz Hamid and David J. Ross for their help with the redesign.

About Unsung: Recent improvements

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

Here are some improvements I’ve made to Unsung in recent months. Always curious of your feedback or pointers to places that do these things better!

Weekly emails

I made it so clicking on every (non-YouTube) video or image takes you to the equivalent of the weekly email you’re looking at, but on the web, where you can watch the videos in their natural habitat. It’s scrolled to the right position, so you can just continue reading there.

I’m sorry, I know it isn’t great to shove people outside of their mailbox, but I don’t think there is any way for videos to work well inside emails, and a lot of Unsung is about precise videos. (The only thing allowed is GIFs, and they are really not up to the task.)

Video playback

On that note, I improved the handling and controls of video playback. On mobile, you can tap to play/​pause and swipe left and right to move. On desktop, you can drag the handle, or also swipe left/​right. You can also use ← → keys to advance frame by frame.

My goals are to have video controls that are both minimalistic (for example, never covering the contents) and precise, to match how videos are used here. (But if you tab to the video, it still shows “classic” controls for accessibility.)

Blink comparators

You might have noticed that I added some blink comparators in a few posts where they seemed to be useful (one, two, three, four). Is that fun? Does it work for you? Because I have more ideas for light interactivity on Unsung.

Technical details

Some people asked technical details about specific things on this blog, so I added a technical details page with answers.

Dashboard

If you are interested in that kind of stuff, I added some more charts and stats to Unsung’s internal dashboard (and deprecated sentiment, which wasn’t really working).

About Unsung: Thanks for your feedback!

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

Thank you for all your feedback and bug reports in response to my call two weeks ago. Since then, I:

  • revamped the image and video pipelines, which should make the blog load a lot faster and CPU/GPU struggle a lot less,
  • improved inline video handling on the web, and in (some) RSS readers,
  • made transparent videos work in Safari, and figured out how to make even better transparent videos,
  • improved Friday newsletters so they have a link to a nice web view, and GIFs hinting at video content (alas, you cannot put videos straight in email),
  • and generally made the site work better on older computers and phones.

If you see anything wrong or funny as a result of these changes – or any technical problem otherwise – please let me know (contact info is always in the footer). And, in general, please continue with your thoughts and feedback about content of the stuff I post, too! I’m enjoying hearing from you.

Unsung @ 250: Please send me your feedback!

My original idea for Unsung was “a microblog with ~3 posts a week,” which seems like a distant memory.

Now that I published 250 posts since early December, what better way to celebrate than to ask for feedback?

  • Do you enjoy specific kinds of content, or missing some topics?
  • How could I make the visuals and interactions better?
  • Any fun little ideas or bugs or improvements I could make?
  • Any feedback about this blog’s information architecture (including the just-added tags), RSS, or the weekly email?

You can reach me via email, on Mastodon, or on Bluesky.

If the very idea stresses you out, I want to give you permission to send me just your bit of feedback without any greetings, or small talk, or “compliment sandwiching.”

Thank you in advance!

Unsung @ 250: Nine design details

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

I thought I’d share a few of the small design details I am proud of for this small blog!

1.

After years of being annoyed at Slack for mishandling image sizes, it was important for me to show the screenshots (at least the desktop UI) at their 100% precise size, if possible. I think that helps to get a better sense of a scale and feel of things. This was harder than I expected (since I still want images not to grow too wide or too tall), but hopefully works well now.

2.

I wrote some extra code so that if an image has edge transparency or even soft shadows, it will be aligned accounting for all that. I think that feels elegant – especially on a blog that practices asymmetry probably to a fault.

3.

If the images or videos blend too much into the background, they get a lil border to separate them – but only in light or dark mode as needed. This is so that the whole page rhythm holds better together. (Manually assigned so far. Would be curious if one can make this automatic.)

4.

Speaking of dark mode, I almost figured out how to make videos with transparent pixels so that they look good in both dark and light mode. (Chrome only. Still working on it for Safari.)

5.

I want autoplay videos (without sound!) so that it’s easier to see interaction design – basically, a modern version of what GIFs used to provide. This has been challenging and required adding some JavaScript, and is still not done! But it’s starting to feel nice.

6.

Given all the quotations I do, I added hanging quotes to text. Wildly, they are still not really supported by CSS (Safari is a sole exception), so that required some manual intervention.

7.

Short lists are (automatically) spaced differently than long lists. I’ve always wanted to try that.

8.

I’m having a blast with the pixel fonts I recreated from PC/​GEOS. I keep adjusting the glyphs, adding kerning pairs, etc. It’s fun to keep improving a font as you’re improving its surroundings; I just redrew the @ glyph you can see above!

9.

It’s a bit old-fashioned, but I still like the idea of visited links being styled differently than non-visited links, to help you orient yourself. (Linking feels very important to me.)

Unsung @ 250: Goals and principles

This is a meta post about this very blog. If that’s not interesting to you, skip to the next one!

At Unsung’s 250-postiversary, if I reflect on where this blog has been, and where it might be going, this is what comes to my mind. I didn’t start the project by writing all this down, but I held a lot of this in my head. This feels like a nice moment to capture all this more deliberately, and perhaps some of you might find it interesting.

Goals of Unsung:

  • Highlight hard, good, invisible design work that makes things better, but doesn’t often get spotlight.
  • Find deeper meaning in craft, past the pretentious platitudes and surface-level delight. (Details matter not just in some abstract “craftsmanship” sense.)
  • Help expand what craft means: highlight relations between things, show connections between history and present, talk about things that are hard to describe and impossible to measure.
  • Revel in being pragmatic. Share useful things, not just hollow inspiration.
  • Be fun to read.
  • DIRECTIVE 6: CLASSIFIED_

Higher-level principles for this blog:

  • Don’t ever share boring stuff, even if the concepts are good, or out of completeness. If you’re not enjoying reading or watching something, assume the audience won’t either. (You can occasionally salvage something boring by providing a non-boring commentary, but try to use this sparingly.)
  • When you share something, always try to add your perspective or connections. At the very least, excerpt the most useful thing. This blog is QT, not RT.
  • Find a good balance between positive and negative examples.
  • In general, offer variety. The weekly digest should have both depth and breadth. (For the last two points, I made a little dashboard to give me some insight, although the sentiment analysis there right now is pretty worthless.)
  • Be opinionated, but also humble and curious. You don’t know everything.
  • Be candid, but not cruel. Punch up, not down.
  • Avoid ridiculing, “walls of shame,” and so on. Even if the work you share is horrible, turn it into a lesson or two.
  • This is not about people, but about work – except in some occasions it might be about people, so be candid when that happens.
  • More links is better than fewer. Good linking rewards curiosity and is a form of curation (example 1, 2, 3). However, the post should stand on its own even if one doesn’t follow any of the links.
  • Make an effort to showcase work by women, people of color, underrepresented minorities, and so on.
  • Visuals are engaging and helpful. Think about them, but do not add gratuitous, irrelevant photos just to meet the quota (example 1, 2, 3).
  • The best way to teach something general is to show something specific.

Lower-level principles:

  • Credit people by full name.
  • For longer videos, offer their duration to make it easy for people to make decisions about when they want to watch them.
  • Avoid linking to X and Substack. (It really breaks my heart how much of the design community still supports particularly the former, given all the damage we know X inflicts on society.)
  • Don’t use this blog as an example (e.g. by screenshots of itself), as this is generally confusing.

Personal goals:

  • Practice writing things that do count in less than thousands of words.
  • Do things differently – this blog is authored in Apple Notes, for example, which is kinda weird to a person like me who always writes straight in HTML.
  • Have fun and learn working on this (completely custom) blog platform on the side.
  • Give back some of what I learned in my career over the years.
  • Practice stating my opinions and standing by them.
  • Learn new things (about what I’m writing and about publishing on the web); the only way to teach something is to understand it yourself first.