Pat Dryburgh

Design is how it works

or, how not to design a website for a preschool

It has always baffled me when a company offers a lower salary to designers than to developers. My assumption is this derives from an inaccurate understanding of what design is and the role it plays in creating a product or system.

A designer’s role is not to make something “pretty” or to help a product “stand out.” It is to identify a problem, iterate on potential solutions, and bring the resulting product to market. Or, as Steve Jobs famously put it:

Most people make the mistake of thinking design is what it looks like. People think it’s this veneer – that the designers are handed this box and told, ‘Make it look good!’ That’s not what we think design is. It’s not just what it looks like and feels like. Design is how it works.


Even the bots don’t get it

Recently, I’ve been seeing ads from a company called B12 who claims to use artificial intelligence to design websites in 60 seconds (in my day, we called these “templates”).

The example provided is a website for a preschool. On the left is presented what’s purported to be an old, crusty layout juxtaposed with a sleek, modern layout on the right. Unfortunately, this example also shows a fundamental lack of understanding of the purpose of design.

A Facebook ad from B12

No doubt, the website on the right looks nice. It fits into the latest design trend of having a minimal layout, a massive background image with a text overlay, and a single primary call to action. It’s probably even responsive, likely tucking all of that useful navigation into a hamburger.

However, I would argue that the website on the left is a better design. Without scrolling, clicking, or doing anything other than loading the page, the website on the left tells me:

  1. where it is. The ad is so compressed that you can’t really read the menus on either design but if you zoom in, you can see that this preschool is located in Summit, Missouri. I couldn’t point to Missouri on a map, so I know this preschool isn’t for my (hypothetical) kids!
  2. what ages it serves. Several times since I left preschool, I have heard about kids who are starting preschool younger than when I did. By the time I become a parent, I very likely will not know when I should be sending my kids to preschool (though, I’m sure it’s in a handbook that’s given to every parent who gives birth at a hospital). The website on the left gives me that information up front.
  3. its operating hours. I work for myself, so my schedule is pretty flexible. Most people don’t have this level of flexibility, so knowing when a preschool is open has to be one of the key indicators of whether it works for them and their children.

In contrast, the website on the right tells me my kid will feel “right at home”. However, I have no idea where or when they’ll feel this. I’m sure I could click that green button under the main headline to find out more. That is, if I’m not colour blind.

Of course, I might not even get that far if I’m part of the 23% of the population of Missouri that is underserved by broadband connectivity in the 42nd most connected state in the union because that picture is so fucking big.


There are certainly aspects to design that require creativity and even an artistic flair. Understanding typography, colour theory, Gestalt laws of grouping, and many other facets of design are certainly critical to the acceptance of your solution into the marketplace. However, these are not the only aspects to design. You must also understand the constraints and objectives of the audience you are designing for and the context and medium through which you will communicate with them.

Design isn’t just how it looks. Design is how it works.

Any podcasting friends able to help me understand why my podcast feed isn’t working in @OvercastFM? Episodes appear in Apple Podcasts, Castro, and Pocket Casts, but not in Overcast and its developer does not provide support.

Update: Overcast now appears to be syncing my podcast properly. Not sure what the cause of the issue was, so unfortunately I can’t share any helpful info if you run into a similar problem.

#newtwitter sees the Twitter web interface itself become a kind of platform. Previously, developers took data out of Twitter and into the context of their own applications and services. The new design flips this on its head, bringing rich embedded content into the site from a host of brand-name web properties.
Alex Payne former engineer @twitter, Sept 15, 2010

I remember reading this post when it was first published and recognizing that the end of Twitter as I had come to know it over the prior three years was gone. In its place, an infamous #dickbar.

Most of you don’t know that I deleted my Twitter account. In fact, in 2013 I deleted almost every social media profile I had, save for my email and maybe a few other things.

I came back because despite the #newtwitter reality, people still wanted to live in a silo.

I wrote earlier today that there are some benefits to no longer having like and retweet counts and streaming in third party clients. I recognize that’s not the attitude everyone has about this. I’m hoping what comes out of it is a realization that humans operate more efficiently outside of silos, and that a lot more attention is paid to the idea of an Independent Web. Tools like text editors and RSS feeds may well end up the winners in the end.

Anyone else enjoying the feature reductions in Twitter’s third-party clients? They are starting to feel like they respect my time and attention more now than they did yesterday.

A walk to a restaurant

Thought I’d try out my new podcasting setup today while walking down the street. This could be almost too easy.

Publishing a podcast from an iPhone using @Workflowhq, @WorkingCopyApp, @jekyllrb, and @github Pages

Yesterday, @roland sent me an audio message on Micro.blog. He then shared his process for recording, encoding, and publishing his audio.

I spent the next several hours working on my response.

I knew in doing so, I needed to make one important improvement to the process: I wanted to do everything – record, encode, and publish – on my mobile device.

Before I dove too deep, I needed to prototype my idea. I had to answer 3 questions:

  1. Can I record audio on my iOS device in a way that allows me to then encode it as an MP3?
  2. Can I encode that MP3 as a base64 string?
  3. Can I write the base64 encoded MP3 into the iOS Git client Working Copy using the base64 encoded string?

I opened up Workflow (which is being rebranded as Siri Shortcuts later this fall) and was pleased to discover the answers to questions 1 & 2 were a resounding “yes!” Workflow has a wonderful audio recording interface. Once I had the recording, I tested the base64 encoding by encoding, then decoding, then previewing the decoded audio file, proving that I was, in fact, able to record and encode an MP3 using Workflow.

Then came my first hurdle: trying to write the MP3 using Working Copy’s x-callback-url scheme.

While I could pass the base64 encoded string to the x-callback-url that would open Working Copy, and I could see a properly-named file sitting in the path I had specified, I could not get the resulting MP3 to actually play.

However, there was a progress bar that moved and a track length displayed, so I knew something was up.

To test my hypothesis that Working Copy was somehow failing to play what appeared to be a properly encoded MP3, I saved the file to Dropbox for iOS and opened the file there.

It worked perfectly.

(Until writing this post, I assumed the issue was that Working Copy had a bug in its media player. Turns out, it’s one of those apps that doesn’t play audio if the silent switch is engaged. Not sure why some media players on iOS respect that switch and others do not, but it’s a real pain in the ass to have to remember that when testing media on an iOS device.)

Once I had determined I would be able record the audio and write it to Working Copy, all that was left was to duplicate a Workflow I had created last year for posting to my Jekyll-powered blog and add the audio capturing, encoding, and writing actions to the top.

The result is the first audio post ever published on patdryburgh.com.

Of course, once I had done that, I knew I had almost everything I needed to publish a podcast from my phone.

So, I spent the next hour or so writing and validating and writing and validating a podcast.xml file that now lives at http://patdryburgh.com/feed/podcast.xml.

This morning, I received a confirmation email that my podcast has been added to the iTunes Podcast directory.

All of which is to say, I can now record and publish podcasts to my Jekyll-powered and Github Pages hosted blog and have it syndicated to Micro.blog, Twitter, and iTunes all from the comfort of my bed.

Now, to find something useful to do with all this magic.

This is how I recorded this one’s for Roland (@rtanglao)

  1. Created a Workflow based on a previous Workflow I had created for posting to my Jekyll site from my iPhone via Working Copy
  2. Added steps for recording and previewing the audio, encoding it to MP3 and then base64 and storing that as a variable
  3. Pass the base64 string through an x-callback URL that writes the file to my local repository
  4. Come back to Workflow to paste this text into a text field
  5. Store this text as a variable
  6. Pass that variable through to my standard x-callback URL for posting content on this site
  7. Frantically refresh my blog hoping I can spot and fix any bugs before Roland notices
  8. Quickly load the post in Working Copy and edit the incorrect scr in the audio element caused by an errant variable
  9. Come back and try it again when site.baseurl is discovered to not work on my site
  10. Realize it still isn’t playing in Safari, so pull the latest from the repository onto my Macbook Pro and rebuild the site locally to test
  11. Realize that adding a source element inside of the audio element works, but wonder why Roland didn’t seem to have to do this on his post ¯\_(ツ)_/¯
  12. Go back into Workflow to update the Workflow to match the new markup

A lesson about Canadian residency determination laws

If you’re a Canadian citizen and plan to leave Canada for more than 183 days of the calendar year, make sure you first file an NR73 form to establish your residency status. I wasn’t aware of this law until a month ago when the Canada Revenue Agency demanded an additional $4,100 in taxes because I was out of the country for two weeks longer than permitted.

I have submitted an NR73 for the 2017 tax year and hope that I can prove I had maintained close ties to the country — all of my personal belongings, my family, and my common law partner were all here while I was away — but there’s no guarantee that they’ll change their determination.

Had I known about this law at the time, I probably would have used a tool like this one from Nomad List, which tracks the number of days you are out of your home country. (via Boris Mann)

Now all I have to worry about is what could happen when I plan to return to Uganda.

If you’re planning to live a nomadic lifestyle, please learn from my mistake.

Note to self: ⌘ + ^ + D and ⌘ + ⇧ + D produce very different results when composing an email in Mail.app.

This album by Alex Mason is the first I’ve ever heard that was recorded in my hometown but wasn’t recorded in my friend Simon’s basement.

Pushed an update that refreshes the design of my portfolio last night. Working on some new case studies to be added over the coming weeks.

If you’re new to Jekyll (or Git, or development in general) and are interested in contributing to a theme, I have a few good first issues listed in the repository. Great way to dip your feet in and learn!

Last night, I added pagination support to the Hitchens theme. Also made some minor tweaks to the masthead and paragraph leading. If you use Jekyll, I would really appreciate your help testing it out. Thanks!