Posts about Design

Adobe abandons Figma purchase

The Verge reports that Adobe and Figma no longer plan to merge, largely thanks to legal pressure from the EU.

First off, this is great news. Adobe acquiring Figma was obviously bad for the industry, at least from the perspective of the designers who work in it. Adobe has a history of buying and subsequently squashing beloved industry tools.

Figma is also the only player keeping Adobe from a total market stranglehold. Bohemian Code’s Sketch would be a player if they offered a Windows app, but they’ve chosen not to pursue that market (and I think missed a big opportunity in the past decade as a result).

For the most part, life now goes on: Figma gets to do their own thing, Adobe does their thing, and all the smaller players (of whom Sketch is probably the biggest) keep doing their things too.

That being said, it’s not all sunshine and roses here. Adobe sunsetted XD, their design tool competitor, shortly after announcing the Figma acquisition. That tool has been dead in the water for a year, with little to no updates in that time. 

I have colleagues who use and like XD who will now have to migrate elsewhere. And let’s not forget the XD team: the folks Adobe had working on XD over the years were all top notch and had great ideas (Khoi Vinh is one of my heroes). I don’t know if those folks are still at Adobe. While life goes on for most of us, this sideshow has caused some actual destruction for a few.

In classic Adobe tradition, nothing meaningful has been accomplished, and a lot of people got hurt along the way.

Does good web design hurt or help?

Dan Mall’s recent post struck a chord with me when I read it. The whole post is worth reading, but in an effort to avoid quoting the entire thing, I’ll simply share his opening statement:

This past week, I finished making a small website for a family member’s business. I had an idea I liked for a subtle header animation. As I sat down to do it, I couldn’t justify how that animation would make the site any better at its job — attracting potential clients — than the static, non-animated version would.

It got me thinking: could I justify an animation for any website’s header? Can anyone justify an animation for a website’s header? A quick glance at the latest Awwwards Site of the Day nominees shows that lots of modern sites have animations in the header. But it is worth the effort to make?

This is something I’ve been thinking about a lot in the past few weeks. Dan acknowledges in his post that, of course, web design has changed a lot. These days, as he says, we live in a world where a Kardashian or a Youtuber can launch a product or even an industry with a tweet or an Instagram post, a role previously dominated by The Website.”

I think there’s another change that happened: websites got a whole heckuva lot easier to make. If a designer’s primary job was to live at the intersection of art and commerce, that job has been eradicated at the low end by shrinking budgets and easy-to-use website builders like Wix and Squarespace.

The remaining websites are either vanity projects for large organizations (designed to attract attention and brand cachet), or they are designed as business tools for whom conversion is their primary purpose. If conversion is the primary purpose, there is less space for design. As Conversion Rate Experts says:

Some people ask why they shouldn’t optimize for function and aesthetics. Even if their visitors are perfectly happy with the current appearance of the website, what’s the harm in being beautiful regardless?

It’s like asking What’s the harm in giving Usain Bolt an egg and spoon to carry while he runs?” They don’t realize that beauty, like an egg and spoon, tends to slow progress to a crawl.

If I’m being very cynical about my own work, I think Amazon has proved that web design is more important than ever, but beauty is less important than it’s ever been.

That doesn’t mean making something beautiful is irrelevant. I’m working on a highly-polished website for a non-profit right now. Their design has a lot of attention-catching elements (several are mentioned on this list), and even relies on a motif. That being said, the non-profit sector is a space where cohesive design goes a long way to generating goodwill from potential donors.

I don’t entirely know where I’m going with this, but I do know that web design is still a young field. I think the jury is out on whether or not good design can have a negative impact on conversion, which is really what people pay for. (If you spend a bunch of money on a site, but get no return on that investment, you are probably not getting what you pay for.)

That all being said, I think the days of being in this for the art — like a modern-day Andy Warhol — are mostly behind us. All that matters is the conversion rate. Usually, we aren’t hired to make art. I too hunt for those jobs, but I increasingly feel like a hungry lion in the jungle craving a penguin.

Name Sans, subway typography, and the TTC

I am in love with Name Sans, ArrowType’s metro-inspired typeface. Not only is the typeface really good, but the web page is nice too. A lot of type foundries have websites that are borderline unusable, but this is simple and demonstrates what makes the face unique, all without making me feel like I’m entered a funhouse.

When I lived in Toronto, I was fascinated by the typography in the subway system. A lot of the type was rendered in Helvetica or Univers, but some of the walls used Toronto Subway,” a bespoke typeface originally designed in the 1950s, but redesigned in 2004 by David Verschagin because the original design was missing characters, and nobody knew who the original designer was.

Here’s a quote from Wikipedia’s article on the topic:

The font was recreated by David Vereschagin in 2004. Because the original designer of the font is unknown, and no documentation of the font had been kept, Vereschagin digitized the font by visiting stations and making rubbings of the letters on the original Vitrolite glass tiles as well as taking photographs. This is now used by the TTC as their font for station names. Vereschagin designed a matching lowercase, inspired by Futura and other similar designs. As one of the few typeface designs to have originated in Canada, it was used in a number of zines as a mark of local pride.

You can purchase Toronto Subway from Fontspring.

Joe Clark has also written a great paper on the topic (in fact, it might be one of my favourite research papers I’ve ever read on the internet). According to him, Toronto’s subway typography involves the aforementioned typeface of unknown origin, subways lined with washroom tiles, a billion-dollar New York subway design system clone, a new design system from a wayfinding expert that was installed, tested, and ignored, and a billion-dollar corporation that uses as its main font a Helvetica clone that came free with Corel- Draw.” 

The most wild thing about Joe’s well-researched story is how all the half-finished design systems lurk across the city after decades. I lived there from 2015 – 2021, and I can confirm all these systems were never replaced or updated. It is not cohesive, and it makes the subway very confusing for people who are new to the city. In fact, people who are new to the city often can’t explain why they’re so confused by the subway system, the same way most of us can’t explain why inconsistent branding throws us off. But the inconsistent designs have left Torontonians confused for decades.

This one story is a perfect metaphor for Canadian politics: indecisiveness, a lack of vision, a lack of clarity, and occasional deceptive appearances of forward progress and momentum.

Ever since learning all this, I’ve paid a lot of attention to subway type. Name Sans is one of the better ones I’ve come across. It’s playful enough that you could use it for branding, but I think it’d make for good signage too.

I really loved Dan Mall’s latest post about answers to common design questions. Exactly the sort of thing I wish I came up with.

Design is hard in the middle

I’ve always found the work of design to be difficult. 

When I started working as a designer, it was difficult because I didn’t know what I was doing. I was tripping and stumbling in the dark, messing around in Photoshop and InDesign, trying to lay out magazine ads and technical manuals proficiently. I don’t think the work was particularly good; I may have had good taste, but I lacked the required skills to get there. 

Now that I’ve been working as a designer for over nine years — ten in October! — the primary challenges are different. As I get older, the blank page becomes more daunting, probably because I don’t want to repeat myself. I’d rather be like George Carlin and come up with new material for every project. But even once we get passed the blank page (try pen and paper first), the middle — the process — is hard. Design is not a straight line.

Good design resources about the process are scarce. I assume every designer struggles with this (especially post-COVID, when so many work alone from home with less immediate feedback), but none of us share the struggle in the messy middle. We just share the beautiful end results in our portfolio. 

In that respect, design is an odd creative field. Authors love to write books about their writing process. Filmmakers make documentaries exploring their craft. Musicians release demos as bonus tracks. But designers don’t share the process. We hide it like it’s some trade secret. Even Dribbble, ostensibly a platform where we can share what we’re working on,” is mostly used to share work we’ve finished.

The process is ignored.

My favourite video on the internet is Aaron Draplin taking on a logo challenge from Lynda (now LinkedIn Learning). I watch the video every time I get stuck, so I’ve seen it a few times: Draplin makes jokes, draws freely, zips around Adobe Illustrator and, most importantly, talks about all the cool stuff he has lying around his workspace.

The first several times I watched the video, I was amazed by the amount of junk Draplin collects (and worried that a key part of success as a great designer would involve becoming a pack rat). But I eventually realized that Draplin isn’t collecting these knickknacks; he’s noticing them. That act of noticing – of focused observation – is his process.

I think we as an industry could do a better job sharing how we work. A few years ago, I audibly groaned when a friend who was new to the design industry asked if I preferred Sketch or Figma. (I was kind of a jerk, I know. Dear friend, if you’re reading this, I’m sorry.) That question isn’t particularly interesting to me, although I think the evolution of our tools and the impact they have on us is worth watching and considering.

The questions that I think are most important: how do we do the work? How do we create focus? Where do we get our inspiration from? How do we survive the middle?

The tools and the output

For years now, we’ve heard new conventional wisdom from all the creative gurus: the tools don’t matter. You have everything you need to make what you want to make.”

It probably won’t be surprising to long-time readers of this site that I feel the opposite is true. The tools reveal the process, or at least imply our process. There is no right or wrong tool, so much as there are right or wrong tools for us.

No tool makes you better at your job, but the good ones make your job better. If you do high-end work with computers, a fast computer will always be a good tool. The right kitchen tools make cooking easier, or at least more fun. A good desk chair literally saves your body. Any tool that motivates you to do more of the thing you love has value.

George R.R. Martin does all his writing (very slowly) with DOS word processor. Specifically, he uses WordStar 4. That looks something like this. One could make an argument it’s not the best tool for the job. But it’s his process. The tool merely reveals his priorities.

On the other hand, tools that get in the way have no value at all. I recently auditioned Sketch for the first time in years. Since 2019, I’ve used Figma with all my clients. In 2019, these apps were quite similar, but since then, Figma has completely leapfrogged Sketch. Things that used to take me ten minutes to do in Sketch take ten seconds in Figma. This audition was incredibly revealing of how the tools have changed, how my process has changed, and how my work has changed.

But it got me thinking: does the tool change me? Does it change my output? Are all my designs just huge Auto Layout demos?

Constraints breed creativity. What do the tools breed in us?

A swipe file for digital designers

Copywriters have something they call a swipe file — a place they store bits of marketing and writing material they want to refer to later for inspiration. Austin Kleon’s Steal Like An Artist Journal includes its own swipe file.

Commonplace books have a similar idea: it’s a place to store your favourite stuff other people make. H.P. Lovecraft kept one. Ryan Holiday called his a project for a lifetime.”

You have to make your own wells of inspiration.

For many years, when I saw designs I liked and wanted to save for later reference, I would use Pinterest to save it, or simply take a screenshot and stick a copy of it in my Mac’s hard drive somewhere. (The latter is a much better solution than the former.)

Of course, a screenshot isn’t really enough. A good swipe file tells you where your inspiration comes from. It should include notes. Maybe even a full taxonomy. At that point, your basic file browser ain’t going to cut it. There’s no way to serendipitously discover things in the Finder.

These days, I like using Eagle, a macOS app that does a great job organizing all the visual media it saves. With support for everything from pictures to videos to full webpages, I think the app is a godsend. I was suspicious of it at first, mostly because it seemed to good be true, but it has survived three computers and a silicon transition without losing a single image, so I’m pretty confident in it these days.

It’s unfortunately Mac only, but it’s a darn good Mac app (if you like Mac-assed Mac apps). If you’re a Windows person or love your iPad for this sort of thing, I can’t help you. But I’d love to hear what you use.

When a design is in doubt

When in doubt, the answer is simple: reduce, reduce, reduce.

Didn’t Dieter say the best design is as little design as possible?

Probably still true. Probably true of words too.

(Edited for brevity.)

Further Sketch news in Figma’s world

I was saddened to hear about layoffs at Sketch. No company deserves to suffer layoffs, and certainly not a company that has done so much for its industry as Sketch. If you’re hiring, it sounds like the 80 people they’re letting go would be great for your team.

After Adobe bought Figma, I suggested to a couple different teams I freelance with that we could try Sketch again for our workflows. I’ve been impressed with their marketing efforts since the Figma acquisition (sadly it sounds like the marketing team is who they’re letting go of), and I miss using a Mac-native design app. 

Sadly, I think this ship has sailed. None of these developers are in love with Figma, and all of them hate Adobe, but Sketch being Mac-first immediately ruled them out for the teams I’m on. I wish Sketch took the Affinity route: build an amazing Mac app, and then build out native Windows and iPad versions. That could have made Sketch an unbeatable proposition in an increasingly tool-agnostic world.

It’s Figma’s world now. And in Figma’s world, it’s hard to beat ubiquity.

Redesigns in the open

Two of my favourite designers on the web are writing about the redesign process of their websites, as they’re designing them. The first to do this was Johnnie Hallman, who introduced the concept here. His posts have been enlightening, as always (he’s got me interested in Contentful, which is saying something).1

The second designer to take this on is Frank Chimero. I’ve been reading Frank’s writing religiously since 2013, when he was interviewed in The Great Discontent. It was obvious right away that he had a unique perspective on design, writing, and web development. I’ve read his blog multiple times over, studied every iteration of his website, and read his book several times. Needless to say, I’m a huge fan.

With all that being said, it’s been a delight to read through his thought process as he redesigns his blog. Many of his concerns regard typography, which is something I’m also obsessive about. Frank is sharing images of his process as he designs his website in the browser, and sharing how he approaches his work from the outside in,” as he often says.

Some of my favourite posts from Frank so far:

  • Perfect Trifecta: an examination of the moods and aesthetic Frank considers for his website.
  • Looking at Letters: in which Frank blows up typeface sizes and dissects, at great length, the way he compares the differences between similar typefaces (like Source Sans and National 2, or Scto and Untitled Sans). If you’re into type, or you’re a designer, this is the sort of writing from which we all benefit.
  • Scales and Hierarchy: Frank demonstrates the way he sets font sizes and line heights, and then talks about creating hierarchy with spacing, weight, colour, size, differing typefaces, and design accents.

Frank and Johnnie’s posts have illustrated what’s been missing in contemporary design writing, at least for me: none of us are writing about how we do the work. We’re sharing finished products and listicles. There is a dearth of education design writing that exists to do something other than market ourselves. 

I’m not redesigning my blog (yet), and I just launched a new version of my portfolio, but I’d like to start writing material like this myself.

  1. For those of you who don’t know, Johnnie also makes Cushion, a delightful web app for freelancers that helps them invoice clients and plan their projects. I have been a paying customer for years, and it’s very excellent at what it does.↩︎

Things I like: Söhne and the new Klim Type website

I’m super late to the party on this, but I’m a huge fan of Klim’s new(-ish) typeface, Söhne, as well as their amazing new website. Really, really clever website, and the face looks gorgeous.

How to design a better portfolio

About a week ago on Twitter, I asked a poorly phrased question, which I’ll re-phrase here for clarity’s sake:

Why do designers focus on images in their portfolio’s archive, instead of properly describing their work?

This is something I’m just as guilty of as the next designer. Here’s an image of what my portfolio looked like at the time of the tweet. You can find countless other design portfolios that riff on a theme just like this.

A screenshot of my earlier portfolio

My favourite portfolios are really image-heavy, and I suspect that’s true for most people. Those portfolios are so fun to look at and make. But I often find myself wondering if those portfolios are effective.

If you’re a potential client, why would you click on a thumbnail image? Some designers might hope that the thumbnail tells the story of their project, but the thumbnail is inconclusive at best and misleading at its worst. It often shows off what the final result looks like, but it doesn’t share the thinking behind that visual approach.

But that’s what designers should sell. We need to sell the thought process that gets clients results, because that’s what a good designer gets paid for.

Design pricing is in a race to the bottom. Or maybe it’s already bottomed out. But I think a lot of that is because we’re showing off visuals, instead of explaining our process or discussing our results.

So I’ve made some changes to my portfolio. Now, when you visit the home page, you’ll see a list of every project I was proud to be a part of. Instead of images, each project gets a description. Some of those descriptions link to case studies, and some don’t — but the work is all present and explained.

I had a lot of fun making this. My portfolio isn’t as flashy as it was before, but I hope my portfolio will now be more effective.

Good design is a fight

If you’re a designer who works with clients on a regular basis, it’s easy to be exhausted. Working with clients is hard! I’ve seen many designers, myself included, shake their heads in despair at client requests. I’ve also seen a lot of designers give up fighting them. 

But you can’t. The fight is what leads to good design. Good design is a fight. 

I’ve known one of my current clients for years now — probably getting close to half a decade. They’re a great crew, and the boss is a fantastic guy to work for. But we got into a few arguments on the most recent project that ended with me apologizing for the ruckus once the whole thing was over. 

The client simply said this: it’s okay. Arguing is part of good work.”

If you want to design something of value, you’re inevitably going to upset people. Design is saying no to a thousand ideas so you can say yes to one good one. That naturally leads to arguments. 

But don’t be disheartened: the best designers, in the world’s most desirable companies, fight every day. It’s a fight to make something worthwhile. But it’s a fight you can win.

Awesome design alert: the Helsinki Philharmonic Orchestra

I’ve been meaning to talk about the new brand identity of the Helsinki Philharmonic Orchestra for a while. This is absolutely wicked stuff from Bond Agency, a top-notch graphic design studio.

A large version of the Helsinki Philharmonic Orchestra logo

A few years ago, I did the design work for a music magazine called The Modern Producer. (I should really put that case study back up on the website; it was great.) One of the things I had fun with was the idea of using a waveform in the logo. The branding for the Helsinki Philharmonic Orchestra takes that idea so much further. I absolutely adore it.

The branding for the Helsinki Philharmonic Orchestra in use on print materials

I also love the motion that they bring into this identity. It all comes together beautifully, with clean typography and a real sense of energy. I get the feeling convincing people that seeing an orchestra is energetic is a tough sell, and this branding absolute nails it. I love every bit of it.

The branding for the Helsinki Philharmonic Orchestra is one of the year’s bests, folks. Check it out in all its glorious detail over at Bond Agency’s website. And Bond, if you’re reading this, much respect to you for this incredibly inspiring work.

Cooper Hewitt

One of the projects I’m working on is an identity project for a new Canadian charity. I’ve been trying to find a typeface that’s legible and distinctive, particularly in the regions of the world where they’ll be sending volunteers. I’ve found myself entranced by Cooper Hewitt’s typeface, which is open source and available for unrestricted public use.

In researching the typeface, I stumbled onto Pentagram’s new-ish case study about the project. It’s a very long read, but so incredibly insightful. In truth, I haven’t finished reading it yet. But the case study’s awesome, and I couldn’t wait to share it.

Check out Pentagram’s case study here.