While I don’t think you should publish to Medium (at least not as the only place you publish something, you should write on your own site that you control), I get why other people do. You quickly sign up, write some words, hit publish, and the result is a pretty clean-looking presentation of your writing. Not to mention familiar to the general public. Medium is big and popular enough that people have seen it and are comfortable with it. I mean Barack Obama writes there so goes a long way in terms of endorsement.
It’s that clean comfortable design that I think it’s especially notable (when it’s not being covered up by a mysteriously activated paywall). So it’s interesting to see their designers write about the effort that goes into that look. Breana Jones says they re-focused on the single-column look:
We’re bringing back the single-column page layout and removing the two-column layout across all stories on desktop.
You can still find recommended stories from Medium and author bios, but these sections will now be below the story, instead of right next it. This allows readers to focus on the story without any distractions on the side.
I applaud that, really. The single column look really works great on the web for primarily written content and it’s harder than it looks to pull off, especially at a huge company with lots of business objectives fighting for space on that screen.
Design does tend to be associated with cleanliness. Like a “clean” design is a “good” design, generally, especially when we’re talking product design for wide varied audiences. I like how Matt Birchler says:
If you are sitting next to someone at a computer and you know how to use the thing and they don’t, it’s very easy for you to say, click here, do this. When you click this, this is what’s going to happen. It’s very easy to do that. The goal of a good user interface is to give someone that experience without you having to be in the room with them.
That’s as good of an explanation for digital product design as I’ve heard. I caveated it with “digital product” because design is a pretty broad discipline. Designing a wooden bookshelf is a pretty different endeavor with different constraints and goals. Wood has a grain that the designers will work with. The web, too, has a grain. Amelia Wattenberger says:
In the digital world, especially on the web, we’re used to things being stacked vertically. Scrolling, scrolling, through boxes of content, one… on top… of another.
Things are always arranged linearly — top-to-bottom. Or, if we’re feeling spicy, left-to-right.
This is all great for neat, orderly content. But what about when thoughts are complex, unsorted, exploratory?
This is her introduction to thinking about infinite canvases, which is a little against the grain on the web, but absolutely doable and sometimes quite useful. Consider how you can drag and zoom a Figma canvas anywhere without any constrained edges at all. But this approach isn’t just for design, it can be useful for things like thinking through problems with teams, doing organizing and grouping.
I love me some good “general rules” for design concepts. There is so much nuance and it depends situations in design and development, when there is some just do this advice I appreciate it. I think of things like how headers always have less line-height than body text, things should align with other things, and you should probably double the white space.
CodePen’s own Rachel Smith has some excellent general advice in this vein that I didn’t really understand until now:
If you’re moving an object from out of the frame/stage in to the frame/stage, use an
ease-outvariation.If you’re moving an object from inside the frame to outside the frame, use an
ease-invariation.If you’re moving an object from one place to another in the frame, use an
ease-in-outvariation.
I can remember that!
Lemme leave you with a little one: Magick.css. It’s one of those “just link it up and your semantic basic classless HTML will look nice. It’s got a pretty fancy look to it with some unusual font choices, but it might be your bag. My favorite in this genre is still new.css.